Дизайн сайта в разных браузерах

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

Вот какой ваш самый любимый браузер? Я использую Firefox для удовольствия [этот сайт для меня удовольствие - посмотрите на него в FF] и Opera для работы. Кто бы что ни говорил, а все-таки Opera гораздо быстрее в работе (даже запускается быстрее). Но у меня также установлены: Safari, Google Chrome, Netscape Navigator и IE 6/7/8. Спрашивается, зачем так много? Я очень много работаю с дизайном, и мне приходится постоянно помнить, что только Firefox среди всех названных поддерживает CSS 3.0, что у IE 6 проблемы с прозрачностью рисунков PNG, что Opera, Safari, Google Chrome [эти три по скорости работы примерно одинаковы], Netscape Navigator и IE 7 работают только с CSS 2.0. А IE 8 вообще непонятно что, там и элементы CSS 3.0 встроены [на самом деле единицы], и скорость запуска и загрузки нормальная – но что-то не так. Бета, что с нее взять.

Используя Google Analytics [скрытая реклама] я вижу, какими браузерами пользуются люди при посещении моего сайта. Вот скрин:

Самые популярные браузеры

Думаю, все и так практически ясно, без моих слов. НО.

У меня есть одно веское “но”. Тематика моего сайта такова, что в основном его посещают достаточно продвинутые в плане web-технологий люди. А это означает, что на других сайтах данное процентное отношение несколько иное. В основном, происходит увеличение доли Internet Explorer. Кстати, IE 6 используют примерно треть из всей группы IE, то есть в моем случае IE 7 – 5.43% и IE 6 – 2.33%.

Главное правило хозяина сайта – не терять своих посетителей. Если бы вы зашли на сайт, а увидели развалившийся дизайн [хотя админы, может, даже и не знают об этом], который не исправляют, разве вам захочется вернуться? Вряд ли, один/два раза потерпите, а потом все – прошла любовь, завяли помидоры.

Вот именно поэтому необходимо помнить про не только сам дизайн, но и его качество, которое предполагает кроссбраузерность, то есть одинаковость (без багов) во всех популярных браузерах. Фактически, это IE, Opera, FF. Chrome и Safari одинаково с Opera показывают [вроде как].

Я вплотную подошел к вопросу контроля дизайна сайта в различных браузерах.

Для начала вам всегда стоит проверять валидность кода на предмет незакрытых тегов: вот сервисы для этого:

HTML:
http://validator.w3.org/
http://www.htmlvalidator.com/

CSS:
http://jigsaw.w3.org/css-validator/
http://xhtml-css.com/

Это самые распространенные и популярные.

Теперь дополнения для Firefox, выполняющие те же функции:

HTML Validator
CSS Validator
FireBug и куча дополнений к нему

Но ведь этим все не заканчивается, код кодом, но хочется видеть конечный продукт, для этого пользуемся сервисами, которые делаю скриншоты вашего сайта в рахных операционах системах и браузерах и тут же (или спустя 10 минут) показывают их вам [очень удобно, на мой взгляд]:

http://browsershots.org/
http://browsercam.com/
http://browsrcamp.com/
http://ipinfo.info/netrenderer/

Есть дополнения для FireFox, позволяющие переключаться на другие браузеры:

IE Tab
OperaView

Для тех, кому и этого мало, представляю программу Multiple IE, которая позволит вам поставить себе на комп версии IE, начиная от 3,0 и до 6,0. Хотя фактически, имеет значение лишь шестерка, так как более старыми не пользуется ни один человек, только пауки и боты.

СКАЧАТЬ Multiple IE и посмотреть скриншот

Окно установки нескольких версий IE

СКАЧАТЬ С САЙТА АВТОРА

Если у кого-то есть дополнительный материал – буду рад с ним ознакомится, пишите в комментариях.

P.S. И еще: