Для чего нужен HTML-тег button? Чтобы не делать действия ссылками!

Частенько пишу собственные CMS или своими плагинами добавляю функционал к существующим. Поскольку web-страницы давно интерактивны, часто приходится создавать на них разные действия, будь то добавление заметки в фавориты, изменение темы сайта на противоположную («включение/выключение света»), изменение семейства и размера шрифта статьи, или анонимное голосование по 5 или 10-ти бальной шкале, etc.

Как это делается в плохом случае? Создаётся фиктивная ссылка с заглушкой (#), которая никуда не указывает, на ссылку вешается JavaScript обработчик, который и вызывает функцию, что выполняет необходимое действие. Ссылку действия, естественно, через CSS делают красивой кнопкой. Это всё неправильно! В реализации подобных фич как раз главное не делать ссылки на действия. Т.е. сами кнопки этих действий не делать ссылками. Почему? Потому, что:

  • Это противоречит концепции гипер-ссылок в WWW. Гипер-ссылки должны ссылаться на какие-то другие ресурсы, а не быть кнопками для каких-то действий.
  • На ссылки действий хаотически нажимают всевозможные роботы, что заходят на сайт, коих может быть очень много. Понятно, что, e.g., добавлять статьи себе в фавориты неавторизованные роботы не смогут, а как быть с анонимными голосованиями?

Можно, конечно, напрочь игнорировать концепцию гипер-ссылок в WWW, а роботам в файле robots.txt запретить переходить по подобным ссылкам, но зачем оно надо? Это всё «костыли» и нарушения. Надо сразу делать всё правильно. А как правильно? Правильно действия вешать на кнопки. Именно для этого и были введены дополнительные HTML-теги кнопок <button> вдобавок к уже имеющимся кнопкам <input type="submit">, которые используются для отправки форм данных на сервер. На кнопки роботы не жмут, поэтому можно быть уверенным, что выполнять эти действия будут именно реальные пользователи.

Не делайте действия ссылками в своих CMS. Для этого есть кнопки.