umade.ru

Главная страница Яндекса на CSS

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 кб даст более быструю загрузку страницы для пользователей обычного модема. А что, если весь Яндекс переделать? :)

Всего оставлено 9 комментариев

  1. Сергей 14 мая 2004

    А почему бы каталог не выкинуть на отдельную страницу, все-таки Яндекс – это прежде всего поисковик, а потом каталог?

  2. Никита 14 мая 2004

    В каталогах тоже искать можно. Даже нужно.
    Вид страницы изменять не планировалось.
    Можно искать отсюда: http://www.ya.ru

  3. Роман 14 мая 2004

    в яндексе наверное тоже не идиоты сидят… возможно вы чего то не учитываете
    интересно а как сайм яндекс относится к css при ранжировании

  4. Никита 14 мая 2004

    Конечно там не идиоты сидят. Надо проводить мозговой штурм для принятия таких решений.
    А сам Яндекс относится очень положительно. Меньше кода, больше текста, меньше весит сама страница…

  5. ZERZIA 15 мая 2004

    Ты профессионально растешь, определённо.

  6. YouS 17 мая 2004

    А как можно оптимизировать, уже скомпилированный код!!! Ведь это неправильно, и табличный диз ни чем не хуже DIV’ов… Я думаю что нужно совмещать оба тега!

  7. ZERZIA 18 мая 2004

    Так, для примера. Раз уж речь пошла про Яндекс… :)

    http://huyandex.com/

  8. Никита 18 мая 2004

    YouS, как видишь можно оптимизировать…
    В ближайшее время я постараюсь составить что-нибудь по этой теме, где можно будет чётко увидеть зачем нужно стараться разделять структуру от презентации.

  9. ua3nbw 28 мая 2004

    А вот 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

Поиск по сайту

Следующая запись

Предыдущая запись

Из последнего

Архив статей и записей