Найти тему
notnull.media

Советы и приёмы HTML, которые вы хотели бы знать

Оглавление

Атрибут start

Атрибут start позволяет указать начальный номер для элементов списка

-2
-3

Атрибут contenteditable

Установите для атрибута contenteditable значение true, и ваш контент будет доступен для редактирования.

-4
-5

Атрибут required

Установите атрибут required для полей, которые являются обязательными к заполнения. Если хотя бы одно такое поле будет пустым, форма не отправится, а браузер покажет всплывающую ошибку.

-6

Тег mark

Используйте тег mark вместо стилизации тега span, чтобы выделить текст. Такой текст ничем не отличается от обычного, но его вид может быть изменен с помощью стилей. В браузере Chrome и Firefox фоновый цвет текста внутри <mark> выделяется жёлтым цветом.

-7
-8

Атрибут lazy loading

Добавьте атрибут lazy loading медиа-элементам. Это улучшит производительность страницы. Браузер отложит загрузку медиа-элементов до тех пор, пока пользователь не прокрутит к ним, то есть пока они не попадут в область видимости.

-9

Тег kbd

Тег <kbd> используется для обозначения текста, который набирается на клавиатуре или для названия клавиш. Браузеры обычно помечают такой текст моноширинным шрифтом.

-10
-11

Теги details и summary

Вы можете создавать красивые аккордеоны (раскрывающийся текст), используя теги <details> и <summary>.

-12
-13

Атрибут accept

Атрибут accept позволяет указать, какие типы файлов пользователь может загружать.

-14

Тег picture

Тег <picture> позволяет отображать изображения с различными соотношениями сторон в зависимости от размера экрана. Тег <picture> отлично подходит для реализации адаптивного веб-дизайна.

-15

Атрибут dir

С помощью атрибута dir можно установить направление текста справа налево или слева направо. Если установить значение auto, направление текста будет зависеть от языка.

-16
-17

Атрибут spellcheck

Используйте атрибут spellcheck для проверки введённого текста на орфографические ошибки.

-18

Мета-описание

Добавьте мета-описание в заголовок вашего HTML-кода, чтобы иметь косвенное влияние на поисковую оптимизацию. Мета-описание представляет собой текст, который появляется под названием сайта на странице результатов поисковой системы.

-19
-20

Тег abbr

Тег <abbr> указывает, что последовательность символов является аббревиатурой. С помощью атрибута title даётся расшифровка сокращения, что позволяет понимать аббревиатуру людям, которые с ней не знакомы. Поисковые системы будут индексировать расшифровку, что может положительно сказаться на выдаче.

-21
-22

Атрибут disabled

Используйте атрибут disabled на элементах списка, чтобы отключить их.

-23
-24

Атрибут poster

Атрибут poster позволяет указать изображение, которое будет отображаться во время загрузки видео или до тех пор, пока пользователь не нажмет кнопку воспроизведения.

-25

Атрибут reversed

Используя атрибут reversed, вы можете изменить порядок номеров в списке.

-26
-27

Перевод Syed Mohsin Raza

Наш telegram: @notnullmedia