もう避けるべき古いHTMLの書き方7選
(dev.to)1. および タグで type 属性を使う
以前は type="text/css" や type="text/javascript" のように書いていたが、今では単に または だけで十分。
2. JavaScriptを使ってアコーディオンメニューを作る
と を使えば、HTMLだけでも簡単に実装できる。
3. と はページごとに1回しか使わない
と がページ全体のヘッダーとフッターを表すと考える人もいるが、実際にはこれらの要素は最も近いセクションに関連している。つまり、、、、 要素の子として使うことができ、新しいセクションを作るときに と を使うのが望ましい。
4. `` の枠線を消すために frameborder="0" を使う
frameborder="0" を使う方法は、HTML5ではもはや推奨されていない。代わりに、CSSを使って iframe { border: none; } のように設定するのがよい。
5. IE8をサポートする
Internet Explorer 8だけでなく、Explorerのすべてのバージョンのサポートをやめるべき。Microsoftは2022年6月にIE 11のサポートも終了しているため、もうIE対応を考慮する必要はない。
6. 見出しタグを無作為に使う
ページ構造に合わせて見出しタグを使い、降順で記述するべき。直前のタグが だったなら、次は または `` を使うべき。
7. HTMLタグのBoolean属性に ="1" を付ける
HTMLタグのBoolean属性は、単に属性名だけを書けば値は true に設定される。たとえば、`` のように disabled 属性があれば、それ自体で true を意味するため、="1" を付ける必要はない。
14件のコメント
HTML5 が登場した理由は、それ以前に HTML がタグの意味と関係なく使われていたからですよね。HTML はマークアップ言語なので、データを入れる器として捉えて扱うことが重要だと思います。そして
typeは TypeScript（TS）など別の型を使うときには必ず明示しなければならないので、省略をあまり強調しすぎる必要はない気がします。より重要なのは、最近はユーティリティ系のclass名を使う人が多いのですが、データを持たせるという点では役に立たないことがあります。
たとえばtitle情報を持たせるなら、
h1,h2,h3を使うとしても、classはtitleとしたほうがより明示的で良いです。でも `` のようなclass名を作るのは良い方向ではありません。
titleを付けてCSSで解決する方向のほうが、今後より長く保てるWebページになる可能性があります。構造が比較的シンプルで、情報伝達を目的としたウェブページであれば、セマンティックタグやクラスを適用するのは自然です。ただし、HTML/CSSを使うすべての人がウェブページだけを書いているわけではありません。ウェブアプリケーションのように、視覚要素のためのマークアップ使用が避けられず、構造が複雑な場合は、一般的なクラス名を使うと名前が衝突してしまいます。だからこそ、Angularのビューカプセル化のような機能が必要になるわけです。
どうせ大半はReactを使うのだから、
classにこだわるよりも、コンポーネント化をうまく進めることが肝心ですね。7番のようなケースは好みの問題ですね。個人的には、書いてあるほうが区別しやすく、読みやすいと思います。
懐かしいコードですね
昔、
scriptタグやstyleタグをきちんとサポートできなかったブラウザで、スタイルコードやJSコードをコメントのように扱わせるために、HTMLコメントで囲んでいた時代がありましたよね。90年代から2000年代ごろだったと思いますが…。
今でもそういうコードを書いている方が少しいる気がします…。
CSSやJS以外の言語まで想定していたのでしょうか。
JavaScript ではなく VBScript になっていました。IE では。
コメント処理がちゃんと動くかな???
<script>のtype属性は、モジュールを入れるときに必要ではないですか？text/cssやtext/javascriptは不要ですが、moduleはおっしゃる通り必要だと思います。h1タグをblock: none処理する手法もずいぶん前に見た気がしますが、今でも有効なんでしょうか…。急に昔を思い出しましたね（笑） すっきりした要約、ありがとうございます！