htmlを記述する際、1行目に宣言文を記述しないといけませんが。
Strict DTD (厳密型) TransitionalDTD(移行型) FramesetDTD(フレーム型)
とはいったいなんですか?
普通はStrict DTD (厳密型)を使用するようですね。
しかし、勉強している内に、TransitionalDTD(移行型)とFramesetDTD(フレーム型)が出てきました。
FramesetDTD(フレーム型)は、1ページ内に、2枠以上のページを使うときに使用しました。
TransitionalDTD(移行型)は、index.htmlがあるとしたら、そのページ内に入れる2枠目からの、html文書の宣言文として使ったのですが、この考え方は正しいのでしょうか?
テキストを使って独学でやっているのですが、3つの区別があまりわかりません。
どういう風に考えるとよいのでしょうか?
A 回答 (5件)
- 最新から表示
- 回答順に表示
No.5
- 回答日時:
>ここまでご説明頂いて誠にありがとうございます。
しかし、HTMLを学んで1ヶ月>程度の私にはあまり理解できないです。すいません。
そうですか?
でも、ウェブはフリーウェイです。初心者もベテランもまったく平等に自由です。そこでは、「初心者マーク」をつける義務も「初心者を保護する」責任もありません。自由と言うものはそんなものです。それを厳しいと感じるか、すばらしいと感じるかは人それぞれでしょう。ただ、「初心者です」が言い訳にならない世界であることは間違いありません。
私がネットを始めた当時はこんな親切な掲示板などなくて安易に質問すると「man!」と返信が帰ってくるだけでした。--manとはmanualのこと、Windowsのコマンドプロンプトで「help」と入力すると操作方法が出てきます(UNIXだとman)ね。「あれに書かれている内容は聞くな」良い意味で解釈すると「自分で公開されている資料を読むようにしないと上達しないよ!」と言う意味。
>TransitionalDTD(移行型)は、index.htmlがあるとしたら、そのページ内に
>入れる2枠目からの、html文書の宣言文として使ったのですが、この考え
>方は正しいのでしょうか?
違います。
>3つの区別があまりわかりません。
結論はすでに書きましたが、初心者に限らず「原則strictだけ」と考えればよいです。strict以外は、後方互換でいずれ廃止されるか使えなくなる。
★初心者は最初に出会う資料でその後無駄な時間をすごすか、効率的に学べるかが決まります。たとえば
14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
に書かれている様々なテクニックに頼ることを覚えてしまうと上達はできませんし、それを捨てるために大変な苦労をすることになります。時間も無駄!!
あなたが「プログラムに頼らず」テキストエディタで始められたことはとてもすばらしいことです。頑張ってください。
ただ、「初心者」「高齢者」などの免罪符は書かなくて良いです。質問内容を読めばたちどころにわかります。これらの言葉は相手ではなく自分自身に対する言い訳になってしまいます。
No.2で最初に読まれるべき資料をあげておきました。
それと、つねにHTML 4.01 Specification (ja) ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )を参照してみること。はじめはチンプンカンプンですが、少なくともどんな参考書よりも的確で正しい情報が、本よりもはるかに少ない文字数でまとめられています。一度全体を流し読みしておくこと。
No.4
- 回答日時:
2枠以上のページも、2ブロックに分けた1つのhtml文書で、cssで2枠以上にデザインすることが現在の主流になっています。
フレームのように片方が完全固定で縦にもスクロールしない場合はJavaScript等も併用することが多いです。閲覧しにくいだけでなく、検索エンジンとも相性が悪い為、フレームタイプは敬遠する管理人が多くなりました。(閲覧しにくいとは、利用者が個々のページにブックマークやリンクを貼りにくい、個々のページから入ると行き止まりページになる等)私も皆さんと同じで、これからつくるならStrict宣言で作られることをお勧めします。
両者の違いは過去のブラウザに合わせ解釈をわざと間違えて表示するTransitionalと仕様書に従うStrictです。フレームタイプ以外にも移行型は使用できます。お勧めはしません。
移行型は解釈の話になる場合、過去互換・後方互換とも呼ばれます。どう解釈がちがうのかをまとめたページを紹介します。宣言文によってこのブラウザは過去互換、こっちは標準で解釈などと入り乱れますので、ご注意ください。
●標準準拠・後方互換モード各々の CSS 解釈の違いをまとめたドキュメントを共有
http://2xup.org/log/2007/07/27-2111
No.3
- 回答日時:
インターネットの設計原則を述べた RFC 1958 という文書に、次の一文があります。
| Be strict when sending and tolerant when receiving.
| 送信時は厳密に、受信時は寛容に。
HTML 4.0(1) の strict.dtd と loose.dtd も、ある意味ではこれに対応します。これからページを作る人は厳密に作ることができますが、一方で、古い仕様で作られた古いページを保守しなければならない人もいます(特に、ブラウザはどんなに古いページだろうとサポートすべきです)。
古いページは古いまま「寛容に」残しつつ、必要であれば少しずつアップデートして厳密型に「移行」していく……という意味で、厳密型から外された古い要素・属性を、ある程度残してあるのが移行型です。まあ、一向に「移行」が進んでないサイトがほとんどですけどね。
---
フレーム型は移行型の特殊形で、フレーム定義ページでのみ使用されます。個々のフレーム内のページは移行型で書かれることがほとんどでしょう。なぜなら、厳密型にはフレームターゲットを指定する target 属性が含まれないからです。もちろん、フレームターゲットを使わなければ厳密型を使っても構いませんが。
HTML 4.0 ができた 1997/1999 年の段階では、フレームは次世代の仕組みに置き換わる予定でした。ですが、次世代フレームの計画は頓挫し、未だに古いフレームが残っているのが現状です。
No.1 でも書かれておりますが、HTML5 では文書型の区別がなくなり、「ページ作者が使って良い要素・属性」と「廃止されたがブラウザはサポートすべきもの」に分けられました。フレームは後者です。
---
そもそも論として、文書型宣言(<!DOCTYPE HTML ...>)は基本的に過去の遺物です。しかし、いろいろな政治的事情が絡んでしまい、「書かなくても良い」と言えなくなってしまいました。
個人的には <!DOCTYPE html> だけを書き、中身は HTML 4.0 なり XHTML 1.x なり好きなもので書けば良いと思います。少なくとも、厳密型ではなく移行型を宣言するくらいなら、<!DOCTYPE html> だけにしておいた方が無難です。DOCTYPE スイッチという変な仕組みがあって、これがまた面倒くさいのです(なので『普通は厳密型を使用する』という認識を持ち続けて下さい)。
まあ、過去の遺物とは言え、DTD をその場で解釈してタグや属性の補完をしてくれる HTML エディタもありますので、損ばかりではないでしょう。
No.2
- 回答日時:
補足
>テキストを使って独学でやっているのですが、3つの区別があまりわかりません。
>TransitionalDTD(移行型)とFramesetDTD(フレーム型)が出てきました。
あまり良いテキストではないようですね。肝心なところが最初に説明していない。たぶん、この様なデザインのページはこの様にマークアップするというスタンスではないでしょうか?
だとしたらゴミ箱直行ですね。
仕様書をきちんと読んでいない人が書いている。まあ、仕様書が読める人なら本を書くより「仕様書を読みなさい」とアドバイスするでしょう。仕様書を知らないか、読んでない、読んでも理解できないから本を書く。だから良い本がないのですが・・・
はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )
・・HTML4.01仕様書翻訳メンバーの代表的な内田さんがお子さんのために書かれた解説書
1と2の間辺りからはじめるホームページ講座 ( http://www6.plala.or.jp/go_west/ )
1と2の間辺りからはじめるCSS講座 ( http://www6.plala.or.jp/go_west/ )
このあたりからはじめるのがお勧めです。
No.1
- 回答日時:
まず仕様書をいつも読む癖をつけましょう。
【引用】____________ここから
どういう場合に厳密型DTD、移行型DTD、フレーム設定型DTDを用いるかについては、 HTMLバージョン情報の項を参照のこと。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[4.2 SGML (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
→7.2 HTMLバージョン情報 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
★仕様書は、どんな回答よりもまず参考にすべきものです。
現在策定が進んでいるHTML5の仕様書を読むと、より厳しく書かれています。すなわち、
「著者が使えるもの」と「ブラウザがサポートしなければならないもの」に明確に分けられました。
HTML4.01では後方互換のため「推奨」と「非推奨」に分けていましたが、W3Cなどの意向に反して、「非推奨」が使われ続けていました。そのため、本来は使われなくなるはずの多くの要素や属性がいまだに使われ続けています。
その反省からHTML5では、このような区別になり、ブラウザがサポートしていても著者は使えなくなり、正統なHTML5としてValidatorをパスできなくなりました。その視点でHTML4.01の仕様書を読み直すと、「非推奨(TransitionalとFrame)」は『著者が使えないものだけどユーザーエージェントはサポートすべきもの』と言う意味です。それで、TransitionalやFrameの置かれている位置がお分かりでしょう。HTML4.01仕様書にも
【引用】____________ここから
HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。 HTML 4仕様が定める各DTDの詳細については バージョン情報の項を参照のこと。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Conformance: requirements and recommendations (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
【引用】____________ここから
【推奨しない】
推奨しない要素・属性とは、新しい枠組みができたことによって、陳腐化したものを指す。推奨しない要素は、リファレンスマニュアルの各所で定義し、推奨しないことを明記する。推奨しない要素は、HTMLの将来のバージョンでは廃止になる可能性がある。 ユーザエージェントは、過去との互換性のため、 推奨しない要素をもサポートすべきである。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Conformance: requirements and recommendations (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
その後のXHYML1.0は、HTML4.01をそのままXMLにしたものですからTrnsitionalやFrameは残っていますが、XHTML1.1、そしてHTML5では、HTML4.01で非推奨だった要素や属性は姿をすべて姿を消しました。(uとiframeは除く)
私はもちろん、ここ5,6年はすべてstrictです。最近はHTML4.01strictであってもHTML5の仕様を念頭においてマークアップをしています。そのうえで、
★Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint. … )
★The W3C Markup Validation Service ( http://validator.w3.org/#validate_by_input )
でチェックすることを心がけています。
さらに付け加えるなら、HTML4.01の仕様書であちこちで書かれている「HTMLは文書構造を」「スタイルシートはプレゼンテーションを」という目標も、文書構造を示す要素がHTML4.01では決定的に不足していたため、SEOが仕事であるプロ以外、文書構造によるマークアップも進みませんでした。
HTML5では文書構造を示す構造化要素やセマンティック(意味のある)要素が大幅に増えました。今後はdivを多用した意味のないマークアップも減っていくでしょう。(SEOを売り物にしている我々プロの出番がなくなるということ)
たとえば、HTML5では次のようなマークアップになります。
<body>
<header> <!-- 構造化要素 -->
<hgroup> <!-- 構造化要素 -->
<h1>大見出し</h1>
<h2>中見出し</h1>
</hgroup>
<article> <!-- 構造化要素 -->
<h3>要約</h3>
<p>文章</p>
</article>
</header>
<section><!-- 構造化要素 -->
<h2>本文見出し</h2>
<p>段落</p>
<article> <!-- 構造化要素 -->
<h3>補足</h3>
<p>文章</p>
</article>
<aside> <!-- セマンティック要素 -->
本文と直接関係しない記事
</aside>
</section>
<footer><!-- 構造化要素 -->
<section>
<h2>文書情報</h2>
<dl></dl>
</section>
<nav><!-- 構造化要素 -->
<h3>サイトマップ</h3>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</nav>
</footer>
</body>
これだと一目(人目?じゃなく検索エンジンの目にも)で、文書構造は分かれますよね。よって形だけHTML4.01ではなく、HTML4.01でも、
<body>
<div class=""header"> <!-- ヘッダ -->
<div class="hgroup"> <!-- 見出しグループ -->
<h1>大見出し</h1>
<h2>中見出し</h1>
</div>
<div class="article"> <!-- 要約 -->
<h3>要約</h3>
<p>文章</p>
</div>
</div>
<div class="section"><!-- 本文 -->
<h2>本文見出し</h2>
<p>段落</p>
<div class="article"> <!-- 関連記事 -->
<h3>補足</h3>
<p>文章</p>
</div>
<div class="aside"> <!-- 余禄 -->
本文と直接関係しない記事
</div>
</div>
<div class="footer"><!-- フッタ -->
<div class="section">
<h2>文書情報</h2>
<dl></dl>
</div>
<div class="navigation"><!-- ナビ -->
<h3>サイトマップ</h3>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>
</div>
</body>
とマークアップすべきですし、そうしてきました。SEOが仕事のプロは実はそうしている。
★文書構造によるマークアップはそうしたものですし、このようにHTMLが書かれているとスタイルシートはHTMLを見なくても書けますし、デザインのためにHTMLに無意味なIDやclass名はつけなくてすむ。
たとえば本文中の脚注(補足)は
div.section div.aside{
position:absolute;left:101%;width:170px;
font-size:0.9em;
border:solid blue 2px;
}
で、本文枠外の右に一回り小さい文字で表示される。・・
結論
★strictで作るべき。いずれなくなる要素や属性を使うな。
★HTMLは文書構造に専念、プレゼンテーションはスタイルシートで
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript スマホ上で、左右スワイプで次のページに移動させたいです 2 2022/11/11 17:04
- C言語・C++・C# プログラミングの問題です。至急教えてください。 /***から***/の部分をプログラミングにしてほし 1 2022/10/13 11:48
- TOEFL・TOEIC・英語検定 2014年に購入した英文法書でTOIEC対策をしてもよいか? 1 2023/01/08 11:41
- PHP $_SESSIONに渡した後はそのまま使っても問題ありませんか? 3 2022/11/08 22:17
- 大学・短大 レポートの参考文献 1 2023/05/21 20:45
- Excel(エクセル) Excel マクロで For 文のインデックスを先に宣言する理由 7 2022/08/27 00:26
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- その他(プログラミング・Web制作) 次に、楽天のアジャイル就活に参加して、1日で内定を獲得できる。私は大企業に就職できる? 2 2022/04/17 13:38
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
複数のボタンを等間隔に、かつ...
-
<div id="container">の使いか...
-
html の divとtable の役割
-
HTML属性での「""」 「''」違い
-
オシャレな区切り線はありませ...
-
DD,DT,DDを横並び。paddingとma...
-
footerのclear:bothが効きません
-
div要素が重なってします
-
背景画像に全体または部分的に...
-
h1を親要素の縦中央、画像の横...
-
HTMLのJIS規格について
-
divとpの使いわけ
-
インラインフレームのページ内...
-
HTML5の終端タグ「 />」について
-
可変長要素を中は左寄せのまま...
-
h1に自分自身へのリンクを張...
-
[CSS]リキッドレイアウト上で、...
-
ローカルとWeb上で見え方が違う...
-
min-heightとheightの違いについて
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
div要素が重なってします
-
HTML属性での「""」 「''」違い
-
複数のボタンを等間隔に、かつ...
-
ヘッダーとフッターだけ背景を...
-
html の divとtable の役割
-
<div id="container">の使いか...
-
divとpの使いわけ
-
min-heightとheightの違いについて
-
HTML5 iframe の代わり
-
divの中に外部のHTMLを埋め込む
-
3カラムレイアウトで「常に残り...
-
ヘッダーを左右に二分割する方...
-
画面を縮小するとカラムが落ち...
-
reuterのScraypingで不思議な現...
-
htmlの見出しタグ(<h1>)の次...
-
1サイト内にHTML5とXHTMLが混在...
-
inline-blockをネストすると表...
-
html5でheaderの中にnav
-
<!-- #BeginLibraryItemとは
おすすめ情報