Авг
20

div верстка сайта

Автор Автор: SancheZ   

Верстка блоками DIV

Верстка сайта — это трудная и сложная наука, освоив которую можно с лёгкостью преобразовать psd дизайн сайта в CSS + HTML которые привлекательно выглядят во всех известных браузеров.

div верстка — это отдельный пунктик в такой большой категории как вёрстка сайта, в которой применяется тег div для позиционирования элементов на странице сайта.

Div верстка и её плюсы

Не так давно когда только только начали появляться браузеры вёрстка сайта производилась с помощью таблиц. Таблица такая состояла из ячеек в которых размещались элементы страницы. Подобных инструментов при работе с таблицами для html верстке не существовало.  После наступления и информационной эры 21 века браузеры стали намного мощнее и производительные, что позволило тем самым применять блочную верстку  div верстка.

Позиционирование блоков осуществляется через контейнер div и св-ва Css, которые применяются к нему.

Приведу небольшой примерчик размещение при помощи страниц и при помощи div.

1) размещение при помощи таблиц

<table>
<tr>
<td>Внутреннее содержание блока</td>
</tr>
</table>

2) размещение при помощи div верстки

<div>Внутреннее содержание блока</div>

Из этого мы видим что див на много проще и экономит время написания всяких дополнительных тегов. При помощи div происходит позиционирование элемента на странице и тем самым мы добиваемся того же эффекта что и при помощи таблиц.

После применения такого метода, он на много упростил работу верстальщику, HTML документ становится намного меньше в размере и становится во много раз более понятным для веб-мастера.  При создания div структуры и создание CSS файла при редактирование которого появляются одни лишь положительные эмоции и становится понятно что всё это стало намного проще и приятнее!

Если сайт громоздкий и сделан на таблицах, то не будет лишним применив div вёрстку для него. Тем самым скорость загрузки страниц сайта ощутимо возрастёт в 2-3  раза.

Если применить данный метод для всех сайтов мира то нагрузка на мировую сеть снизится в сотни, а то и тысячи раз!

После создания каждой верстки сайта нужно будет проверить её на валидность (проверка на ошибки).

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

Проверка осуществляется по стандартам W3C. При проверки кода будут только положительные эмоции, когда мы узнаем что наша страница написанная нашими руками не имеет ошибок внутри кода.

Для проверки на валидность в браузер можно установить определённые дополнения с помощью которых мы можем проверить на валидность. При использование браузера Fierefox. Можно установить Яндекс бар или дополнение Web Developer и HTML, CSS валидация.

Web Developer — инструмент который способен проверять страницу на валидность при верстке HTML.


Подписавшись Вы будете узнавать одним из первых о новых статьях, конкурсах и акциях!

Рекомендую посмотреть следующие статьи:

Написать комментарий