Внешний вид или "стиль" веб-сайта определяется CSS (каскадные таблицы стилей). Это файл, который вы добавите в каталог своего веб-сайта, который будет содержать различные правила CSS, которые создают визуальный дизайн и макет ваших страниц.
Хотя сайты могут использовать и часто используют несколько таблиц стилей, в этом нет необходимости. Вы можете поместить все свои правила CSS в один файл, и это действительно дает преимущества, в том числе более быструю время загрузки и производительность страниц, поскольку им не нужно извлекать несколько файлов. Хотя очень крупным корпоративным сайтам иногда могут потребоваться отдельные таблицы стилей, многие малые и средние сайты могут прекрасно справиться с одним файлом со всеми правилами, которые нужны вашим страницам. Возникает вопрос: «Как мне назвать этот файл CSS?»
Основы соглашения об именах
Когда вы создаете внешняя таблица стилей для ваших веб-страниц вы должны назвать файл, следуя аналогичным соглашениям об именах для ваших HTML-файлов.
Не используйте специальные символы
В именах файлов CSS следует использовать только буквы a-z, цифры 0-9, подчеркивание (_) и дефис (-). Хотя ваша файловая система может позволять вам создавать файлы с другими символами в них, ваша серверная ОС может иметь проблемы со специальными символами. Безопаснее использовать только упомянутые здесь символы. В конце концов, даже если ваш сервер позволяет использовать специальные символы, это может быть не так, если вы решите перейти к другим провайдерам хоста в будущем.
Не используйте пробелы
Как и в случае со специальными символами, пробелы могут вызвать проблемы на вашем веб-сервере. Лучше избегать их в именах файлов; вы даже должны сделать так, чтобы файлы, такие как PDF, назывались с использованием тех же соглашений, на случай, если вам когда-нибудь понадобится добавить их на веб-сайт. Если вы уверены, что вам нужен пробел, чтобы облегчить чтение имени файла, выберите вместо него дефис или подчеркивание. Например, вместо использования «это файл .pdf» используйте «это-это-файл.pdf».
Имя файла должно начинаться с буквы
Хотя это не является абсолютным требованием, в некоторых системах возникают проблемы с именами файлов, которые не начинаются с буквы. Например, если вы решите начать свой файл с символа числа, это может вызвать проблемы в дальнейшем.
Использовать все нижний регистр
Хотя это не требуется для имени файла, это хорошая идея, поскольку некоторые веб-серверы чувствительны к регистру, и если вы забудете файл и укажете его в другом регистре, он не загрузится. Использование символов нижнего регистра для каждого имени файла - это всегда разумный способ. Фактически, многие начинающие веб-дизайнеры изо всех сил стараются не забывать об этом, их действие по умолчанию при именовании файла - использовать первый символ имени с большой буквы. Избегайте этого и возьмите за правило использовать только строчные буквы.
Делайте имя файла как можно короче
Хотя для большинства операционные системы, он намного длиннее, чем разумно для имени файла CSS. Хорошее эмпирическое правило - не более 20 символов для имени файла, не включая расширение. На самом деле, все, что намного длиннее, слишком громоздко, чтобы работать и ссылаться на него в любом случае.
Самая важная часть вашего имени файла CSS
Самая важная часть имени файла CSS - это не само имя файла, а его расширение. Расширения не требуются на Macintosh и Системы Linux, но лучше включить его при написании файла CSS. Таким образом, вы всегда будете знать, что это таблица стилей, и вам не придется открывать файл, чтобы определить, что это за таблица в будущем.
Это, вероятно, не является большим сюрпризом, но расширение вашего файла CSS должно быть:
.css
Соглашения об именах файлов CSS
Если у вас когда-либо будет только один файл CSS на сайте, вы можете называть его как хотите. Предпочтительно одно из следующего:
style.css
standard.css
default.css
Если ваш веб-сайт будет использовать несколько файлов CSS, назовите таблицы стилей после их функции, чтобы было ясно, какова цель каждого файла. Поскольку к веб-странице может быть прикреплено несколько таблиц стилей, это помогает разделить ваши стили на разные листы в зависимости от функции этой таблицы и стилей в ней. Например:
-
Макет vs. дизайн
layout.css design.css
-
Разделы страницы
main.css nav.css
-
Весь сайт с подразделами
mainstyles.css subpage.css
Если на вашем веб-сайте используется какой-либо фреймворк, вы, вероятно, заметите, что он использует несколько файлов CSS, каждый посвящен разным частям страниц или аспектам сайта (типографика, цвет, макет, так далее.).