Статьи

5 причин избегать CSS-хаков и условных стилей

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

Есть несколько причин, почему разработчики из традиционных программных приложений не любят CSS:

  1. Изучение правил — это только половина игры — вам нужен опыт, чтобы по-настоящему понять CSS.
  2. CSS может быть нелогичным и требовать слишком много проб и ошибок.
  3. Даже если Браузер X прекрасно отрисовывает вашу страницу, Браузер Y может сильно потерпеть неудачу.

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

К сожалению, разработка быстрых решений может вызвать больше проблем в долгосрочной перспективе …

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

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

3. Ваш CSS не может быть ориентирован на будущее
Взломы полагаются на ошибки браузера. К сожалению, следующая версия этого браузера может исправить ту самую ошибку, от которой вы зависели. Это, безусловно, было одной из причин взлома IE6-совместимых сайтов в IE7, например, селектор * html

Если ваш веб-сайт уже использует условные таблицы стилей IE6 и IE7, весьма вероятно, что он вам потребуется для IE8.

4. Обнаружение браузера
Веб-страницы должны быть независимыми от устройства. Хотя мы не живем в идеальном мире, обнаружение браузера всегда выглядит немного грязным. Это, конечно, избегается в JavaScript и серверном коде, так зачем использовать его для CSS?

5. В них редко есть необходимость
Необычно найти дизайн, который не может быть создан опытным программистом с использованием стандартного CSS, который работает во всех популярных браузерах (и, да, включая IE6). Небольшие различия в рендеринге всегда неизбежны, но код CSS может оставаться чистым и действительным для всех браузеров.

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

Не веришь мне? Смотрите 10 исправлений, которые решают проблемы IE6

Вы успешно избегали хаков и условного CSS или они были необходимы в каждом проекте?