11 мая я сформулировал себе задачку — переделать главную страницу Яндекса из табличного дизайна в CSS. Результат чуть отличается от оригинала. Поле поиска и список расписания телевизионных программ немного разнятся, цвет некоторых ссылок отличается, небольшие погрешности в отступах…
Присутствуют семантические ошибки (но никак не больше чем было в оригинале!), так как я не уделял должного внимания валидации кода страницы (этого не требовалось). Знаю что всё выглядит приемлемо в Mozilla Firefox 0.8, Internet Explorer 6, 5.5, 5; в Opera есть проблемы. Я просто получил общую картину, удовлетворяющую меня тем, что это выполнимо. Если продолжить углубляться в этот процесс, то CSS-дизайн можно довести до почти неотличимого уровня, вплоть до нескольких пикселей. Вот оригинал на 11 мая, а вот версия на CSS (будут подгружаться некоторые файлы с yandex.ru).
По слегка заниженным подсчётам получается следующая картина. После удаления 5-7 кб кода (в основном реклама), главная страница с табличным дизайном стала весить 24 кб. Суммарный объём CSS-файлов, подгружаемых главной страницей — 10кб. Таким образом главная страница перед началом преобразования, в сумме с CSS весит 34 кб. Когда остановился переделывать эту страницу на CSS, она стала весить 18 кб + CSS файл — 3.5 кб. Получается примерно 34 кб против 22 кб, разница в 12 кб. Следите? Теперь возьмём среднею статистику Яндекса — 10 миллионов показов этой страницы в день (хиты) и умножим на эти 12 кб. Теперь разделим два раза по 1024 и получим 114 гигабайт трафика в день. Умножим на 30 и получим 3,43 терабайта в месяц. Может быть проблема трафика и нагрузка на сервера не актуальна, а может и актуальна. Эта разница в 12 кб даст более быструю загрузку страницы для пользователей обычного модема. А что, если весь Яндекс переделать? 🙂
А почему бы каталог не выкинуть на отдельную страницу, все-таки Яндекс – это прежде всего поисковик, а потом каталог?
В каталогах тоже искать можно. Даже нужно.
Вид страницы изменять не планировалось.
Можно искать отсюда: http://www.ya.ru
в яндексе наверное тоже не идиоты сидят… возможно вы чего то не учитываете
интересно а как сайм яндекс относится к css при ранжировании
Конечно там не идиоты сидят. Надо проводить мозговой штурм для принятия таких решений.
А сам Яндекс относится очень положительно. Меньше кода, больше текста, меньше весит сама страница…
Ты профессионально растешь, определённо.
А как можно оптимизировать, уже скомпилированный код!!! Ведь это неправильно, и табличный диз ни чем не хуже DIV’ов… Я думаю что нужно совмещать оба тега!
Так, для примера. Раз уж речь пошла про Яндекс… 🙂
http://huyandex.com/
YouS, как видишь можно оптимизировать…
В ближайшее время я постараюсь составить что-нибудь по этой теме, где можно будет чётко увидеть зачем нужно стараться разделять структуру от презентации.
А вот Douglas Bowman, Lycos и Hotbot, тоже всё на CSS.
http://www.stopdesign.com/portfolio/web_interface/lycos_style_guide.html
http://www.stopdesign.com/portfolio/web_interface/hotbot.html