明日を生きるマークアップエンジニアのためのHTML5フレームワーク色々

WEB制作

HTML5で書かれたサイトも多くなってきましたねー。僕はまだまだ勉強段階ですが、やっぱりHTML5のフレームワークなんかもたくさん出るんだろうなぁと思ってたら、まさに僕の理想を見つけたので、おすすめのフレームワーク含めていくつかご紹介(DLフォルダの中身も軽く紹介)。中にはフレームワークとしてではなく、勉強教材としても使えそうな物もあって楽しいですよ。

 

G5 Framework

個人サイトなんかから使えそうな使いやすいフレームワーク。DLしてフォルダ開くと下のようなフォルダ構造。うーん。シンプルだし、分かりやすい。なかなか好印象っす。しかし、なぜindexがphpなんですか?

あ、でもCSS3 Pie(IE6-8対応のCSS3デコレーションキット的な奴)を使ってるんですね。デフォで使ってあるのはうれしーっす先輩。

 

 

52 framework

こいつもクロスブラウザ対応をうたってるHTML5とCSS3のフレームワーク。DLしてフォルダを開くと用途別にHTMLが分かれています。CSS3用の説明HTML、グリッド用のHTML、好印象なのがスマフォ用のテンプレートが用意されていること。いいですねこれ。フレームワークとしても使うのも、勉強と思って除くのもアリだと思います。

 

 

HTML5 framework

王道っすね。僕の周りでも使ってる人は多いですが、格納されているindex.htmlに一通りのHTML5の機能は網羅されている気がします。無駄がない分、低機能な気もしますが、HTMLのフレームワークなんて、その位でいんじゃないですかね?

 

 

Gridless

「変な機能とかいらねーんだよ!真っ白いのは無いのか!やっぱり白だろ!」という僕と同じ趣味の持ち主はこちらがおすすめ。今回紹介するフレームワークの中では一番シンプルかと。demo.htmlにHTML5記述についての説明書き的な物はありますが、肝心のindex.htmlの中身は超清潔な真っ白。枠組みだけ用意されている感じですね。何を入れるにも自分次第というフレームワークです。

あ、でもちゃんとCSSのリセットやらクロスブラウザ対応はされていますからご安心を。

やっぱり真っ白が好きですね。こう純白な感じがグッときます。別にやましい意味なんかありませんよ?

 

 

baker EBOOK FRAMEWORK

次はちょっと変わったフレームワーク。Ebookを作るためのHTML5ベースのフレームワークですね。最近EBookを作りたいって人も多いので、もし参考になれればと思って載せておきます。

 

 

2011/07/06 NEW!!

Best HTML5 And CSS3 Frameworksを見てしったフレームワークをもう一個!

Less Framework 4

Default、タブレット用、モバイル用、Wideモバイル用の4つにCSSが別れている!面倒な設定やDLの必要が無いからテンプレートとして使うならかなり好印象!今度使ってみる!つか、このサイトのタブレット&モバイル用はこいつでつくってみるか。面白そうだし。

 

 

2011/07/08 NEW!!

HTML5 Reset v2

忘れてた!フレームワークというにはちょっと違うのかもしれませんが、このサイトもそうですが、このHTML5 Resetを使っています。

構造がシンプルな上に、分かり易いので僕は好きですよー!ご紹介までに。

 
 

いかがでしたか?理想のフレームワークはみつかりましたか?今からHTML5を勉強する人にとっても、今までHTML5を書いてきたけど効率化を図りたい人にもおすすめできるフレームワークが盛りだくさんですね。

僕としてはやはり真っ白い奴をお勧めしたいと思いますが、どうでしょう?

Pagetop