Share
Il existe de nombreuses façons de créer votre site Web de CV personnel..
Vous pouvez utiliser l'un des nombreux constructeurs de sites Web ou opter pour un CMS tel que WordPress, Drupal ou similaire. Vous pouvez également engager un développeur professionnel pour en faire un pour vous..
Avec autant de choix, il peut être difficile de savoir par où commencer. Pour compliquer encore les choses, chacune de ces options comporte un ensemble différent d'avantages et d'inconvénients, sans parler du niveau de difficulté ou du prix à payer..
Mais il existe un autre excellent moyen de créer votre site personnel dans un délai raisonnable. Et c'est en utilisant un modèle de CV HTML. Ils sont faciles à utiliser et à télécharger sur votre serveur d'hébergement..
Voici quelques-uns des meilleurs (à parcourir rapidement avant de lire):
En plus de cela, le code derrière un modèle de site Web de CV professionnel est beaucoup moins compliqué à comprendre pour un novice que les langages de programmation plus complexes utilisés dans les systèmes de gestion de contenu..
Dans cette partie de la série de sites Web Making a Great Personal Resume, nous vous expliquons le processus simple de modification et de téléchargement d'un modèle de CV HTML..
Suivez ce processus pour créer votre site Web de CV et le personnaliser en fonction de votre marque personnelle afin de pouvoir lancer votre site en un rien de temps..
Avant de commencer avec la modification de modèle de site, couvrons les outils nécessaires à la mise en service de votre site Web de CV HTML:
L'achat du nom de domaine pour votre site n'est que la première étape de votre voyage. Vous aurez également besoin d’un serveur d’hébergement sur lequel vous pourrez télécharger les fichiers de votre site Web. Trouver la bonne société d’hébergement n’est pas chose aisée, d’autant plus qu’ils sont nombreux. La plupart des fournisseurs d'hébergement proposent des forfaits d'hébergement de base entre 5 et 10 USD par mois. Certaines entreprises offrent une bande passante et un espace illimités, tandis que d'autres proposent des forfaits plus restreints.
Il est important de garder à l'esprit que presque tous les fournisseurs d'hébergement prennent en charge les modèles HTML. Lorsque vous magasinez pour une société d’hébergement, parcourez leur FAQ et assurez-vous que la société fournit un support client, si vous avez besoin d’aide pour votre site Web. Vous devriez également faire une petite recherche et lire les critiques d'un hôte particulier sur des sites Web indépendants pour voir à quel point leurs clients sont satisfaits..
Une fois que vous avez trouvé une société d’hébergement, vous devez télécharger un client FTP. Un client FTP vous permettra de télécharger votre modèle sur les serveurs d'hébergement. Le choix du programme FTP dépend du système d'exploitation utilisé par votre ordinateur..
FileZilla est un des programmes les plus populaires. C'est un programme FTP gratuit très facile à utiliser et disponible sous Windows, Mac et Linux..
Vous aurez également besoin d'un éditeur de texte pour modifier les fichiers de votre modèle. Vous pouvez utiliser Notepad ou TextEdit pour apporter des modifications, mais un éditeur de code facilitera grandement les choses. Contrairement aux éditeurs de texte classiques, un éditeur de code comprend des outils facilitant l'édition, tels que l'utilisation de couleurs différentes pour différentes parties du code, ce qui permet de voir plus facilement ce que vous éditez..
Pour les besoins de ce didacticiel, je vais utiliser Sublime Text, qui peut être utilisé sur Mac, Windows et Linux. La version d’essai est téléchargeable gratuitement. En savoir plus sur la façon de travailler avec cet éditeur de code populaire:
Les deux dernières choses dont vous avez besoin sont votre modèle de CV HTML et les images que vous prévoyez d’utiliser sur votre site..
Pour les besoins de ce tutoriel, je vais utiliser le Modèle de site Web de CV HTML Flatrica, montré ici:
Modèle de site Web de CV HTML Flatrica.Vous pouvez trouver votre modèle de site Web dans le Téléchargements votre compte Envato après avoir effectué votre achat. Une fois que vous avez téléchargé le modèle de site HTML, décompressez le dossier et enregistrez-le sur votre bureau pour un accès facile..
En ce qui concerne les images, vous aurez besoin de votre photo de tête et de toutes les photos personnelles que vous prévoyez d’utiliser. Vous pouvez également utiliser une image ou un motif d'arrière-plan. Assurez-vous donc que toutes les images sont stockées sur votre ordinateur afin de pouvoir les ajouter à votre modèle..
Maintenant que tout est en place, il est temps de personnaliser le modèle avec vos informations. Voyons comment personnaliser le modèle HTML Flatrica:
Avant de commencer à modifier les fichiers, examinons la structure de ce modèle HTML. Lorsque vous décompressez le dossier, vous remarquerez qu'il contient deux dossiers: l'un avec la documentation et l'autre avec les fichiers modèles..
Un regard sur les fichiers inclus dans ce modèle de site Web de CV HTML.Le dossier contenant les fichiers de modèle de site réels contient plusieurs sous-dossiers:
Outre ces dossiers, il existe également plusieurs fichiers HTML: index-normal.html, index-video.html, single-blog.html, et single-portfolio.html.
Gardez à l'esprit que votre modèle peut ne pas contenir tous ces fichiers et dossiers; Cependant, dans la plupart des cas, vous rencontrerez des feuilles de style, des images, du code JavaScript et des dossiers PHP. Votre modèle peut également contenir moins ou plus de fichiers HTML..
Double-cliquez index-normal.html(ou index.html si vous utilisez un autre modèle). Cela ouvrira le fichier dans votre navigateur, ce qui facilitera la compréhension des parties du code que vous devez éditer et comment les trouver dans votre fichier de modèle HTML..
Vue de l'inspecteur de code du navigateur du code du modèle HTML.Si vous regardez le modèle dans votre navigateur, vous verrez que vous devez modifier:
Une fois que vous savez quoi changer, vous pouvez commencer à chercher le code correspondant.
Faites un clic droit sur le nom qui lit John Doe et sélectionnez Inspecter. Vous remarquerez un panneau en bas qui affiche le code HTML qui constitue notre modèle..
La ligne de code contenant le nom est sélectionnée dans la partie gauche de la fenêtre. Inspecteur panneau, avec le style correspondant sur le côté droit.
Comme vous pouvez le voir sur la capture d'écran ci-dessus, le nom se situe entre le les balises, qui sont les balises HTML utilisées pour représenter les en-têtes.
Dans la plupart des cas, les paires de balises telles que celle-ci ont une balise d'ouverture et de fermeture, et le contenu doit être placé entre ces balises pour s'afficher sur une page Web, comme ceci:
John Doe
Pour modifier le modèle, il vous suffit de savoir quelles balises contiennent la partie de la page que vous souhaitez modifier, de les trouver dans le code et de les remplacer par vos informations..
Maintenant, retournez dans le dossier des modèles, faites un clic droit sur index-normal.html, et sélectionnez Ouvrir avec du texte sublime. Vous devriez maintenant voir le code HTML complet qui compose votre modèle.
Pour commencer à éditer le modèle, vous voulez trouver le même code que celui que vous avez vu dans le panneau Inspecteur de votre navigateur..
Faites défiler la liste jusqu'à trouver des lignes 150-151. Ensuite, cliquez entre les balises et remplacez le nom par votre propre.
Remplacement du nom par défaut et des informations de contact.Après cela, cliquez entre les balises, supprimez le texte et entrez votre profession.
Répéter ces étapes encore et encore vous permettra de remplacer toutes les informations factices par vos propres.
S'il y a une section dans le modèle dont vous n'avez pas besoin, supprimez-la simplement. Dans la capture d'écran ci-dessous, j'ai tout sélectionné dans la section Tableau de tarification et supprimé tout le code qu'il contient..
Vous pouvez supprimer des sections du code dont vous n'avez pas besoin. Pour remplacer les images par les vôtres, il vous suffit de sélectionner toutes les images du dossier correspondant, de les supprimer et de placer vos images dans le même dossier. Si vous avez suivi le conseil précédemment, vous avez nommé vos images avec les mêmes noms que les espaces réservés, ce qui accélère la modification du modèle..
Si vous souhaitez ajouter plus d'informations, sélectionnez le code existant dans la section souhaitée, copiez-le en cliquant sur Contrôle / Commande-C, puis collez-le ci-dessous avec Contrôle / Commande-V. Dans la capture d'écran ci-dessous, je voulais ajouter une autre barre de compétences. J'ai donc sélectionné le code de la quatrième barre de compétences et je l'ai copié immédiatement ci-dessous:
Vous pouvez dupliquer des sections de HTML si vous avez besoin de.Et le résultat final ressemble à ceci:
Le produit final de l'ajout d'une autre barre de compétences.Une fois que vous avez remplacé toutes les informations, il est temps de personnaliser le modèle de site Web de CV à votre goût. Par défaut, le modèle HTML Flatrica est fourni avec plusieurs feuilles de style différentes. Si vous regardez le dossier stylesheets, vous remarquerez qu’ils sont nommés d’après les couleurs utilisées:
Flatrica est livré avec de nombreuses options de feuilles de style.Vous pouvez ajuster rapidement la couleur en remplaçant la feuille de style dans l'en-tête du document par le nom de votre feuille de style préférée. Recherchez la ligne de code qui dit:
Changer le nom en style_blue.css donnera à notre modèle une toute nouvelle couleur et un look:
Les résultats de l'application de la feuille de style bleue.Si vous vous sentez aventureux, vous pouvez éditer la feuille de style principale appelée style.css avec les polices et les couleurs de votre choix. Par exemple, vous pouvez modifier la couleur d’arrière-plan dans style.css en entrant un code HEX de la couleur désirée comme ceci:
couleur de fond: # 65b5c1;
La modification de CSS peut être effectuée de la même manière que nous avons modifié le code HTML. Cliquez avec le bouton droit sur l'élément que vous souhaitez styler, puis cliquez sur Inspecter. Cette fois, vous voudrez rechercher le code sur le côté droit de la Inspecteur onglet et ensuite trouver le même code dans l'éditeur de code.
Regard sur le fichier CSS du modèle de site.Après avoir modifié les fichiers de modèle de site à votre convenance, vous devrez les télécharger sur votre serveur d'hébergement. Vous devriez avoir reçu un courrier électronique de votre hôte contenant les informations nécessaires pour transférer des fichiers via FTP.
Pour commencer le processus de téléchargement, lancez votre programme FTP. Dans ce cas, j'utilise FileZilla. Entrez les informations fournies par votre hôte dans la barre du haut, puis cliquez sur QuickConnect:
Insérer des informations dans FileZilla.Localisez le dossier contenant votre modèle sur votre ordinateur à gauche de l'écran et cliquez dessus pour le développer. Dans le coin inférieur gauche, sélectionnez tous les fichiers et dossiers et faites-les glisser vers le côté droit de l'écran..
Assurez-vous de les télécharger dans le dossier racine de votre serveur d’hébergement dans le répertoire. public_html dossier.
Téléchargement de fichiers sur le serveur via FTP.Une fois tous les fichiers téléchargés, ouvrez votre navigateur et entrez votre nom de domaine. Félicitations, votre nouveau site Web de CV est maintenant en ligne!
Maintenant que vous savez utiliser un modèle de CV HTML, voici quatre astuces qui vous aideront à rendre votre site personnel encore plus impressionnant:
La modification d'un modèle HTML peut sembler intimidante au début, mais ce n'est pas aussi difficile une fois que vous comprenez comment le modèle est structuré et ce qui doit être modifié. Si vous prenez également le temps de lire quelques tutoriels, vous maîtriserez le HTML et le CSS en un rien de temps. Utilisez notre guide ci-dessus pour modifier le modèle de votre site de CV et augmenter vos chances d'être embauché.
Accentsconagua