複製:
最近、table タグではなく div を使用して、ページをよりブラウザらしくするという話がよくあります。なぜdivの方が良いのですか?
複製:
最近、table タグではなく div を使用して、ページをよりブラウザらしくするという話がよくあります。なぜdivの方が良いのですか?
Visual Studio 2008 で開発された私の c# モバイル アプリケーションでは、FTP を使用しようとしています。FTP は実際のデバイスからは正常に機能しますが、デバイス エミュレーターを使用すると機能しません。接続は成功しますが、データを取得しようとすると失敗します。どちらもwindows mobile 5を使用しています。
あなたの何人かはすでにこの問題を抱えていましたか?私がググったとき、それは再発しているようですが、まだ解決されていません。
これは、ftp サーバーによって表示されるログです。
(000001) 04/05/2009 09:50:59 - (ログインしていません) (127.0.0.1)> 接続され、ウェルカム メッセージを送信しています...
(000001) 04/05/2009 09:50:59 - (ログインしていない) (127.0.0.1)> 220-FileZilla Server バージョン 0.9.31 ベータ
(000001) 04/05/2009 09:50:59 - (ログインしていない) (127.0.0.1)> 220 FTP サーバー
(000001) 04/05/2009 09:50:59 - (ログインしていない) (127.0.0.1)> ユーザー aa
(000001) 04/05/2009 09:50:59 - (ログインしていない) (127.0.0.1)> 331 aa にはパスワードが必要
(000001) 04/05/2009 09:51:00 - (ログインしていない) (127.0.0.1)> PASS **
(000001) 04/05/2009 09:51:00 - aa (127.0.0.1)> 230 ログオン
(000001) 04/05/2009 09:51:01 - aa (127.0.0.1)> SYST
(000001) 04/05/2009 09:51:01 - aa (127.0.0.1)> FileZilla によってエミュレートされた 215 UNIX
(000001) 04/05/2009 09:51:01 - aa (127.0.0.1)> CWD /
(000001) 04/05/2009 09:51:04 - aa (127.0.0.1)> PASV
(000001) 04/05/2009 09:51:04 - aa (127.0.0.1)> 227 パッシブ モードに入る (127,0,0,1,5,22)
(000001) 04/05/2009 09:51:41 - aa (127.0.0.1) > 切断されました。
ここでのポイントは、それらをレイアウトに使用することです。表形式データのテーブルには何も問題はありません。念のため。それが彼らの目的です。
しかし、レイアウトにテーブルを使用している場合、非常に厳格なページ構造が作成されます。これは通常、さまざまな画面サイズ、ユーザー エージェント (視覚障害者向けのモバイル ブラウザーやスクリーン リーダーを考えてください。特に後者の場合、順序を破壊しています) とはうまく機能しません。コンテンツがユーザーに読み取られる必要があります)。残念ながら、テーブルは依然としてページをレイアウトするための最も堅牢なメカニズムの 1 つです。実装の違いはほとんどなく、10 年以上にわたって問題なく動作しているためです。CSS はここではまったく別の問題です。
しかし、基本的には次のようになります。
<div>
にand を使用しない限り、基になるマークアップのより良いセマンティックな意味が可能になり<span>
ます。意味があり、そのように使用する必要がある多くのタグがあります。たとえば、 を使用できる<div class="heading1">
場合は使用しないでください<h1>
。いくつかの理由:
1) div は、ほとんどの場合、より意味的に正しいです。テーブル構造でサイトをコーディングしている人は、表形式のデータである目的のためにテーブルを使用していません。div はページの「分割」またはセクションを表すため、項目を div に配置する方がより正確です。
2) div はより柔軟で、スタイルと保守が容易です。<table><tr><td>Text here</td></tr></table>
代わりに書くことができる場合は、何かを言いたいときに毎回書く必要はありません<div>Text here</div>
。css フック (つまり、クラスまたは要素) をテーブルと div の両方に追加できますが、div を使用すると無限に柔軟になります。
3) テーブル構造のサイトは単純に醜い :)
テーブルはセマンティックな意味を伝えるため、h1 のように現在表形式のデータを表示しているということは、見出しがあることを意味します。したがって、テーブルを使用して出力をフォーマットすると、コードのセマンティクスの解釈を誤解させることになります。
これは、たとえば、スクリーン リーダーを使用しているユーザーのアクセシビリティの問題につながる可能性があります。
div ベースのデザインとテーブル ベースのデザインの長所と短所を次に示します。
div を使用すると、デザインで簡単に制御できるため、テーブルを使用するよりも優れています。また、テーブルよりもコントロールのコンテナーにすることができます。テーブルは、同様の構造を持つデータをグループ化するために主に使用されるため、このタスク用の設計ですが、div はコンテナーと見なされます。主にテーブルより。多くのコントロールを収集するときとコンテナーを制御できるときの違いを見つけましたが、テーブル内に挿入する必要があり、相互にループしているために混乱しました。
div を使用する個人的な主な理由を説明します。
テーブルには静的グリッドのみがありますが、div は動的です。テーブルの最初の行はすべての列を定義します (MS Excel のように)。次の行では、これらの列を組み合わせることができますが、最初の行で定義した基本レイアウトを変更することはできません。div は動的です。パッチワークを作成して、div をオーバーラップさせたり、間にスペースを入れたりすることができます。あなたが望むものなら、なんでも。順番に考える必要はありません。あなたは自由だ。はるかに柔軟です。
テーブルは、レンダリングとブラウザー間の非互換性の問題を引き起こします: テーブルは常に同一に見えるわけではありません。各ブラウザは、表とその内容を独自に解釈します。したがって、多くの不快な驚きがあります。あるブラウザでは、通常のテキストが太字で表示されます。別のブラウザでは、テーブルが他の html 要素に対して多かれ少なかれ余白を持っているため、テーブルが適切に配置されていません。これらの問題を複雑な回避策で解決するには、何時間もの作業が必要です。div は、すべてのブラウザで常に同じように見えます。IE (Web プログラマーにとってトラブルメーカーとしてよく知られている) でさえ、div を使用している場合は問題が少なくなります。
Div のレンダリングが速い: Div はテーブルよりも速くロードされます。ページ間の高速ブラウジング。より良いルック アンド フィール。
それが役に立てば幸い。乾杯。
ほとんどの人は、テーブルがデータのみに使用されることになっている方法について続けており、レイアウト目的で使用するとパフォーマンスの問題が発生します。また、 <div> フローを左に、右に、その他の場所にフローできるため、より柔軟になるはずです。
ただし、私見は努力する価値はありません。特に、対応するラベルと適切に整列するはずのコントロールの列がある場合、適切に整列するのに時間がかかりすぎます。
レイアウトにテーブルを使用することは Web デザインにとって革命的でしたが、それは 15 年前のことであり、他に選択肢はありませんでした。今日、表がレイアウトの対象と見なされるようになったのも、この歴史のおかげです。
CSS ベースのレイアウトは、テーブル ベースのレイアウトよりもはるかに柔軟です。テーブルを使用すると簡単に実現できることがいくつかありますが、一方で、CSS を使用すると非常に簡単に実行でき、テーブルでは非常に複雑または不可能なことがたくさんあります。
私は CSS とテーブル、時には DIV を使用していますが、テーブルは非常に包括的です! そして、Dreamweaver や Frontpage ではとても見栄えがします... テーブルを放棄するのは非常に難しいですが、そうするようです。なぜなら、ページの読み込みを高速化する必要があるからです!