Bootstrapを使ってWEBサイトを作ってみようぜ 第4回 「制作事例をみてイメージを膨らまそう」

WS002756
このエントリーをはてなブックマークに追加
PR

 

第4回の Bootstrapを使ってWEBサイトを作ってみようぜ です

第4回はナビゲーションの作成をしようかと考えていたのですが、そのまえに Bootstrapでどんなサイトになるのかイメージを膨らませようということでBootstrapを使って作られたサイトを見てみます

 

第4回 「制作事例をみてイメージを膨らまそう」

Bootstrapを使った制作事例をみて、こういったサイトを作るという目標が作れた方が、作る過程とかがイメージしやすくていいのではないかと思います。

 

 

Codiqa
最近はやりのデザイン

codiqa_com

 

 

August Smark Lock
ナビゲーションをヘッダーの下に置いたデザイン

august_com

 

 

Riot Design
画面一面を一つのブロックにしたデザイン

riotdesign_eu_en

 

 

Method
画面上部を大きなスライダーにしたデザイン

method_com

 

 

20jeans

www_20jeans_com

 

 

Unroll.Me
これも最近はやりのデザイン、大きなイメージとその上にテキストとボタン

unroll_me

 

 

Robinhood
こちらは背景を動画にしてあるもの、ファーストビューですぐに完了するようなデザイン

www_robinhood_com

 

 

Differential
オーソドックスなBootstrapを使ったデザイン

differential_io

 

 

Playboard
グリッド感が分かるデザイン

 

playboard_me

 

 

Newsweek
2カラムベースのメディア系

www_newsweek_com

 

 

 

Themeclue
こちらも2カラムベースのデザイン

www_themeclue_com

 

 

 

 

ほとんどがファーストビューに大きなイメージを持ってきています、これが現在のはやりのデザインと言えるでしょう、企業、プロダクト、サービスはこういう風なデザインのWEBサイトで展開されることが多いですね

この中から作成したいWEBサイトのイメージに合うものがあったでしょうか?

他にもBootstrapを使って作られたサイトの例が載っているので、見つからんかったって人はこちらで探してみてください
http://expo.getbootstrap.com/page2/

 

次回はBootstrapでWEBサイトの作成に入ります

PR

COMMENT

コメントを残す

PR

9ineBBの管理人が運営するサイト

WDG WEB DESIGN GALLERY ウェブデザインギャラリー CC0 PHOTO 無料で使える高画質な写真をダウンロード、クレジット表記、リンク不要

9ineBBの最新情報をチェック・購読

Twitter Facebook Google+ Feedly RSS

どこをクリックしてもこの表示を消せます
(3日後以降に再度表示されます)