私はウェブ開発に乗り込もうとしているので、HTML、CSS、JavaScriptの学習を始めました。私はJavaScriptで本当にうまくやっていますが、私の命を救うためにHTMLとCSSで何かを作ることはまだできません。改善するためのいくつかの場所やヒントを尋ねるつもりでしたが、質問が何度も尋ねられ、削除されるだけであることを知っているので、他の人のWebサイトのソースを表示するだけだと思いました。
私が見続けるのは、左と右のテーブルです。テーブルを使用する正当な理由はありますか?
私はウェブ開発に乗り込もうとしているので、HTML、CSS、JavaScriptの学習を始めました。私はJavaScriptで本当にうまくやっていますが、私の命を救うためにHTMLとCSSで何かを作ることはまだできません。改善するためのいくつかの場所やヒントを尋ねるつもりでしたが、質問が何度も尋ねられ、削除されるだけであることを知っているので、他の人のWebサイトのソースを表示するだけだと思いました。
私が見続けるのは、左と右のテーブルです。テーブルを使用する正当な理由はありますか?
回答:
表形式のデータをレイアウトするため。
ここでは、テーブルとcssコンテナーのどちらを選択するかを自問するためのいくつかの質問を示します。
表は表形式のデータ用です。限目。
<table>
タグはありません悪。一部の人々が考えたり言ったりしても、CSSの目的はそれを決して使用しないことではありません。ただし、セマンティックHTMLの原則の帰結として、レイアウトにはテーブルを使用しないでください。ここでも、強調のために、独自の段落として、レイアウトにテーブルを使用しないでください。ずっと。
テーブルが正しい選択であるかどうかを判断できない場合は、次の質問を自問してください。
- 「情報の行または列は共通の属性を共有していますか?」
- 「行または列の順序を変更しても、それでも意味がありますか?」
- 「テーブルの軸を転置した場合(行を列に、その逆の場合)、それでも意味がありますか?」
上記に対する答えが一般的に「Hrm ...私はそうではない」である場合、テーブルを使用するべきではありません。
さらに説得力が必要な場合は、「セマンティックHTML + CSSと比較してテーブルが悪い(レイアウトの場合)理由」を参照してください。
n
してn
行グリッドごとに表形式の列を表示するのはなぜですか?それはまさにテーブルが使用されるべき場所です。おそらく、CSSグリッドレイアウトが(少なくとも各リリースのいくつかのリリースでクロスブラウザがサポートされるようになれば)いつかそれを置き換えるでしょうが、まだありません。
表形式のデータだけでなく、ページレイアウトとして使用されるテーブルを意味すると仮定します...
CSSを使用するのがいらいらしているため、表が表示されています(確かに、数年前よりも明らかに少なくなっています)。ある時点で、仕事を終わらせなければなりません。CSSを使用してそれを「正しく」行うには、無限の手間と実験が必要です。一方、テーブルは直感的に把握できます。
(CSSを使用して)正しく実行し、CSSでの生活を無駄にしたくない場合は、いくつかの異なるレイアウトで解決し、テンプレートWebサイトから一部のCSSを削除することが最善の妥協策です。テンプレートを出発点として使用します。CSSをゼロから始めることは、フラストレーションのレシピです。
テーブルベースのレイアウトは、HTMLの学習を始めたばかりの人にとって、純粋なCSSレイアウトよりも簡単に学習できます。また、昔は、CSSを確実に使用できず、すべてのブラウザーで動作させることができませんでした。したがって、2000年までのほぼすべてのHTMLチュートリアルでは、レイアウト専用のテーブルを使用していました。そのHTMLコードの多くは(ソースの表示を介して)他のサイトに渡され、多くの人々がそれらのチュートリアルから学び、CSSレイアウトの学習に煩わされませんでした。
CSSを学ぶ前に、テーブルでレイアウトを始めれば大丈夫だと言います。初心者レベルの違いはせいぜいわずかです。1年か2年の経験がなければ、どちらでも非常に複雑なレイアウトを作成することはできません。そのため、それほど大きな違いはありません。画面から何かを得て、関心を維持するために表から始め、ゆっくりとCSSを読み続けます(これは長期的には明らかに優れています)。「Designing with Web Standards」の日にCSS-Zealotに戻ったことがありますが、それは、独り言で優れていることが楽しかったからです。
ブラウザが問題です。何がベストプラクティスであり、誰もが同意したことにもかかわらず、間違ってコーディングされていたとしても、テーブルのないブラウザーでWebサイトを一貫して見栄えよくすることは非常に困難でした。それは意味論と関係があります。これは、HTMLで学ぶ最も重要なことであり、タグの意味の意味です。学ぶのに最適な場所は、Educator.comがHTMLビデオについて持っている最初の5つほどのビデオです。これらはすべてHTML5を念頭に置いて行われ、セマンティクスとは何か、なぜ重要なのかを説明しています。