Bootstrapを勉強しました

Web学習

Web技術について学習し、『Webクリエイター能力認定試験』『Webデザイン技能検定』を受験し合格しました。HTMLとCSSなら標準的なことなら理解できるレベルです。CSS3はちょっと怪しいですがw

せっかく学習したのでホームページを作ろうとFC2ホームページに登録したものの、たいしたサイトはまだ作れていないですorz

登録しているFC2ホームページはこちら
くまらじゅじゅ

そして、しばらく時間をおいてしまったので、知識が徐々に減ってきています。つまり忘れたw

これでは勿体ないので、もうちょっと頑張ってステップアップを図ろうと、『Bootstrap』を勉強してみました。

Bootstrap

BootstrapはCSSフレームワークと呼ばれるものです。ホームページをCSSで簡単に装飾することが出来ます。

Bootstrap公式
⇒http://getbootstrap.com/

Webでプログラミングが学習できる『ドットインストール』というサイトがあります。そこにBootstrapの講座があったので、受講してみました。

ドットインストール
Bootstrap 3.0入門 (全18回)
⇒http://dotinstall.com/lessons/basic_twitter_bootstrap_v4

その受講中に内容をまとめてサンプルを作成しました。

『Bootstrap 3.0入門』の受講ノートのようなもの
Bootstrapサンプル

「Glyphicons」というBootstrapで利用できるアイコンは、フォントパッケージを使うのですが、FC2ブログではアップロードできないファイルだったので上記サンプルでは表現できていません。

FC2ホームページならフォントパッケージもアップロードできるので、ホームページ作成の際はGlyphiconsを利用できます。

今回Bootstrapを勉強したら、その簡単・便利さに感心してしまいました。JavaScript/jQueryでコードが書けなくても、CSSのみでいろんなことが実現できます。

JavaScript/jQuery もいずれ勉強するとして、Bootstrapでホームページを作成してみようかなという気になりました。忘れない内にFC2ホームページの方に作成したものをUPしようと思ってます。

関連記事
この記事が参考になりましたら拍手をお願いします。管理人のモチベーションが上がります。m(_ _)m

コメント

No title
Bootstrapという名称は知らなかったけど、CSSフレームワークの事は何となく知ってました。便利そうですね~。
ただ、私の性格だと使いこなせなさそうです。常にシンプル・軽量化を目指してしまうので(笑)
ブログdeロードショー用のページを作ろうか考える事もありますが、デザインの時点で面倒になってしまうという…。
デカイーさんのように、モチベーションをコントロールできるようにならなきゃ!
宵乃 さんへ
このブログテンプレートもCSSフレームワークを利用していたと、改めて知りました。クラス指定で簡単にピクトグラムや色の付いたパネルを作成できるようになってます。

CSSフレームワークは簡単に装飾できるますが、便利な反面没個性的にもなってしまうようです。Bootstrapを使っているサイトは見た目ですぐに使っていることが分かるサイトが多いです。

ホームページだとレスポンシブデザインのことを念頭にカラムデザインを考えなくてはならないのですが、Bootstrapだと簡単にできたので驚きました。それだけでも利用価値があると思います。ボタンとかアイコンは人によっては使う必要性も低いでしょう。

簡単なので早速ホームページを作り替えてみました。実験がてらいろんな機能を試してみようと思ってます。

Webの知識でフレームを作ることも重要ですが、コンテンツも作らないと意味ないですね。むしろコンテンツのアイデアが欲しいですw いやアイデアを実現する行動力かなw
No title
お久しぶりです。

私、ブートストラップと聞いてこの記事に飛びついたんですけど、全然違うもの想像していました。なぜこの名前が付いているのか逆に興味ありますね。
random walk さんへ
お久しぶりです

どんなものを想像していたのか分かりませんが、何かしらの技術用語なんでしょうかねぇ
私は技術系にも英語にも疎いのでよく分からない単語ですw

コメントの投稿

非公開コメント


ページ下部までご覧いただきありがとうございました。