Программах для создания макетов веб-страниц. Предоставляемые элементы пользовательского
Интерфейса, например кнопки, поля, окна и ссылки, могут превратить соэдание раэметки
В простое перетаскивание значков.
Стратегии разметки 325
Идентифицируйте разделы
После того как вы создали визуальный макет, нужно подумать о том, как создать
Разметку HTML и CSS для достижения дизайнерских задумок. Этот процесс обычно
Включает представление различных структурных блоков страницы и идентификацию
Элементов, которые выглядят как отдельные разделы. Например, на
Рис. 11.3 есть немало элементов, которые выглядят как небольшие разделы: наиболее
Крупным является раздел с тремя объявлениями внизу (помечены буквой А на
Рис. 11.3). Каждый раздел, как правило, является кандидатом на выделение в отдельный
тег <div> (если только нет более подходящего тега HTML, что мы обсуждали
Ранее).
Часто визуальная подсказка в макете может помочь решить, нужен ли вообще
тег <di v>. Например, линия границы, обведенная вокруг заголовка и нескольких
Абзацев, означает, что вам понадобится обернуть эту группу НТМL-тегов тегом
<di v>, к которому примене на граница.
Кроме того, когда вы видите фрагменты текста, идущие бок о бок (например,
Три фрагмента с содержимым в нижней части рис. 11.3), вы знаете, что нужно каждый
из них заключить в отдельный тег <di v>. НТМL-теги, как правило, сами не
