HTML теги нужно не просто использовать, чтобы красиво выглядело и работало, но и закладывать смысл.
Интересные особенности:
1) Есть теги для выделения текста в жирный. Теги
<b></b> и <strong></strong>. Они делают одно и то же, но в тег <strong> надо заворачивать текст, который важен. А тег <b> не несет никакого смысла в плане важности.2) Такая же ситуация с
i и em. И там, и там курсив, но em (emphasis) делает логический акцент на тексте, а i – нет.3) Если выделенный текст не имеет семантической важности, лучше использовать для него обычный
span. Например, так можно выделять иконки.4)
main в документе должен быть только один – в него помещается уникальная информация, отличающаяся от страницы к странице. В нем не должен быть сайдбар или шапка с подвалом.5) Отдельные блоки должны быть обернуты в
<section class="block"></section>. То есть надо делать так: <section>тут какой-то контент и html разметка</section>
А не так: <div class="block">тут какой-то контент и html разметка</div>
6) Атрибуты для улучшения доступности. Для всплывающих окон добавляйте атрибут role="dialog" главному элементу. Если у элемента нет видимой части для текста (например иконка соц. сети), то добавьте атрибут
aria-label="telegram".Чтобы программа для чтения не пыталась читать декоративные элементы, то нам поможет атрибут
aria-hidden="true"
🥇Помните, что надо всегда стремиться делать сайт не только красиво, но и качественно.Ставьте лайки, если хотите вторую часть, а далее может и третью 😁.
💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.
WEB PANDA | #верстка #оптимизация