Skip to main content

Que dois-je nommer mon fichier de feuille de style CSS?

Le style et le "style" d'un site Web sont dictés par CSS (Cascading Style Sheets). Ceci est un fichier que vous ajouterez au répertoire de votre site Web et contenant les différentes règles CSS qui créent le design visuel et la mise en page de vos pages.

Bien que les sites puissent utiliser, et utilisent souvent, plusieurs feuilles de style, il n’est pas nécessaire de le faire. Vous pouvez placer toutes vos règles CSS dans un seul fichier, ce qui présente des avantages, notamment une réduction du temps de chargement et des performances des pages, car elles n'ont pas besoin d'extraire plusieurs fichiers. Bien que les sites d'entreprise très volumineux aient parfois besoin de feuilles de style distinctes, de nombreux sites de taille petite à moyenne peuvent très bien fonctionner avec un seul fichier avec toutes les règles dont vos pages ont besoin. Cela soulève la question "Comment dois-je nommer ce fichier CSS"? "

Notions de base de la convention de nommage

Lorsque vous créez une feuille de style externe pour vos pages Web, vous devez nommer le fichier en respectant des conventions de nommage similaires pour vos fichiers HTML.

Ne pas utiliser de caractères spéciaux

Vous devez utiliser uniquement les lettres a-z, les chiffres 0 à 9, le trait de soulignement (_) et les traits d'union (-) dans les noms de fichier CSS. Bien que votre système de fichiers vous permette de créer des fichiers contenant d’autres caractères, le système d’exploitation de votre serveur peut avoir des problèmes avec les caractères spéciaux. Vous êtes plus en sécurité en utilisant uniquement les caractères mentionnés ici. Après tout, même si votre serveur autorise l'utilisation de caractères spéciaux, il se peut que ce ne soit pas le cas si vous décidez de changer de fournisseur d'hébergement ultérieurement.

Ne pas utiliser d'espaces

Comme avec les caractères spéciaux, les espaces peuvent causer des problèmes sur votre serveur Web. C'est une bonne idée de les éviter dans vos noms de fichiers - vous devriez même vous faire une idée de nommer des fichiers comme des PDF en utilisant ces mêmes conventions, au cas où vous auriez besoin de les ajouter à un site Web. Si vous estimez qu'il vous faut un espace pour rendre le nom du fichier plus lisible, optez plutôt pour les traits d'union ou les traits de soulignement. Par exemple, au lieu d'utiliser "ceci est le fichier.pdf", utilisez "ceci-est-le-fichier.pdf".

Le nom du fichier doit commencer par une lettre

Bien que cela ne soit pas une exigence absolue, certains systèmes ont des problèmes avec les noms de fichiers qui ne commencent pas par une lettre. Par exemple, si vous choisissez de commencer votre fichier avec un caractère numérique, cela peut entraîner des problèmes ultérieurement.

Utiliser tous les minuscules

Bien que cela ne soit pas nécessaire pour un nom de fichier, c'est une bonne idée, car certains serveurs Web sont sensibles à la casse et que, si vous oubliez et faites référence au fichier dans un cas différent, il ne se chargera pas. Utiliser des caractères minuscules pour chaque nom de fichier est toujours une bonne façon de procéder. En fait, de nombreux nouveaux concepteurs de sites Web ont du mal à se rappeler de le faire - leur action par défaut pour nommer un fichier consiste à mettre le premier caractère du nom en majuscule. Évitez cela et prenez l'habitude de mettre uniquement des minuscules.

Gardez le nom de fichier aussi court que possible

Bien qu'il existe une limite de taille de nom de fichier sur la plupart des systèmes d'exploitation, elle est beaucoup plus longue que ce qui est raisonnable pour un nom de fichier CSS. Une bonne règle empirique ne doit pas dépasser 20 caractères pour le nom de fichier, extension non comprise. En réalité, il est difficile de travailler avec quelque chose de beaucoup plus long que de le faire.

La partie la plus importante de votre nom de fichier CSS

La partie la plus importante du nom de fichier CSS n'est pas le nom de fichier lui-même, mais son extension. Les extensions ne sont pas nécessaires sur les systèmes Macintosh et Linux, mais c'est quand même une bonne idée d'en inclure une lors de l'écriture d'un fichier CSS. De cette façon, vous saurez toujours qu'il s'agit d'une feuille de style et n'avez pas à ouvrir le fichier pour déterminer ce qu'il en sera dans le futur.

Ce n'est probablement pas une grosse surprise, mais l'extension de votre fichier CSS devrait être:

.css

Conventions de dénomination des fichiers CSS

Si vous n’avez qu’un seul fichier CSS sur le site, vous pouvez le nommer comme vous le souhaitez. L'une des options suivantes est préférable:

styles.css ou default.css

Si votre site Web utilise plusieurs fichiers CSS, attribuez un nom aux feuilles de style en fonction de leur fonction, afin de préciser le but de chaque fichier. Puisqu'une page Web peut avoir plusieurs feuilles de style attachées, il est utile de diviser vos styles en différentes feuilles en fonction de la fonction de cette feuille et des styles qu'il contient. Par exemple:

  • Disposition vs design

    layout.css design.css

  • Sections de page

    main.css nav.css

  • Site complet avec sous-sections

    mainstyles.css subpage.css

Si votre site Web utilise une structure quelconque, vous remarquerez probablement qu'il utilise plusieurs fichiers CSS, chacun étant dédié à des parties différentes des pages ou des aspects du site (typographie, couleur, mise en page, etc.).

Edité par Jeremy Girard