inputとbutton
input要素はvoid要素のため、擬似要素が使えないが、button要素は使用できる。
button要素は見た目の柔軟性を向上するために追加された要素であり、input要素の後発。
そのため、IEでバグが多く、昔は動作が安定しなかったため、inputがよく使われた。
またデフォルトのCSSが若干異なる。
aとbutton
リンクとボタンというセマンティック上の意味の違いがある。
ページ内リンクやページを遷移するためのリンクを設定するのは、aタグ。
それ以外のUIとしての意味を持たせるのであれば、buttonタグを使用する（例えば、トップページへのリンクでないのに#や、javascript:void()を指定しているようなものはbuttonタグにする）。
また操作上、下記のような違いがある。
- 特殊キーを押しながら操作した時の動作
- 表示されるコンテキストメニューの違い
- スクリーンリーダーの読み上げ内容
- 画面の左下にリンク先が表示される
参考：https://zenn.dev/kandai/articles/fd23c7497c1fea
リンクをクロールできるようにするには
クローラーが認識できるリンクはhref属性が指定されたaタグのみである。
aタグでもhref属性がなかったり、javascriptのクリックイベントとしてリンクを設置している場合は、クローラーが認識できない。
たどることができないリンク:
https://developers.google.com/search/docs/advanced/guidelines/links-crawlable?hl=ja
・<a routerLink="some/path">
・<span href="https://example.com">
・<a onclick="goto('https://example.com')">