Пять веских причин сделать редизайн сайта с помощью CSS

Многие представители малого бизнеса бывают удивлены ценами на редизайн сайта и приходят к выводу, что если уж сайт есть, то не нужно его менять. И это можно понять. Ведь если вы не вовлечены ежедневно в мир интернет-бизнеса, вам трудно почувствовать интуитивно, когда потребуется редизайн сайта.

Как владелец малого бизнеса вы можете быть обеспокоены необходимостью платить авансом за редизайн сайта. Но если вы поймете, каким образом редизайн поможет увеличить посещаемость вашего сайта, превратить большее число посетителей в покупателей, а также сэкономить деньги, вы увидите, что это оправданные инвестиции в ваш бизнес.

Веб-дизайн старой школы – HTML-верстка на таблицах

Не так давно факсовые аппараты были самым быстрым и удобным способом отправки деловых документов по всему миру. Но сегодня так легко отсканировать и выслать документы по электронной почте, что факсовые аппараты повторяют судьбу печатных машинок. Пользуясь e-mail, получатель, может сам решить, прочитать сообщение сейчас или позже, распечатать его или нет. Нет необходимости в выделенных телефонных линиях для факсов, занимающих пространство на рабочем месте, замене картриджей, закручивающейся факсовой бумаге, а главное не нужно слушать скрипящие звуки факсового аппарата.

Также как и факсы, таблицы были когда-то лучшим способом размещения информации в сети. Но как завивающаяся бумага для факса и постоянно заканчивающиеся чернила, таблицы оставляли желать лучшего. Дизайнеры были вынуждены размещать информацию в виде таблиц. Незагруженные, профессиональные и креативные макеты, которые создают сегодня лучшие дизайнеры с помощью каскадных таблиц стилей (Cascading Style Sheets, CSS), было бы невозможно создать, используя табличную верстку.

Веб-дизайн новой школы – каскадные таблицы стилей (CSS)

Каскадные таблицы стилей отделяют служебные элементы сайта (код) от его содержания (текстов). CSS позволяет создавать дизайн всех страниц сайта, задавая параметры для шрифта, размера текста, фонов, цветов и т.д., используя при этом один файл, вместо того, чтобы задавать эти параметры в коде каждой страницы. Менять дизайн теперь также можно очень быстро и легко с помощью CSS – стоит лишь обновить файл «каскадов» и обновится дизайн всех страниц сайта. Сужается пространство для ошибки, и сайт сохраняет свою логичность и единство стиля.

Но не только веб-дизайнеры и программисты получают преимущество от создания сайта с помощью CSS. Вы как владелец бизнеса получите больше! Как?

5 веских причин сделать редизайн сайта с помощью CSS

1. Позиционирование компании в Интернет

Эксперты по поведению покупателей утверждают, что покупатель при выборе среди одинаковых товаров или услуг, не зная брендов и названий компаний, будет полагаться на умственные заключения при принятии решения о покупке. Покупатель будет сравнивать ваш сайт с сайтами других компаний и сделает вывод о вашем профессионализме и репутации. Если сайт вашей компании выглядит современным, понятным и аккуратным, он будет производить положительное впечатление на посетителей.

2. Юзабилити

Каскадные таблицы стилей уменьшают объем кода сайта. Таблицы и дополнительные теги для шрифтов и цветов нагромождают страницу, и она загружается медленнее. Чем дольше загружается страница, тем больше вероятность, что посетитель нажмет кнопку «Назад». Несмотря на то, что все больше и больше людей пользуются широкополосным Интернетом, многие до сих пор выходят в Интернет через телефонную линию. А кто-то может пользоваться высокоскоростной беспроводной связью, скорость которой зависит от количества пользователей в каждый момент времени, и в зависимости от этого соединение будет быстрым или медленным.

3. Доступность

Быстрое распространение беспроводных средств коммуникаций привело к тому, что многие выходят в Интернет с помощью карманных компьютеров и мобильных телефонов. Страницы с табличной версткой некорректно отображаются на маленьких экранах. Компания, которая хочет быть доступной каждому в любом месте, сейчас и в будущем, должна иметь сайт, который удобно просматривать с мобильных устройств.

4. Поисковая оптимизация

По статистике около 80% покупок в Интернете начинаются с запросов в поисковых системах. И есть отдельная область деятельности, призванная помочь бизнесу получить высокие позиции в результатах поиска по ключевым словам.

Хотя соответствие страницы ключевым словам определяется элементами HTML-верстки, контент (содержание сайта) остается все же наиболее значимым фактором, так как посетителям нужно содержание сайта, а не код. Если отношение кода к тексту на сайте очень велико, то плотность ключевых слов (частота ваших ключевых слов на странице) уменьшается за счет элементов HTML-верстки – инструкций о том, как должны отображаться таблицы, шрифты, стили и цвета. На сайте, созданном с помощью CSS, нет таблиц и информация о внешнем виде страницы хранится в одном файле. Поисковые роботы видят больше ключевых слов на странице и меньше кода.

5. Пропускная способность сайта

Пропускная способность сайта – это объем трафика, который хостинговая компания выделяет для вас ежемесячно. Каждый раз, когда посетитель приходит на ваш сайт, он или она загружает страницу в браузере. Из объема скачанной информации с сайта складывается общий объем трафика. Не только посетители, но и поисковые роботы используют трафик. Чем больше кода размещено на страницах сайта, тем активнее используется трафик.

Если будет превышен лимит трафика, ваш сайт будет заблокирован до конца месяца, если вы не оплатите дополнительный трафик. Представьте, что посещаемость вашего сайта резко увеличилась после того, как популярный журнал написал статью о вашей компании. Будет очень обидно, если как раз в это время ваш сайт будет заблокирован! CSS позволяет более эффективно расходовать трафик и снижает вероятность таких проблем.

Означает ли все вышесказанное, что таблицы запрещены?

Нет. Есть смысл использовать таблицы для отображения специфического контента. Вся прелесть CSS в том, что вы можете продолжать использовать таблицы там, где это необходимо, но не нужно применять их везде. Таким образом вы уменьшите «вес кода».

Может быть, мой сайт был изначально создан с помощью CSS?

Есть быстрый способ проверить это. Загрузите любую страницу вашего сайта. Нажмите правую кнопку мыши в любом месте окна, появится меню. Нажмите «Просмотр HTML-кода». Вверху появившегося окна вы увидите что-то вроде rel=”stylesheet” или type=”text/css”.

Если вы решите провести редизайн сайта сейчас или в будущем, убедитесь, что веб-разрабочики, которым вы даете это задание, знакомы с CSS.

Linda Bustos (c) 2007

Перевод статьи: Римма Салахова, дизайн студия “Креатель-Медиа”
Оригинал перевода: http://createl.ru/rus/blog/2007/02/16/26/

Основатель Searchengines.ru. С 2005 по 2014 год работал генеральным директором компании "Яндекс.Украина". Основатель и директор крупнейшего коворкинга Одессы — "Терминал 42". Ведет блог, участвует в подкастах. Больше ничего не умеет.