No.2ベストアンサー
- 回答日時:
読み返してみると、なぜないかの説明にはなってませんね。
ちょっとHTML/CSSの歴史を復習されると分かると思いますので、まずHTML4.01仕様書の
2.2.1 HTMLの略歴( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
2.4 HTML 4による文書の著述( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
を読んでください。それでピンと来るかも。
また、
HTML5“とか”アプリ開発入門(1):Webの3つの問題を解決する「HTML5」とは何なのか (2/2) - @IT( http://www.atmarkit.co.jp/ait/articles/1008/30/n … )
の「【問題2】文書内に埋め込まれた「意味」が不明確」あたりも良いですね。
肝心な事は、あなたが作成するHTMLにおいて、良いマークアップとは、
「「どこからどこまでが重要な本文なのか」「この<ul>要素はナビゲーションメニューを表しているのか、文書中の個条書きなのか」すらも分からない」
ではダメだという事ですね。
HTML4.01では、「DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )」でしたね。具体的にいうと
・ここは、このHTMLのヘッダに当たる(本文じゃない)ので
<div class="header">~</div>
・ここは本文なので
<div class="section">~</div>
・ここは内容とは直接関係しないので
<div class="aside">~</div>
の様にマークアップされてこられたと思いますが、記事のその部分が、作者にとって主題なのか、そうでないのかは他人には判断できないのです。
今後、HTML5が主流になると思いますが、HTML5では
『文書をよりよく構造化するために、( http://standards.mitsue.co.jp/resources/w3c/TR/h … )』新しい要素が追加されますので、よりこの流れが進むでしょう。HTML4.01のように、何でもかんでもDIVとclass名はできなくなります。
"Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable.( http://www.w3.org/TR/2012/CR-html5-20121217/grou … )"
(著者は、他に適切な要素がないときの最後の手段としてdiv要素を使用することが強く奨励される。)
文書のアウトラインを構成するブロックはsectionを階層をつけてでマークアップするなど・・。
<body>
<header></header>
<section>
<h2></h2>
<p></p>
<section>
<h3></h3>
<p></p>
<section>
<h4></h4>
<p></p>
</section>
<aside></side>
<nav></nav>
・・・・
4.3.3 The section element( http://www.w3.org/TR/2014/REC-html5-20141028/sec … )
他人の書いた、マークアップはその著者が意図してマークアップしている物なので、他人がその正否を判断することはできないのです。
スタイルシートは、そのHTMLにおける文書構造に基づいてセレクタ書くのですから・・
section{margin-left:2em;font-size:0.95em;}
とすればsectionの階層ごとには左が字下げされ、文字は少しずつ小さくなる、
section section section{margin-left:0;font-size:100%;}
とすれば3階層以降は字下げもフォントサイズ縮小もない。
要は自分で仕様書をよく読んで理解して、自分の意図した通りにマークアップすることが正しいのですよ。
とりあえずHTML4.01とCSS2.1の仕様書くらいはマスターしましょう。誰から文句のつけようがないマークアップを自分ですればよい。
No.1
- 回答日時:
機械的なものでしたら
⇒Another HTML Lint - Gateway( http://www.htmllint.net/html-lint/htmllint.html )
⇒W3C CSS 検証サービス( http://jigsaw.w3.org/css-validator/#validate_by_ … )
⇒The W3C Markup Validation Service( http://validator.w3.org/#validate_by_input )
などがありますが、あくまで文法以上のチェックはしてくれない。
<p>この章の見出し</p>
<h4>ここは記事だよ・・・</h4>
でもエラーにはならない。
そのようなサービスはないでしょう。時間の無駄・・・。例えば、ここでHTMLやCSSに突っ込みを入れようなら、猛反発を受けるのが必至です。
そもそも、仕様書には懇切丁寧に、とても詳しく説明されています。そこにすべて書かれている。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- ホームページ作成・プログラミング web制作(HP作成について教えてください) 閲覧ありがとうございます。 今、WEB制作の勉強をして 2 2023/04/13 07:23
- 会社・職場 今後の仕事について 閲覧ありがとうございます。 私は現在28歳の男性です。 自分が向いている仕事、続 3 2022/08/01 12:19
- Web・クリエイティブ 独学でwebデザイナーを目指すには 2 2022/09/17 16:27
- HTML・CSS CSSが上手く反映されないみたいです 2 2022/11/21 16:19
- その他(プログラミング・Web制作) 次に、楽天のアジャイル就活に参加して、1日で内定を獲得できる。私は大企業に就職できる? 2 2022/04/17 13:38
- HTML・CSS サイトをマルチデバイス対応にする為の準備や、CSSなどのおすすめサンプル集やアドバイスを頂きたいです 1 2022/07/13 22:15
- システム 古いWEBシステム。もう追加プログラムは作れない? それともできる? 6 2022/06/08 13:41
- その他(アニメ・マンガ・特撮) イベントの参加について 1 2022/07/14 08:23
- その他(悩み相談・人生相談) こんばんは。 最近自分が仕事をしていて多々感じることがあります。 当たり前ではありますが、仕事ができ 1 2022/06/29 21:53
- モニター・ディスプレイ ディスプレイアダプターが2個あります。対処法を教えて下さい。 1 2022/11/06 16:15
関連するカテゴリから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とは
おすすめ情報