この記事では、以前の完璧なおとぎ話の HTML タグに注目します。これらは有害で、悪質で、明らかに醜いため、標準の HTML から除外する必要があります。ブラウザを破壊するか、よりシンプルで推奨される新しいタグを使用してください。ラベルのもの。
これまでの基本チュートリアルでは基準を満たす提案を提供しましたが、初心者には異なる基礎や間違った演習が存在します。
HTML はパフォーマンスからセマンティクスへ移行し、セマンティクス (HTML) とパフォーマンス (CSS) を分離しようとしています。単一のプレゼンテーション ディレクティブ (CSS ファイル) を多くのページで使用できるため、これは Web ページで広く使用されています。これにより、Web サイトの管理が容易になり、サイト全体を変更する場合も、簡単なコードを変更するだけで済みます。
一部の有害なタグは、実際には単純なプレゼンテーション タグ (小さいタグなど) であり、CSS で同じ意味を持つコードに置き換えることができます。他のタグは表現力がありませんが、不必要であるか (font タグなど)、または使いやすさに悪影響を及ぼします (blink など)。
タグ
以下にリストされているタグでは、より良いオプションを使用できる可能性があります。
b タグは太字を意味します。代わりにstrongを使用するか、CSSにfont-weight:boldを追加します。
i はイタリック要素を表します。代わりに em を使用するか、CSS に font-style: italic を追加できます。
Big は大きなテキストを表現するために使用されます。代わりにタイトルに h1、h2 などを使用できます。その他は cssfont-size で個別に制御できます。
Small は小さなテキストを表現するために使用され、cssfont-size で制御できます。
hr は水平線を表し、CSS の border-top または border-bottom で置き換えることも、画像で表すこともできます。
上記のタグはすべて最近の HTML 標準に準拠していますが、コンテンツに意味的な意味を与えるものではありません。他にも用途はあるかもしれませんが、それほど有害ではなく、以下の安っぽいラベルに立つと間違いを犯しやすくなります。
u は下線付きの要素を表します。これは、テキストに接続のように下線を付けたままにするため、おそらくこのタグが消えた理由です。人々は、接続されていないテキストに下線が引かれることを本当に好みません。
center は要素を中央に配置できます。 CSS プロパティ text-align は中央揃えだけでなく、左揃え、右揃え、両端揃えも可能です。 menu はメニュー リストを作成するために使用されます。ul よりも美しく作成されますが、順序なしリストの方が一般的であり、ul は menu を置き換えます。
layer 要素は div 要素に非常に似ていますが、古いバージョンの Netscape ブラウザでのみ機能するため、ほとんど役に立ちません。
点滅またはマーキー。彼らには断固として「ノー」と言いましょう。
font を使用して、フォントの名前、サイズ、色を定義できます。ページ全体でフォント タグを継続的に使用する古い Web サイト (および現在の Web サイトでも) は、シロアリの蔓延のようなものです。 Web 作成ソフトウェアの中には、各要素の周囲にフォント タグを配置して、テキストの色やサイズを制御するものもあります。 font タグを使用してすべての要素に適用します。CSS で表現する場合は、簡単な文だけで済み、サイト全体で変更できます。この方法を使用すると、Web ページのサイズを縮小できるだけでなく、単純な CSS ステートメントを変更するだけでフォントで表されるコンテンツを変更することもできます。これにより、Web サイトのスタイルの一貫性が保たれます。 Web ページが肥大化する主な原因は、フォント タグと表の誤用です。
属性
ラベルを正しく使用しているかもしれませんが、ラベルには不快な寄生特性があり、不快感を引き起こす可能性があります。
name は要素に名前を割り当てます。これは、input などのフォーム要素では完全に機能しますが、それ以外の場合、名前の役割は id 属性によって引き継がれます。
text と bgcolor は、オープンボディタグの基本テキスト色と背景色を指定するために使用されます。 CSS の色と背景色のプロパティは、本文セレクターに適切に適用できます。
背景にはbodyタグの背景画像を指定できます。 CSS は、background-image などのより優れた背景画像属性を提供できます。
link、alink、vlink では body タグのリンク色を指定できます。 CSS プロパティ::link、:active、:visited も同じ効果があります。 align は、<div align="center">Stuff</div> などの要素の配置を制御できますが、center タグと同様に、css で text-align 属性を使用できます。
ターゲット リンクは、新しいウィンドウ <a href="wherever.html" target="_blank">ヘルプ</a>を開くなど、さまざまな状態で開かれます。良さそうですが、このサイトには馴染みがありません。ユーザーは、これら (新しいウィンドウを開くなど) が魔法のように見えることを期待していません。ほとんどのユーザーは「戻る」ボタンを使用することを好みます。新しいウィンドウを開くということは、この機能が無効になっていることを意味します。画像の幅と高さ、表のセルパディングとセル間隔などのタグのパフォーマンス属性によって、さまざまな要素へのさまざまな属性の適用が決まります。これらは完璧な解決策ではありませんが、ページに多くの画像や表が含まれている場合は、他に実行可能なオプションがない可能性があります。
説明できないプレゼンテーション属性のほとんどは textarea タグに属します。このタグには、cols と rows の有効な属性があるだけでなく、最新の HTML 標準でもこれらの属性が必要です。
ラベルは良いが、アプリケーションは悪い。
家に入るには、ひざまずいて犬の穴を這うかもしれませんが、待ってください、人のために特別に設計されたドアの装飾があります、ハンドル、はは、ほら、ドアは人が通り抜けるのに最適なサイズです。
HTML タグは詳細に設計されており、信頼できるかどうかにかかわらず、正しく使用すれば最高の結果を得ることができます。
HTML がセマンティックである場合、ul タグを使用してリストを強調したり、h1 または h2 タグを使用して見出しを強調したりするスクリーン リーダーなど、障害のあるユーザーにとって Web ページがより使いやすくなります。
HTML の最も深刻な乱用は、テーブルがレイアウトに使用されることですが、テーブルは表形式のデータを表すためにのみ使用されます。テーブル レイアウトを使用しないというアイデアは、仏教のように悟りを求めることではありません。これには、Web ページのサイズが小さくなるだけでなく、Web ページの保守と再設計が容易になるという実際の利点があります。
一部のデザイナーは、移行デザイン (特にテーブル レイアウト) を完成させるためにいくつかのタグと属性を使用することがあります。まず、古いバージョンのブラウザー (Netscape 4) をサポートできます。 Netscape 4 ではテーブルのパフォーマンスが CSS よりも優れていましたが、そのユーザーは非常に少なく、モバイル ユーザーが増加している現在、テーブルのレイアウトは非常に悪いです。上で説明した表の利点は欠点をはるかに上回っています。その理由は、ページではスタイルを最小限に抑えながらすべてのブラウザー機能を考慮する必要があるためです。
フレーム
ゴルディロックスは、お粥のボウルで彼女を助けるのはとても良い考えだと思いますが、その後、3匹の大きな捕食者が現れ、彼女を窓から投げ捨てます。フレームはクマの粥のようなものです。見た目は良いですが、危険は常に存在します。
ほとんどの Web サイトはフレームを使用せず、ほとんどの Web サイト ユーザーは 1 ページのみを使用します。
しかし、何らかの理由で、ユーザーが特定のページをブックマークに追加できないようにする必要がある場合、または特定のページが電子メールやインスタント メッセージング経由で紹介されるのを防ぎたい場合、または使用にさらに全体的な複雑さを加えたい場合はどうなるでしょうか。画面の読み取り フレーム間を移動する必要があるブラウザーの障害のあるユーザー、または検索エンジン地獄に入りたい場合は、フレームを使用してください。
基本的に、フレームワークは複雑さを増し、使いやすさを損なうだけです。
最後に、以下のルールに従えば、それほど間違ったことはしないでしょう。
1) ラベルまたは属性の名前が比較的馴染みのない場合は、コメントするか、使用しないことをお勧めします。こうすることでCSSの利用効率が上がります。
2) レーベルにその名の通りの仕事をさせます。テーブルは表形式のデータに使用されます。タイトルにはタイトルを使用するなどしてください。
3) 明確なコンテンツがある場合は、適切なタグを使用します。リストにはリストを、タイトルにはタイトルなどを使用します。