pagetaka

写真、PC、ネット、岡山、旅の話題をお届けします

HTML5:DreamWeaverCS3でタグの変更を実感しながら作業…

HTML5をつかって、サイトのページ作成にとりくんでみました。TAKAがたまに使うDreamWeaverCS3でテキスト打ちの画面を使いながら、ボチボチやってみました。

メニューがヘッダーの下に並ぶデザインの場合、

<!DOCTYPE html>
<html>
<head>
(略)
</head>
<body>
<header>
(ここにサイトタイトル/画像、説明書きなど)
</header>
<nav>
(メニュー用:ここにサイト内ページ/カテゴリ遷移用リンク)
</nav>
<article>
(ここに記事見出しと本文、またはsection、figureなどを設け構成)
</article>
<footer>
(サイトのクレジットなど)
</footer>
</body>
</html>

などという使い方が考えられます。
で、気になったのは、navを左サイドバーにでも配置して…と考えたとき、扱いやすくするには、divタグを使い、navとarticleを囲む、ということが考えられるのですが、こういうdivの使い方は、はたしてHTML5ではどのように評価されるのだろうかと…。その結果、navやarticleの意味が低下してはせっかくHTML5をつかってもあまり意味の無いことになるのかもしれませんし…はて?
複数のブロック要素を画面中央で左右にならべて配置するのには、CSS3でも特に用意された様子がありませんし…はて? 知らないだけか…。それとも、いっそのこと左サイドバーにnavを配置する、というのをあきらめろと…う~ん。

HTML5とCSS3、同時並行で当分勉強せねばならないみたいです…。ウェ~ン(泣)
使っているDreamWeaverCS3、当然と言えばその通りですが、HTML5のタグがすべて予測候補として入力画面上に表示されるということにはなりません。シクシク…。
[6/18追記]左右並びのメニューと本文のレイアウトCSS3のベンダープレフィックス仕様ですが、flexboxを操作すると、ある程度解決できそうです。