Я стараюсь избегать использования идентификаторов вне функциональных целей. Что подводит меня к моему вопросу, при маркировке элементов в формах существует несколько методов. Я всегда делал это особым образом, чтобы избежать идентификаторов; однако, каковы плюсы и минусы альтернативных методов? Имеет ли один способ большее семантическое значение для браузера, чем другой? Какую роль в этом играет доступность?
Мой обычный метод реализации:
<form role="form" action="#" method="post" name="form" novalidate>
<label>
<span>Search</span>
<input role="search" type="search" placeholder="Search" name="s">
</label>
<button role="button" type="submit" name="s-btn">Search</button>
</form>
Однако вы также можете использовать for="" и пометить идентификатор для соответствующего поля. Что, очевидно, лучше подходит для type="radio" и type="checkbox", но имеет ли оно лучшую семантическую ценность, чем приведенное выше?
<form role="form" action="#" method="post" name="form" novalidate>
<label for="s">Search</label>
<input role="search" type="search" id="s" placeholder="Search" name="s">
<button role="button" type="submit" name="s-btn">Search</button>
</form>
И вы даже можете использовать WAI-ARIA для маркировки идентификаторов, следует ли использовать это вместе с for="" или это отдельный метод маркировки?
<form role="form" action="#" method="post" id="Form" novalidate>
<label id="s" for="sf">Search</label>
<input role="search" aria-labelledby="s form" id="sf" type="search" placeholder="Search" name="s">
<button role="button" aria-labelledby="form" type="submit" name="s-btn">Search</button>
</form>
Я предполагаю, что этот вопрос возник из-за бесконечной погони за балансом удобства обслуживания, оптимизации, семантики и доступности.
