Como devo nomear meu arquivo de folha de estilo CSS?

A aparência, ou "estilo" de um site é ditado por CSS (folhas de estilo em cascata). Este é um arquivo que você adicionará ao diretório do seu site, que conterá as várias regras CSS que criam o design visual e o layout das suas páginas.

Embora os sites possam usar, e freqüentemente usam, várias folhas de estilo, não é necessário fazer isso. Você pode colocar todas as suas regras de CSS em um arquivo e, na verdade, há benefícios em fazer isso, incluindo mais rapidez tempo de carregamento e desempenho das páginas, uma vez que não precisam buscar vários arquivos. Embora sejam muito grandes, sites corporativos podem precisar de folhas de estilo separadas às vezes, muitos sites pequenos e médios podem funcionar perfeitamente com apenas um arquivo com todas as regras de que suas páginas precisam. Isso levanta a questão "Como devo nomear este arquivo CSS"? "

Noções básicas da convenção de nomenclatura

Quando você cria um folha de estilo externa para suas páginas da web, você deve nomear o arquivo seguindo convenções de nomenclatura semelhantes para seus arquivos HTML.

instagram viewer

Não use caracteres especiais

Você deve usar apenas as letras a-z, números 0-9, sublinhado (_) e hifens (-) em seus nomes de arquivo CSS. Embora seu sistema de arquivos possa permitir que você crie arquivos com outros caracteres neles, o sistema operacional do seu servidor pode ter problemas com caracteres especiais. Você está mais seguro usando apenas os personagens mencionados aqui. Afinal, mesmo que o seu servidor permita caracteres especiais, esse pode não ser o caso se você decidir mudar para diferentes provedores de host no futuro.

Não use nenhum espaço

Assim como acontece com os caracteres especiais, os espaços podem causar problemas no seu servidor web. É uma boa ideia evitá-los em seus nomes de arquivo; você deve até fazer questão de nomear arquivos como PDFs usando as mesmas convenções, caso precise adicioná-los a um site. Se você acha que precisa de um espaço para tornar o nome do arquivo mais fácil de ler, opte por hifens ou sublinhados. Por exemplo, em vez de usar "este é o arquivo.pdf", use "este é o arquivo.pdf".

O nome do arquivo deve começar com uma letra

Embora esse não seja um requisito absoluto, alguns sistemas têm problemas com nomes de arquivos que não começam com uma letra. Por exemplo, se você escolher começar seu arquivo com um caractere numérico, isso pode causar problemas no futuro.

Use todas as letras minúsculas

Embora isso não seja necessário para um nome de arquivo, é uma boa ideia, já que alguns servidores da web diferenciam maiúsculas de minúsculas e se você esquecer e fazer referência ao arquivo em um caso diferente, ele não carregará. Usar caracteres minúsculos para cada nome de arquivo é sempre uma maneira inteligente de fazer. Na verdade, muitos novos web designers lutam para lembrar de fazer isso, sua ação padrão ao nomear um arquivo é colocar o primeiro caractere do nome em maiúscula. Evite isso e adquira o hábito de usar apenas letras minúsculas.

Mantenha o nome do arquivo o mais curto possível

Embora haja um limite de tamanho de nome de arquivo na maioria sistemas operacionais, é muito mais longo do que o razoável para um nome de arquivo CSS. Uma boa regra é não ter mais do que 20 caracteres para o nome do arquivo, sem incluir a extensão. Realisticamente, qualquer coisa muito maior do que isso é difícil de trabalhar e vincular de qualquer maneira.

A parte mais importante do seu nome de arquivo CSS

A parte mais importante do nome do arquivo CSS não é o nome do arquivo em si, mas a extensão. As extensões não são necessárias no Macintosh e Sistemas Linux, mas é uma boa ideia incluir um de qualquer maneira ao escrever um arquivo CSS. Dessa forma, você sempre saberá que é uma folha de estilo e não terá que abrir o arquivo para determinar o que é no futuro.

Provavelmente não é uma grande surpresa, mas a extensão do seu arquivo CSS deve ser:

.css

Convenções de nomenclatura de arquivos CSS

Se você tiver apenas um arquivo CSS no site, pode nomeá-lo como quiser. Um dos seguintes é preferível:

style.css
standard.css
default.css

Se o seu site usar vários arquivos CSS, nomeie as folhas de estilo de acordo com sua função para que fique claro exatamente qual é a finalidade de cada arquivo. Uma vez que uma página da web pode ter várias folhas de estilo anexadas a ela, é útil dividir seus estilos em folhas diferentes, dependendo da função dessa folha e dos estilos dentro dela. Por exemplo:

  • Layout vs. Projeto
    layout.css design.css
  • Seções de página
    main.css nav.css
  • Site inteiro com subseções
    mainstyles.css subpage.css

Se o seu site usa algum tipo de estrutura, você provavelmente notará que ele usa vários arquivos CSS, cada um dedicado a diferentes partes das páginas ou aspectos do site (tipografia, cor, layout, etc.).