Почему это, как принимают, использует УЛ., структуру LI в списках меню?
Я плохо знаком с HTML. Когда я начал читать документацию о списках, я заметил это везде <ul>, <li> структура используется, даже для создания очень простых списков.
Но для меня это является самым удобным для использования только <a> элементы с CSS:
display: block;
/* and/or */
float: left;
Так, почему использование <ul>, <li> вместо просто <a>?
Большое спасибо.
3 ответа
Потому что структурно они являются наиболее подходящими элементами для этой цели. Также помогает пользователям программ чтения с экрана правильно определять элементы страницы.
Помните, что HTML предназначен для разметки / содержимого (что это за текст? Абзац? Заключите его в тег p), CSS - для стилизации, JS - для поведения.
У вас могут быть тысячи привязок на вашей веб-странице, но что, если вы хотите стилизовать привязки, вложенные в перечисленные элементы, иначе, чем другие привязки?
<ul>
<li><a href="#">blah</a></li>
</ul>
<a href="#">sfl</a>
Если бы вы все сделали правильно, ваш css было бы тривиально реализовать
a { }
ul li a { }
В противном случае вам пришлось бы разбрасывать классы вокруг якорей, и это было бы беспорядочно и неструктурированно.
Что касается SEO - я считаю, что в прошлом семантически размеченный код не имел большого значения, но в настоящее время со спецификациями, такими как RDF, элементы HTML 5, Интернет становится все более и более семантическим, так что только выгодно быть настолько семантическим, насколько это возможно.
В 2010 году Google определил три формы структурированных метаданных, которые их системы будут использовать для поиска структурированных семантический контент на веб-страницах. Такой информация, связанная с отзывами, профили людей, списки компаний, и события будут использоваться Google для улучшить "фрагмент" или короткий фрагмент цитируемого текста, который отображается, когда страница появляется в списках поиска. Google указывает, что эти данные могут быть данные с использованием микроданных, микроформатов или RDFa. [13] Микроданные указаны внутри itemtype и itemprop атрибуты добавлены в существующий HTML элементы; ключевые слова микроформата добавлены атрибуты внутри класса как обсуждалось выше; и RDFa полагается на атрибуты rel, typeof и property добавлены к существующим элементам. [14]
Потому что ваша разметка должна быть семантической, а не просто отображаемой.
Кто угодно или что угодно, кто читает ваш документ, может сразу сказать, что раздел, размеченный тегами , является списком.
CSS не описывает , что что-то такое, а описывает только то, как это должно быть отображено. В идеале вы должны разметить свой документ, чтобы описать , что каждая часть, а затем использовать CSS для соответствующей визуализации этих частей.
Потому что UL, LI и OL - это элементы HTML, созданные с определенной целью - быть списками. Используя правильную разметку, вы добавляете дополнительную информацию к своему контенту, любой автоматизированный инструмент, который видит ваш код, будет знать, что это списки, и сможет действовать соответствующим образом.
Если вам нужны ссылки внутри элемента списка, вы можете поместить элемент A, вложенный в LI:
<ul>
<li><a href="example.com">Example</a></li>
</ul>