Для задания названий кнопок для доступности Google PageSpeed, необходимо использовать атрибут aria-label
или aria-labelledby
в элементе кнопки.
Атрибут aria-label
используется для указания конкретного текстового описания элемента, который будет доступен для чтения с использованием программных средств. Например, чтобы задать название кнопки "Оформить заказ", вы можете использовать следующий код:
<button aria-label="Оформить заказ">Оформить</button>
Атрибут aria-labelledby
используется для задания связанного элемента, которое содержит текстовую метку, идентифицирующую элемент. Идентификаторы метки могут быть указаны в атрибуте id
для других элементов на странице. Например, если у вас есть элемент с идентификатором "order-label", который содержит текстовую метку "Оформить заказ", вы можете использовать следующий код:
<button aria-labelledby="order-label">Оформить</button> <label id="order-label">Оформить заказ</label>
Таким образом, при использовании элемента <button>
с атрибутами aria-label
или aria-labelledby
, вы обеспечиваете доступность для программных средств, таких как экранные читалки, и позволяете пользователю понять назначение кнопки даже без визуального представления. Это также будет полезно при проверке и оптимизации страницы с помощью инструментов, таких как Google PageSpeed.