ノウハウをいつでも。ウェブマーケティングのポータルサイト

サイト紹介

Bootstrapで作られたとは思えない高品質なWEBサイトまとめ

このエントリーをはてなブックマークに追加
      
follow us in feedly
友だち追加数
レスポンシブデザインは今や当たり前となってきましたが、制作には色々手間がかかります。少しでも時間を節約するために、フレームワークを使っている方は多いと思いますが、中でも「Bootstrap」はとても有名で気に入っている人が多いです。

「でも『Bootstrap』使うと似たようなデザインになっちゃうんじゃないの?」と思っている方もいるかもしれませんが、全然そんなことないんです!

今回はBootstrapで作られたとは思えないほど高品質なサイトをご紹介します。







海外



Imagina nas Ferias

imagina.jpg

http://www.imaginanasferias.com.br/

形の違うブロックをタイル状にキレイに並べたデザイン。フラットなデザインで最近よく見ますが、Bootstrapで作られているとは思えません。 どうやって作ったのか制作者に聞きたい!



Drury Buildings

Drury.jpg

http://drurybuildings.com/

こちらはレストランのサイトで、質の高い写真を大きくうまく見せています。ナビゲーションの出し方が独特で印象に残りました。



CRI

CRI.jpg

http://www.cri-sf.com/

全面背景画像がフェイドしてキレイに切り替わります。写真をダイナミックに見せていてインパクトがあります。下層ページのタイムラインもカッコいいです。



Streamline

Streamline.jpg

http://www.streamlineicons.com/

ページを開いた時のアニメーションがとてもカッコいいです。キービジュアル部分の見せ方が個人的にはとても好きですね〜。色使いがシンプルでスッキリした印象です。



DSTLD Jeans

DSTLD.jpg

https://www.dstldjeans.com/

ファッション系のサイトです。大きく見せたモノクロ写真がとてもクールな印象を与えています。全体のトーン(写真、フォント、余白etc)が見事にモノクロにマッチしています。



Paul van Oijen

Paul.jpg

http://paulvanoijen.com/

左のトグルをクリックした時のナビゲーションが全面で大きくでてきてインパクトがあります。余白たっぷりでシンプルなデザインですが、アニメーションを効果的に使用しており印象に残ります。



国内



J-POWER 「エコ×エネ体験プロジェクト」

J-POWER.jpg

http://www.jpower.co.jp/ecoene/

J-POWERグループが手がける、ひととエネルギーと環境をつなぐ体験型プロジェクトのサイト。こうした大企業のサイトにもBootstrapが使われているんですね〜。一見するとBootstrapだとは全く思えません。



パペティエール

papeterie.jpg

http://papeterie-kamiya.com/

紙を仕立てるサービスのサイト。左サイドにナビゲーションを置くパターンもBootstrapでできるんですね。イラストや紙のテクスチャをうまく使った温かみのあるデザインが好きです。



Re:beaute

rebute.jpg

http://amaze-plus.com/rebeaute/

化粧品ブランドのサイト。白と黒のコントラストいいですね〜。こちらはWordPressによるコンテンツ管理が行われています。



BizPortal -- ビジネス英会話

BizPortal.jpg

http://bizportal.tokyo.jp/

オンライン英会話教室のサイト。シンプルで見やすく、アニメーションをうまく使っています。こちらもWordPressによるコンテンツ管理が行われています。



地元びいき

local.jpg

http://jimoto-b.com/

地元に根ざした活動・ひと・産業・事業などの情報を提供するポータルサイト。Bootstrapだとは全く思えません。3カラム気味ですが、3カラムだとゴチャゴチャした感じになりやすいですが、このサイトはとても見やすいですね。








さいごに

いかがでしょうか?どれもBootstrapで作られたとは思えないサイトばかりです。こうした高品質なサイトをBootstrapによって短時間で作れたら、かなりありがたいですね!

© MAKEPO

 
このエントリーをはてなブックマークに追加
   
follow us in feedly
友だち追加数

著者情報

ノビタ

のび太

Web制作会社「NOBITA」の社長をやっております、のび太と申します。大学卒業後、お金を貯めカナダに留学。バンクーバーのビジネス学校で好きな人に出会ってしまったため、日本に帰らず現地企業に就職。未経験ながらWeb制作、メディア運営、ライター業などの仕事に奮闘する。帰国後、フリーランスのWebデザイナーとして独立し、2014年5月、自身の会社を設立。「伸びていくWebサイトをお届けする!」がモットー。 ブログ:がんばれ!のび太!

他の参加者を見る

のび太

関連記事

マーケティングノウハウ足りてますか?

MAKEPOのメルマガ…購読してみませんか?
直近のピックアップ記事のほか、セミナー・ツール活用情報など不定期でお伝えしています。「サイトにアクセスするのは面倒だ!」「電車の中でざっくり読みたい」という方は是非ご登録ください。 リアルタイムで情報取得をしたい方は、RSSまたは公式Twitterをフォローしてご覧ください!

通勤中の情報収集に!

メルマガ登録

いますぐ新着情報を知るなら

LINE@で友だちに追加!