TOP  >  WebDesign  >  ソース付き!HTML5を学ぶためのチュートリアル10選「10 Cool and Useful HTML 5 Tutorials」
2010年12月01日

ソース付き!HTML5を学ぶためのチュートリアル10選「10 Cool and Useful HTML 5 Tutorials」

開発者の間では次世代の規格として注目を集めているHTML5。まだまだブラウザも対応していない部分もあり商業デザインではなかなか使いづらいところもありますが、従来のHTMLと比べてかなり表現できる幅が広く、確実に今後WEBデザインの世界では必要となってくるものだと思います。今日紹介するのはそんなHTML5を学ぶためのチュートリアル10選「10 Cool and Useful HTML 5 Tutorials」です。


Design & Code a Cool iPhone App Website in HTML5

レイアウト的なものからJSと組合わえたものまで様々なHTML5のテクニックが学べるチュートリアルがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

Code a Backwards Compatible, One Page Portfolio with HTML5 and CSS3 – Inspect Element
角丸やシャドウ、透過、フォントタイプなど、新しい表現が詰めこまれたポートフォリオサイトをHTML5で。


 
 
 
 
 
Implementing HTML5 Drag and Drop: New Premium Tutorial | Nettuts+
ドロップ&ドラッグでカートに入れるというインターフェイスをHTML5で実現。

Implementing-HTML5-Drag-and-Drop
 
 
 
 
 
An HTML5 Slideshow w/ Canvas & jQuery | Tutorialzine
JQueryとHTML5を組み合わせたスライドショー。派手な演出などはありませんが、概念的な事を知るには良いチュートリアル。

An-HTML5-Slideshow-w-Canvas-jQuery

すべてのチュートリアルにソースコードが開示されていますので、自分自身で制作しながら覚えていくことができるので、より実践に近い形で学べると思います。HTML5をそろそろと考えている方は是非どうぞ。

10 Cool and Useful HTML 5 Tutorials | UnderWorld Magazines

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればこちらからご連絡ください。即刻削除いたします。
posted 11:39  |  
Category: WebDesign   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る