HTML: меню как UL вместо DIVs? - PullRequest
Новая
       8

HTML: меню как UL вместо DIVs?

1 голос
/ 30 апреля 2010

Я недавно создал меню для веб-страницы, где кнопки - это элементы DIV. Я гуглил и вижу, что многие люди создают списки UL, и каждая кнопка является элементом LI. Какая польза от использования UL и LI вместо DIV? Это как-то лучше для SEO? Связано ли это с «семантической» разметкой? Есть ли веская причина переписать мое меню как UL?

1 Ответ

10 голосов
/ 30 апреля 2010

Это более семантически правильный подход. Меню можно рассматривать как неупорядоченный список (ul), а каждый элемент - как элемент списка (li).

Чрезмерное использование div элементов также известно как «дивит» и его следует избегать, где это возможно. (Что, конечно, не означает, что div элементы сами по себе плохие. Существуют законные варианты использования для div s почти на каждой веб-странице.)

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

Сравните, например, 

div.menu { ..... }
div.menu div.subitem { ..... }
div.menu div.level2 div.subitem { ..... }

до 

ul { ..... }
ul li { ..... }
ul ul li { ..... }

Известные примеры того, где div s можно заменить более подходящими элементами:

  • Как уже говорилось, меню: <ul><li>

  • Формы с метками: <fieldset><label>

  • Заголовки <h1><h2> (только заголовки, но не полные области заголовков)

...