в кои-то веки попался нам адекватный и вменяемый заказчик, который не предъявлял никаких дурацких требований, не ползал с линейкой по монитору, выверяя строгую идентичность макету во всех ему известных браузерах. Этот заказчик руководствовался исключительно соображениями здравого смысла. Вот как бывает.
И захотелось такому заказчику сделать что получше. В том числе и о красоте кода позаботились. И в какой-то момент возникла мысль: «а не переверстать ли на html5?».
Сказано — сделано. Вот что получилось:
h**p://homeadvokat.ru/
На самом деле сайт до сих пор ещё в стадии разработки, а потому живёт на тестовом домене, имеет местами ненаполненные страницы, картинку вместо счётчика, один недовёрстанный шаблон компонента (в новостях) и маленький косячок в виде резкого перепада цвета в ссылках основного меню по краю иконок.
Но основная часть работы выполнена, шаблоны свёрстаны в html5, оформлены средствами css3.
Никаких сверхнавороченных возможностей html5 использовано не было. В первую очередь были применены новые элементы, такие как <header>, <footer>, <aside>, <nav>, <time>. Естественно же, их поначалу игнорировали все версии IE, но способы решения этой проблемы известны. Простеньким js были созданы незнакомые ослику элементы — и вот оно, счастье.
Также был применён атрибут placeholder для формы поиска. К сожалению, правильная работа атрибута пока поддерживается только движком webkit, так что для остальных нужную функциональность пришлось реализовывать опять же javascript'ом.
И ещё в одном месте был применён js: для выпадающего меню. И опять же, только для IE, вернее даже только для шестой его версии. У остальных же браузеров псевдокласс :hover проблем не вызвал
Задача идентичности отображения в разных браузерах не ставилась. Кое-где даже сознательно применены свойства только для webkit.
Свойствами css3 реализовано большинство градиентов. Браузерам, не поддерживающим css3, предложено вместо градиентов отобразить подходящий цвет кода. Исключение сделано для IE. Он хоть и не понимает общепризнанные стандарты, зато имеет свои, в которых градиенты реализованы куда давнее, чем в головах w3c зародились первые мысли о css3. Правда, реализованы они довольно топорно, но в простейших случаях работают вполне прилично.
Местами, но редко, встречаются тени и закруглённые углы — опять же, в устаревших браузерах они просто не показываются. Читаемость от этого не страдает нисколько. Повод задуматься о необходимости приводить сайты к идентичному виду в различных браузерах. Усилия себя не оправдывают.
В ходе работы над этим сайтом был обнаружен странный баг в ФФ. Если задать list-style: decimal для какого-либо элемента, кроме ol, ul, то нумеруются вхождения исключительно нулями. Странного в этом глюке то, что багрепорт у разработчиков висит аж с 1999 года. Мне было крайне сложно удержаться от комментария в коде на этот счёт.
Отдельной статьёй, конечно, стояла задача организовать вывод чистого и красивого кода из cms 1С-Битрикс. Кто знаком с этой чудо-cms, меня сразу поймёт. Когда ядро сыпет тэгами, да не какими-нибудь, а например <font>, задача становится нетривиальной. Ядро редакторивать нельзя, при первом же обновлении все правки умрут. Сделать ровный код, с правильными отступами, без лишних пустых строк — тоже не самая простая задача в Битриксе. Тут, к сожалению, местами пришлось применять костыли вплоть до регулярных выражений в шаблонах.
Вот. Поругайте теперь вы наше творчество
