Сила Web стандартов
22 Jul, 2004Просто для интереса я решил хоть один раз посмотреть насколько сокращается код страницы при переходе с таблиц на сугубо CSS+XHTML верстку.Жертвой стала страница Висныка Державных закупивель...
Почему тендер?
Эта страница просто подвернулась под руку ,так как моя организация имеет отношение к этому проекту. Да и просто как яркий пример слишком неоптимизированного кода.Одного взгляда на source и подключаемый почти 50kb JS хватило что бы это понять.Я абсолютно уверен , что для любой другой страницы разница в переходе на web стандарты была бы не так заметна.Ближе к делу.
Я сразу решил не менять графику.Попросту для того , что бы для стороннего человека разница была лишь в скорости загрузки (к чему я собственно и стремился). После коротких разбирательств с окошком страницы оказалось что она имеет фиксированную ширину ,что просто означало еще более простую её вёрстку.То есть проблем с layout (раположением основных областей страницы) вообще не должно было быть.Однако с надеждой (вдруг я в итоге этот проект перехвачу :)) я делал резиновый сайт то есть , можно было растягивать его как угодно и сжимать тоже , и в последний момент задал фиксированную ширину.Выпадающие менюшки на этой страничке меня очень "порадовали".Они требовали 47kb джаваскрипта и неперевариваемый вызов функций с немеряным количеством переменных внутри.
Скажу только что для этого использовал подход одной из последних статей с моего любимого сайта Alistapart.
А это ссылка на конкретную статью которую я использовал
Horizontal Dropdowns.
Только это заменило 47 Kb скрипта на 300b(байт).
Итоги
Размер непосредственно HTML упал с 70Kb до 9Kb.Загадкой для меня осталось уменьшение CSS ;ведь теперь в него была занесена вся информация о страничке , а не только некоторые настройки шрифтов.
В общем подводя итоги , оказалось что общий размер кода ( HTML и Javascript) уменьшился где то в 10 раз (!).Это при том , что я не жалея расставлял div
'ы и id
для них.Хотя я и старался но болезнь автора гигатизмом картинок уменьшила мои старания в 5 раз.
Общий размер загружаемого файла уменьшился всего в 2 раза , что по моему не уменьшает эффекта.
И это не считая того что моя страничка доступна с мобильных устройств ( спасибо структурному XHTML), редизайн легко осуществим сменой всего одного файла — вобщем ,все обычные преимущества XHTML+CSS.
- Вот оригинал:
- Tender.com.ua
- А это мой вариант:
- CSSXHTMLTENDER.
комментариев к “Сила Web стандартов”