No.1
- 回答日時:
サル → 原人 → 人間 のような進化と思えば良いでしょう。
(X)HTMLとCSS2を知っていての前提ですが、
HTML5とCSS3を勉強すれば全て分かります(自分も勉強中)
数年間は、(X)HTMLとCSS2で全く問題ありません。
今は、HTML5とCSS3で描いた方が困るでしょう・・・
とはいえ、10年前はCSS自体が同じ状況だったのです。
将来的には、優れた表現が出来るようになると思えば良いです。
「CSS3 ドラえもん」
で検索すると納得できるかも。
HTML5の簡単な違いとかは、
http://www.slideshare.net/myakura/html5-2480964
No.2
- 回答日時:
HTML 4.0 の主眼は、国際化およびスタイルシートの分離でした。
データの適切な「見せ方」は、巨大なスクリーンモニタか、モバイル機器の小さな画面か、紙面に印刷するかなど、出力メディアに応じて変わります。そのために、データそのものを記述する HTML と、データをメディアに応じた形で出力するためのスタイルシートが、別々である必要がありました。
巷の入門なんかだと、スタイルシートの制作者側のメリット・デメリットばかり強調されがちです。しかし、スタイルシートの恩恵を真に享受できるのは、利用者側なのです。そして、制作者もまた利用者の一人です。
---
HTML5 は、HTML 4.0 とはやや別の方向性にあります。
ブラウザ開発者としては、昔から「ブラウザ内で何でもできる」というのを一つの目標にしてきた節があります。ブラウザ内でアプリケーションを動かすことができれば、利用者はパッケージ製品を購入して自分のパソコンにインストールする必要もなく、必要なサービスを必要なだけ享受できます。
大雑把にまとめると、HTML 4.0 はどんなメディアにでも適切に情報伝達できることを目標にしているのに対し、HTML5 はメディアをブラウザに限定しつつ、ブラウザ内でいろんな作業ができることを目標にしています。
---
ところで、HTML 4.0(1997 年)の改訂版である HTML 4.01(1999 年)が出てすぐ、XHTML 1.0 が勧告されています。そして、来たる XHTML 2.0 では「メディアに依存しない Web アプリケーション記述」という、上記 2 つの流れを統合したものになる、はずでした。
しかし、XHTML 2.0 は従来の HTML とはかなり異なるものになるため、互換性を捨てられないブラウザ開発者に徐々に見捨てられ、XHTML 2.0 草案自体も二転三転した挙げ句に策定中止になってしまいました。これらのブラウザ開発者が集まって、従来の HTML を再利用しつつ Web アプリケーションを書けるようにしたい、というのが現在の HTML5 の提案につながります。
なお、HTML5 にも XHTML 構文(XHTML5)がありますので、「XHTML が終わった」というのはよくある誤解です。終わったのは XHTML 2.0 です。XHTML は XML であり、XML 関連ツールを適用できます。最近のプログラミング言語なら標準で XML ライブラリを持っていますので、プログラミングできるなら XHTML の方が弄りやすくはあります。
---
CSS は、バージョンではなくレベルで勧告されています。CSS Level 2 は、CSS Level 1 のバージョンアップ、というわけではありません。CSS を組み込む機器は、その機器が必要とするレベルの CSS を実装すれば良いだけです(とは言え、現在 CSS1 と CSS2 はメンテナンスが終了しており、CSS 2.1 を用いることが推奨されています)。
CSS Level 3 はさらに徹底され、モジュール化されています。色を必要としない機器は Color モジュールを実装する必要がありません。まあ、当然です。
ですから、一口に「CSS3」と言っても、どのモジュールの組み合わせかによって違いますし、それらを統合する何かは(今のところ)ありません。単に、いくつかのブラウザが適当に「つまみ食い」して実装している、というのが実情です。
CSS 2.1 までの範囲では表現しにくいものも多々ありますので、やがては部分的に CSS3 モジュールに置き換わっていくでしょう。必要を感じなければ、あせることもありません。
---
そういうわけで、「HTML4 + CSS2」「HTML5 + CSS3」なんて対立項を煽るのは、ただの滑稽話に過ぎません。HTML4 でも CSS3 は適用できますし、HTML5 で CSS2 を使うことも、HTML5 を使わないことも自由です。方向性が違うのですから、自分に合った方向のものを選べば良いだけです。
No.3ベストアンサー
- 回答日時:
補足。
『致命的な困りごと』というわけではありませんが、No.2 に HTML5 は『ブラウザ内でいろんな作業ができることを目標』にしている、と書きました。それゆえ、構文ミスのある「壊れた HTML」でも、HTML5 ブラウザなら共通のエラー訂正をしてくれます。
構文ミスに寛容な代わり、「意味」の間違いには異様に厳しくなっています。例えば、HTML5 においてテーブルレイアウトは認められません。それは表をレイアウトに転用する「意味」の間違いだからです。また、HTML5 ブラウザは見出し要素 h1、h2、……を拾って自動的にアウトライン(目次)を生成しますので、h1、h2 を「文字の大きさを変えるもの」と間違って覚えていた人は、痛い目を見るかもしれません。
これは、構文ミスに厳しい代わり「意味」には比較的寛容であった XHTML とは対照的です。そして「意味」の間違いは、機械的にはなかなか判別できない上に、検索結果などにモロに反映される可能性があります。
今後 HTML5 ブラウザが普及すると、例え HTML 4.0 で書いたページでも HTML5 の「意味」論で解釈されることになるでしょう。ですから、HTML5 の要素リストを眺めて「意味」を確認しておくのは悪いことではないと思います。
例えば、HTML5 において i 要素は「斜体」ではありません。書籍で斜体で書かれるような「学名」あるいは「特別なニュアンスで使っている語句」を表します。さて、ページ全体が「学名」になっている人はいませんか?
※img 要素の alt 属性の使い方も細かく記述されていますが、これまで画像が表示されない場合のことをちゃんと考慮してきた人にとっては、ごく普通のことしか書かれていません。
※セクション構造に関しては、マトモな説明および例をほとんど見たことがないので、現段階では使わなくて結構です。その代わり、見出しを適切に使って下さい。
---
CSS3 に関して、今後重要なのはメディアクエリです(これを CSS3 に含めるかはアレですが一応)。No.2 に『色を必要としない機器』云々と書きましたが、それを判別するにはメディアクエリを用いて @media not (color) { ... } とします。このスタイル規則は、色を出力しないメディアでのみ適用されます。
次の外部 CSS は 800px 以上のウィンドウサイズを持つスクリーン系メディアにのみ適用されます。
<link rel="stylesheet" media="screen and (min-width: 800px)" href="big.css" />
次の外部 CSS は、iPhone などの向きを変えたとき自動的に切り替わります。
<link rel="stylesheet" media="(orientation: portrait)" href="tatemuki.css" />
<link rel="stylesheet" media="(orientation: landscape)" href="yokomuki.css" />
---
そういうわけで、HTML5 の要素の意味を確認することと、メディアクエリを覚えること、個人的にこの 2 つは強くお勧めします。
No.4
- 回答日時:
簡単にいえば、
要素と機能の追加です。
HTMLはただの文字列に意味を持たせる物。
CSSは見た目を良くするもの。(デザインするもの。)
今までのHTMLとCSSは完全に、こういうふうに分離することが出来ませんでしたが、
HTMLの要素の調節や、CSSの機能アップによって、
HTMLでデザインを気にせず作り、
CSSのみでデザインをすることが、
出来るものに近づいてます。
本来の、HTML、CSSの使い方として使えるように、
進化してきてるということです。
例えば、背景画像を複数使いたい場合に、
今まではdivなどを幾つも使わなければいけなかったのが、
CSS3で1つの要素に複数の背景が設定できるようになり、
HTML5では、無駄なdivの階層を無くすことが出来ます。
ソースもすっきりして、
視覚ブラウザ以外の音声ブラウザなどで、内容を認識しやすくなったり、
googleロボットなども読みやすくなり、SEOにも、少しはプラスになってると思います。
まだまだ不十分なので、
まだバージョンが上がる可能性が有ります。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- その他(プログラミング・Web制作) 次に、楽天のアジャイル就活に参加して、1日で内定を獲得できる。私は大企業に就職できる? 2 2022/04/17 13:38
- Instagram HTML5の廃止とJavaScript 2 2022/04/13 21:05
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- その他(IT・Webサービス) Chromeとかにしか対応していないウェブサイトに抗議したい いま令和5年だぞ 今使えるブラウザとい 5 2023/05/24 11:32
- HTML・CSS 私の能力からして間違っていないような気がします。 4 2022/09/30 13:24
- 発達障害・ダウン症・自閉症 彼氏が発達障害。気にかけてあげれるべき所を教えて下さい。 彼氏がADHD、ASD。また発達障害とは別 2 2022/06/05 14:55
- 物理学 物理工学系学科-調査課題 2 2022/04/26 18:57
- その他(メンタルヘルス) 『発達障害』と『愛着障害』の違いについて 1 2022/09/13 08:44
- インターネットビジネス ペット用品のネットショップ運営で悩んでいる事があります。 詳しい方いらっしゃいましたらご教授の程宜し 2 2022/07/11 12:03
- 神経の病気 原因不明の息苦しさ 2 2022/04/16 12:14
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
マージソートの計算量について-...
-
角丸画像の背景色を透明にした...
-
2個のFormを横並びにしたい
-
<div align="center">を使わず...
-
タグは大文字と小文字どちらが...
-
【ヒトの神秘】美男美女から何...
-
cssのfloatについて
-
H1タグを画像にしたい
-
エロマンガ先生とはどんな話で...
-
KompoZerの使い方について
-
smallにtext-allignが効かない
-
指定位置に来たら要素をボーダ...
-
改行ほどは行かないけど、若干...
-
親要素・子要素
-
border: noneでボタンの境界線...
-
abbr要素はコンピュータ用語以...
-
テキストボックスの中にリンク...
-
XHTML+CSS 罫線を入れたい場合
-
htmlの文字が縦書きになる
-
ワードにコピペ、画像が表示さ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
2個のFormを横並びにしたい
-
含む含まないという概念自体の...
-
角丸画像の背景色を透明にした...
-
smallにtext-allignが効かない
-
超音波で洗脳。
-
質問1.
-
「諸要素」とはどういう意味で...
-
改行ほどは行かないけど、若干...
-
マージソートの計算量について-...
-
1から100までの自然数のうち、2...
-
タグは大文字と小文字どちらが...
-
textareaの幅を画面と合わせたい
-
親要素・子要素
-
テキストボックスの中にリンク...
-
html タグの閉じスラッシュ前の...
-
input type="hidden"で取得した...
-
NからZへの全単射を具体的に構...
-
HTMLページ上でiframeを最前面...
-
【CSS】imgタグを、親要素の幅...
おすすめ情報