誰でも簡単にレスポンシブWEBデザインできる「Twitter Bootstrap」のまとめ
【スポンサーリンク】
WEBデザインがあまり得意ではない人にとって、
キレイにクールなサイトを構築することは難しい。
なおかつ、PC・タブレット端末・スマートフォンなど
環境に応じて見せれるデザインを構築しようと考えたら、
一気にやる気がなくなってしまう。
ところが、「Twitter Bootstrap」というCSSフレームワークを
利用すると、簡単に誰でも1つのソースで環境に応じて
見せ方を自動的に変えてくれるデザインを作れる。
しかも、キレイにクールなサイトをである。
というわけで、これは使わないでおくにはもったいない。
1.はじめに
まずは、わからない言葉の意味を知りましょう。
2.Twitter Bootstrapの導入
それでは、「Twitter Bootstrap」を導入していきましょう。
大丈夫です。簡単です。
ダウンロードして、フォルダをコピーするだけです。
導入が簡単なことは、とても重要なことです。
Bs3 Document | Greenapple-room
3.Twitter Bootstrapの使い方をざっと認識
環境の準備ができましたので、ざっと「Twitter Bootstrap」を使うと
どんなことができるのかを認識しましょう。
細かいことは気にせず、ざっと全体を知りましょう。
http://dotinstall.com/lessons/basic_twitter_bootstrap_v3
4.Twitter Bootstrapの細かい使い方を知りましょう
全体のことがだいたいわかったら、次は細かい使い方を知りましょう。
どんなことができて、どんな風にコーディングすれば実現するかを知りましょう。
Bs3 Document | Greenapple-room
5.Twitter BootstrapをCakePHPで利用する
サイト構築時に1からコーディングすることはあまりないと思います。
人気のPHPフレームワーク(CakePHP)に導入する方法を理解しましょう。
CakePHPのデザインをTwitter Bootstrapに変更する作業のメモ – asklife
TwitterBootstrapプラグインを利用しましょう。
http://wp.endo.jp.net/?p=158
6.Twitter Bootstrapを応用利用する
最後に、Twitter Bootstrapを拡張したり、
他のCSSフレームワークを利用して見たくなると思います。