Page 25 - Сила CSS3 Освой новейший стандарт

Преимущества CSS3 • 25

каждому инСтрументу — Свое меСто и время
На протяжении всей книги я буду периодически с восхищением рассказывать о том, как
та или иная техника CSS3 способна заменить собой изображение, файл JavaScript, файл
Flash, класс или вложенный блок div. Но позвольте мне с самого начала разъяснить свою
позицию: я не утверждаю, что все перечисленное — плохо. И совершенно точно я не
призываю избавиться от всех изображений на веб-сайтах — это смешно. Я лишь расска-
зываю о впечатляющих инструментах, у каждого из которых своя область применения.
Глупо применять CSS вместо традиционной техники, если она гораздо лучше подходит
для выполнения конкретной задачи. Например, никто не станет реализовывать на базе
CSS раскрывающиеся меню, просто потому что CSS «круче», ведь JavaScript справляется
с этим куда эффективней. Однако если CSS3 позволяет сделать что-то быстрее и проще
или же просто обеспечивает большее удобство в использовании, не ухудшая или даже
улучшая внешний вид, то мне кажется, что разумно будет выбрать эту новую технологию.

Когда браузер собирается загрузить страницу с сервера, он выполняет HTTP-запрос.
Каждый раз при обнаружении очередного файла, необходимого для отображения
страницы — таблицы стилей, изображения, сценария и т. п., — браузеру приходится
снова обращаться к серверу и запрашивать этот файл. Такое перекидывание дан-
ных туда-сюда гораздо сильнее влияет на скорость загрузки страницы, чем просто
размер всех ее компонентов в килобайтах. Это означает, что, в среднем, загрузка
страницы с 10 изображениями по 10 Кбайт каждое (всего 100 Кбайт) занимает на-
много больше времени, чем загрузка страницы с одним изображением размером
100 Кбайт — или даже 200 Кбайт.

Используя CSS3, вполне можно создать насыщенный графическими элементами
сайт, на котором не будет ни одного настоящего изображения, значительно сократив
число HTTP-запросов и ускорив загрузку страниц.
И в то же время я не утверждаю, что любая функциональность CSS3 ускоряет за-
грузку страниц; изменение скорости зависит от того, вместо чего вы внедрили CSS3,
а также каким образом реализовали версию CSS3.

Например, использование шрифта, связанного с правилом @font-face, о котором
вы узнаете в главе 3, означает еще один HTTP-запрос и еще один файл для загрузки
на компьютер пользователя — а файлы шрифтов иногда могут быть весьма объ-
емными. Таким образом, в некоторых случаях добавление @font-face замедляет
загрузку страниц. С другой стороны, если вы собирались вместо правила @font-
face использовать десятки или сотни изображений текста, то по сравнению с этим
загрузка одного файла шрифта не кажется такой уж страшной. Это также может
потребовать меньше времени и ресурсов, чем загрузка данных для метода замены
текста, основанного на JavaScript или Flash. Можно привести много примеров ситу-
аций, когда потеря или выигрыш в скорости зависят от того, с чем вы сравниваете
применение CSS3, какие шрифты используете, выделяете ли поднабор символов
шрифта, а также от прочих факторов конкретной реализации @font-face.

www.trk.kg