none
画面のデザインにtableタグを使っていますが RRS feed

  • 質問

  • こんにちは、VB2008にてwebアプリの開発を行っています。

    画面のデザインについてご質問です。
    次のようなレイアウトの場合、

    ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
    画面のタイトル

    氏名(ラベル)  テキストボックス1
    電話番号(ラベル)  テキストボックス2
    住所(ラベル)  テキストボックス3

    確定ボタン  キャンセルボタン
    ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑

    最初は、「氏名  テキストボックス1」の行をpタグで囲み、
    「電話番号  テキストボックス2」の行もpタグで囲んでいました(住所の行も)。

    このようにすると、氏名は2文字、電話番号は4文字なので
    テキストボックス1と2と3の左端が揃いません。

    ですので、とりあえず画面のデザインにtableタグを使っています。
    すると見た目はきれいに揃いましたが、デザインのためだけに
    tableタグを使うことは一般的なことかな?と疑問に思いました。
    初歩的な質問ですみませんが、もっと簡単でやりやすい方法があれば教えて下さい。
    よろしくお願いします。




    2009年10月7日 9:58

回答

  • 比較的一般的だと思っています。
    実際私も4つくらいのWebアプリを開発してきましたが、レイアウト関係は全てTableタグを使用しています。
    (中には例外もありますが…)

    >もっと簡単でやりやすい方法があれば
    ん~…ユーザコントロール、ascxなどで対応する方法もありますが、
    ベースはやっぱりTableタグになってますね。

    ただ、今後の設計、開発、顧客要望、などでTableタグを使わないケースもあると思いますので、
    その場合は臨機応変に対応して頂ければとおもいます。
    • 回答としてマーク ボビン 2009年10月8日 2:03
    2009年10月7日 10:13
  • 割と一般的ではありますが、デザインを専門にやっている方には嫌われる傾向があると思います。
    ちょっと一般的なページを見つけられなかったのですが。

    http://seo.webmaps.biz/column-009.html
    ここに少し記述がありますが
    「専門的な知識によりHTMLタグの各タグの持つ意味という点から考えると、CSSを使ったデザイン方法が優れていると言えます。」
    ということになるようです。

    このような状況を受けて、.NET Framework 4ではコントロールによってはTableタグを生成しないようにするオプションが追加されるといった改良が行われるようです。
    http://www.asp.net/learn/whitepapers/aspnet40/#_TOC3_13
    あおい情報システム株式会社 小野修司(どっとねっとふぁん)
    • 回答としてマーク ボビン 2009年10月8日 2:03
    2009年10月7日 11:11
  • > すると見た目はきれいに揃いましたが、デザインのためだけに
    > tableタグを使うことは一般的なことかな?と疑問に思いました。

    table 様子は「表組み」のためのものですので、質問の例のような表組みを記述するのに table を使うのはごく一般
    的なことだと思います。

    ただし、table の表組みの機能を裏技的に利用して、古い Web サイトによくあるような、ページ全体のレイアウトを
    table 要素を使って組んでいくのは、CSS が一般化した今は流行らない(「Web 標準」への準拠という大きな流れに
    沿っていない)そうで、HTML(table 要素を含む)でページの構造を示し、CSS でレイアウトするのが現代の主流だそ
    うです。

    そのあたりは、よく HTML + CSS 関係の本に書いてあることですので、読んでみてください。

    • 回答としてマーク ボビン 2009年10月8日 2:04
    2009年10月7日 14:25

すべての返信

  • 比較的一般的だと思っています。
    実際私も4つくらいのWebアプリを開発してきましたが、レイアウト関係は全てTableタグを使用しています。
    (中には例外もありますが…)

    >もっと簡単でやりやすい方法があれば
    ん~…ユーザコントロール、ascxなどで対応する方法もありますが、
    ベースはやっぱりTableタグになってますね。

    ただ、今後の設計、開発、顧客要望、などでTableタグを使わないケースもあると思いますので、
    その場合は臨機応変に対応して頂ければとおもいます。
    • 回答としてマーク ボビン 2009年10月8日 2:03
    2009年10月7日 10:13
  • jun-fさん、お返事ありがとうございます。

    なるほど、jun-fさんもtableタグをお使いですか。
    割と一般的な方法なのですね。
    2009年10月7日 10:27
  • 割と一般的ではありますが、デザインを専門にやっている方には嫌われる傾向があると思います。
    ちょっと一般的なページを見つけられなかったのですが。

    http://seo.webmaps.biz/column-009.html
    ここに少し記述がありますが
    「専門的な知識によりHTMLタグの各タグの持つ意味という点から考えると、CSSを使ったデザイン方法が優れていると言えます。」
    ということになるようです。

    このような状況を受けて、.NET Framework 4ではコントロールによってはTableタグを生成しないようにするオプションが追加されるといった改良が行われるようです。
    http://www.asp.net/learn/whitepapers/aspnet40/#_TOC3_13
    あおい情報システム株式会社 小野修司(どっとねっとふぁん)
    • 回答としてマーク ボビン 2009年10月8日 2:03
    2009年10月7日 11:11
  • > すると見た目はきれいに揃いましたが、デザインのためだけに
    > tableタグを使うことは一般的なことかな?と疑問に思いました。

    table 様子は「表組み」のためのものですので、質問の例のような表組みを記述するのに table を使うのはごく一般
    的なことだと思います。

    ただし、table の表組みの機能を裏技的に利用して、古い Web サイトによくあるような、ページ全体のレイアウトを
    table 要素を使って組んでいくのは、CSS が一般化した今は流行らない(「Web 標準」への準拠という大きな流れに
    沿っていない)そうで、HTML(table 要素を含む)でページの構造を示し、CSS でレイアウトするのが現代の主流だそ
    うです。

    そのあたりは、よく HTML + CSS 関係の本に書いてあることですので、読んでみてください。

    • 回答としてマーク ボビン 2009年10月8日 2:04
    2009年10月7日 14:25
  • 小野さん、SurferOnWwwさん、お返事ありがとうございます。

    レイアウトにtableタグを使うことは、特にイレギュラーな方法ではないのですね。
    安心しました。

    とはいえ、
    > このような状況を受けて、.NET Framework 4ではコントロールによってはTableタグを生成しないようにするオプションが追加されるといった改良が行われるようです。

    できればCSSでやりましょうっていう流れもあるのですね。
    勉強になりました。

    また、
    > table 様子は「表組み」のためのものですので、質問の例のような表組みを記述するのに table を使うのはごく一般
    的なことだと思います。

    なるほど、と思いました。表を表示するためと思い込んでいましたが、
    表組みという視点から見ると、tableタグでのレイアウトは何もおかしくないですね。

    ご意見をいただけて、気持ちがすっきりしました。
    皆様ありがとうございました。


    2009年10月8日 2:02