タグ
HTML5

ほとんどCSSは変えずにxhtmlとHTML5で同じレイアウトの作成と作りながら悩んだことまとめました【サンプルソース付】

xhtmlとHTML5で簡単なページレイアウトを作成し、コーディングのタグ違い、新要素(タグ)の説明、アウトラインの説明してきましたが、今回が最終でCSSでレイアウトまでを作成させました。

HTML5では要素やCSSの設定の仕方でいろいろな考えがありますので今回のソースも一つの例と思っていただければとおもいます。

HTML5のアウトラインって何?xhtmlとHTML5のコードを比較してアウトラインを理解しよう!

前回までの2回のエントリーでxhtmlとHTML5のコードを比較して新要素タグの説明をしてきました。これでコード自体はできましたが、HTML5では『アウトライン』の概念を理解する必要があります。

そこでxhtmlとHTML5の両方のサンプルソースからアウトラインを確認していきます。アウトラインはHTML5でコーディングする場合にとても重要な部分になりますが、構造的な話になるのでわかりにくく感じしてしまうと思いますので、アウトラインを視覚化してわかりやすくできる『HTML 5 Outliner』を利用してxhtmlとHTML5の違いを比較しながら理解を深めていきたいと思います。

HTML5は難しくない? HTML5から追加された新要素を理解しよう!【初級編:HTML5のマークアップ】

今回はxhtmlとHTML5のコードの違いを見ながら、HTML5から新しく追加されたタグがいくつかありますので、どのような違いがあるかをまとめました。

ページ内では簡単に今回の部分の説明をして、過去に各要素をまとめたエントリーへのリンクをつけておりますので気になる要素がありましたら是非ご覧ください。

HTML5は難しくない? XHTML1.0とHTML5のコーディングの違いを確認してみよう!【初級編:HTML5のマークアップ】

先日のエントリーでもHTML5で作成されたサイトが増えてきていることから、そろそろHTML5の勉強をそろそろしなければと思っている人も多いと思います。

グーグルの特設サイトなどがトリッキーなことをやっているのでHTML5=難しいと思っている人もいると思いますが、あのような動的なサイトやAPI関連をいきなりやるのはなかなか大変ですし難しいです。それよりほとんどの人ですぐ必要になるのが通常のページをどうマークアップするかだとおもいます。HTML5でのマークアップでしたらXHTMLとHTML5はそんなに違いはありません。このブログもHTML5で作成していますがXHTML→HTML5の移行は数個の新規タグと考え方がわかればすぐに移行できるとおもいます。

そこで、これまで当ブログでまとめてきたHTML5の基本の記事からXHTMLからHTML5への移行の際のタグの違いをまとめて簡単な構成を作成してみました。

HTML5で制作された国内企業サイト20から現状の制作状況を知る!!

最近、HTML5のコーディング案件に関わることがあったのですが、その時にHTML5でコーディングされている企業サイトを調べましたので今回ご紹介したいと思います。

尚、サイトを調べていて気づいたのですが、現状(2011年8月)では宣言をHTML5にして内容自体は今まで通りdiv要素を使ってマークアップしているサイトが多いように感じました。新要素を多用して後から間違えが出てくるという可能性を考慮すると、とても理にかなっていると1人で感心してしまいました。今後この流れは変わると思いますが現状(2011年8月)では大切な考え方の1つだと思っています。・・・