最新のデザインが取り扱えるHTML5やSCSSなどが今人気になっています。そうしたHTML5の基本概念や組み方などについて、このページでは紹介していきます。またこれまでのHTMLとは何が違うのかについても紹介します。
HTML5(エイチティーエムエル・ファイブ)は、 HTML の 5 回目に当たる大幅な改定版で、WHATWGによって2004年に定められた Web Applications 1.0 に Web Forms 2.0 を取り入れたものがW3Cの専門委員会に採用され、W3C より2008年1月22日にドラフト(草案)が発表され、2014年10月28日に勧告されたものになっています。また2016年にはHTML 5.1が勧告される予定となっているそうです。
改訂の主要目的のひとつとしては人間にも読解がしやすく、コンピューターディバイスにも矛盾せず読解され、さらに最新のマルチメディアをサポートできる言語に向上することにありました。このHTML5ではHTMLだけでなくXHTML、Document Object Model のHTML 関係の部分、ECMAScriptのAPIも追加になっています。
一時期、このWHATWGとW3Cの確執が取り沙汰され、HTML5がフォークしたと騒ぐ人もいましたが、実際にはプロジェクトやツリー全体がフォークするのではなく、安定バージョンのブランチを切ってブランチ専用のメンテ担当者を割り当てましょうという話が進んでいて、バグ管理もトランクとブランチで分けるようになったとのことでした。
HTML4との違いが理解できないという人もいるかもしれませんが、これに関しては、これまでは別の手法を用いるしか無かったり、とても手間がかかったことがHTML5であれば簡単に出来てしまうという点があげられるかと思います。特に今までは複雑に書かれていた複雑な処理にかんしても楽に簡潔に出来、HTMLをより枠組み的にスッキリ書けるようになっているのです。
位置を取得したい
LocalStorageをJavascrptで用いる
input要素の属性、「typeの値」を書き換えるだけ
input要素の属性に「require」を加えるだけ
input要素の属性に「placeholder」を加えるだけ
よく使用する要素の属性の見直しとdoctype,metaの一部,link.style,script等の記述が簡素化される
よく使用する要素の属性の見直しとhr,small,strong,i,b要素等の扱いが見直されている
section,article,aside,nav,hgroup,header,footer等を用いてアウトラインが整えられる
SCSSとはWebページのレイアウトや修飾情報の指定に用いられるCSS(Cascading Style Sheet)を記述するための言語(メタ言語)の一つで、また同言語で記述したファイルをCSSファイルへ変換するソフトウェアのことを言います。
これはプログラミング言語の仕様を取り入れて効率的にCSSを定義できるようにした言語で、変数や算術演算、セレクタ指定の入れ子(ネスト)、外部ファイルの読み込み、複数のCSS定義の結合(ミックスイン)等、CSSにはない機能を利用することができます。
特に変数に関しては非常に魅力的な要素の一つで、これまでになかった形のデザインを簡単に実現することが可能になってきます。 これまでのオリジナルのSass言語はCSSとは異なる文法・記法で定義されていましたが、Sassのバージョン3.0からは、CSSの文法・記法を拡張して上記の機能を取り入れたSCSS(Sassy CSS)言語が採用されおり、CSSをある程度かじっている人であればすぐにでも使いこなすことが可能になってきました。