Votre portfolio

Structure et noms de fichiers

Il est primordial de garder une structure de fichiers précise et claire dans le développement de votre portfolio :

mon-portfolio
├── fonts
│   ├── font.otf
│   ├── font.woff
│   └── font.woff2
├── medias
│   ├── image-01.png
│   ├── image-02.jpg
│   ├── audio-A.mp3
│   └── ma-video.mp4
├── projets
│   ├── nom-du-projet-1.html
│   └── nom-du-projet-2.html
├── pages
│   ├── about.html
│   └── contact.html
├── index.html
└── style.css

/ désigne le « répertoire racine », ici c'est le dossier mon-portfolio. Cela nous permet d'écrire le bon chemin vers un certain fichier. On aura par exemple :

<img src="/medias/image-01.png" />
<a href="/projets/nom-du-projet-1.html">Mon 1er projet</a>
<a href="/pages/about.html">À propos de moi</a>
<a href="/">HOME</a>

Tous les fichiers auront besoin du fichier style.css, n'oubliez pas de bien l'inclure dans le head de chaque page HTML :

<link href="/style.css" rel="stylesheet">

Quant aux noms de fichiers, ils doivent absolument respecter la nomenclature :

• leur nom est descriptif (nom-projet-detail-01.jpg plutôt que img-aeb6594cxh-e12.jpg)
• pas de majuscules, pas d'espaces, pas de caractères spéciaux (!, @, #, %, ^, &, *, (, ))
• uniquement :
  • lettres minuscules non-accentuées
  • chiffres 0-9
  • underscore _
  • tiret -