Регистрация
Зарегистрируйся на сайте и получи доступ к полному контенту сайта и подпискам бесплатно!

Верстка

Верстка – разметка web-страницы на языке html, которая распознается браузерами и определяет расположение и функционал всех элементов: текста. блоков, картинок и т.д. Фактически верстка является преобразованием дизайн-макета страницы в веб-версию.

В зависимости от сложности проекта для верстки используют программу блокнот или специальные html-редакторы: Notepad++, Sublime Text, Macromedia Dreamweaver, Microsoft FrontPage, Coda и т.д.

Валидная верстка

Валидной (то есть действительной, подтвержденной) называют верстку, которая соответствует стандарту W3C. Как показывает практика, это гарантирует не только улучшение позиций ресурса в результатах поиска, но и стабильную работу, корректное отображение страниц в разных браузерах. Проверить часть кода или страницу ресурса на валидность можно на validator.w3.org

Кроссбраузерная верстка

Еще одно требование к качественной верстке сайтакроссбраузерность, то есть, отсутствие ошибок отображения страниц сайта в разных браузерах. Верстку, не соответствующую требованиям кроссбраузерности называют «плывущей». Она характеризуется смещением, наслоением блоков, нарушением границ отображения. Кроссбраузерность верстки напрямую связана с поведенческими факторами и показателем отказов.

SEO-верстка

Кроме валидности и кроссбраузерности качественная верстка сайта должна быть SEO-оптимизированной, то есть, способствовать улучшению позиций ресурса в результатах поиска. SEO-оптимизаторы и верстальщики выделяют следующие характеристики SEO-верстки:

  • Расположение блока контента (div id="content") ближе к началу html-кода. Вероятно, такие страницы считаются поисковыми системами (ПС) более релевантными, так как содержат полезный пользователям контент, а не избыточное количество графических и рекламных блоков;
  • Использование метатегов keywords и description. Данные метатеги позволяют поисковым машинам точно определить содержание страницы и оценить ее релевантность;
  • Использование тега ALT для изображений. Позволяет описать содержание изображения и, соответственно, занять более высокие позиции в поиске по картинкам;
  • Вставка скрипта javascript ближе к концу html-кода страницы. Поскольку скрипты требуют определенных ресурсов для загрузки и отображения, оптимально, если они будут находиться после основного контентного блока;
  • Минимальное применение тегов B и Strong;
  • Применение заголовков H1-H3. Использование H1 для основного заголовка и H2-H3 для подзаголовков позволяет поисковым машинам лучше определить контекст страницы;
  • Оптимизированный код. Часто используемые CMS (движки) характеризуются избыточностью кода. Это влияет на время загрузки страниц и качество их отображения. По этой причине оптимизированный код может стать конкурентным преимуществам ресурса и позволит ему занять более высокие позиции в выдаче за счет снижения времени загрузки.

Лучшее видео в категории «Верстка»

Новые видео

Еще видео