ECサイト構築・リニューアルならクラウド型ECサイト構築ASPサービスサイトへ
資料請求
TOP

CATEGORY

SERVICE

フラットデザイン&レスポンシブ対応のCSSフレームワーク『Pure』

フラットデザイン&レスポンシブ対応のCSSフレームワーク『Pure』

Pureの画像

今年秋にリリースされるAppleの新しいOS、「iOS7」でも採用され、最近話題の「フラットデザイン」

必要最小限のシンプルな装飾で、製品のメッセージやアイデアをダイレクトに伝えることができるデザインです。

もともとスマートフォンなどの小さな画面でも、ユーザーを迷わせる事のないように不要なものをなくし、シンプルなデザインを元に生まれたものなのですが、Windows8でも採用されている「Modern UI」、Googleなどの大手IT企業が次々に採用しています。

今回ご紹介するのは米Yahoo!が提供しているレスポンシブWebデザイン対応のCSSフレームワーク、『Pure』

Pureは軽量で機能はあまり多くありませんが、ガチガチなテンプレートではなく、必要な箇所を選んで自分なりに自由にカスタマイズすることができるのが特徴です。

フォーム

フォームのフレームワークの画像

シンプルなフォームから、複雑な問合せフォームなどまで様々なテンプレートが用意されています。

フラットデザインなボタン

フラットデザインなボタンの画像

こちらはボタン類。単色系のボタンから、フラットな色合いのボタン、アイコン付きのボタンなどがあります。

表(テーブル)

表組みの画像

テーブルは通常の枠組みが用意されていました。

グローバルメニュー類

グローバルメニューの画像

横並び(Horizontal)、縦並び(Vertical)、ドロップダウンなどのメニューがあります。どのデザインも至ってシンプルでカスタマイズもしやすい構造になっています。

レウアウト

レイアウトの画像

サンプルのレイアウトも用意されており、もちろんレスポンシブWebデザインにも対応しています。「メール風」「ブログ風」などの比較的構築が難しいものもこれらを元に簡単に作ることができそうです。

Pure

終わりに

大手が採用し始めたことにより世界的な潮流はフラットデザインへと傾いてきていますが、そのフラットデザインと対をなすskeuomorphism(実写的なデザイン)との間ではまだまだ議論がされています。

ECサイトの場合、サイト全体がシンプルすぎると購入の決め手にもなる「情報量」が少なくなり、購入率などにも大きく影響を与える可能性があります。

上手くバランスを取りながら、ユーザーが安心して選びやすく買いやすいサイト作りを心がけましょう。

参考:フラットデザインの参考にしたいツール3種と事例5つ

上林

                   
商品の販売に“夢中”になれる
クラウド型ECサイト構築ASP

ECサイト構築、リニューアルを2000社以上支援してきた知見から
ECの専門家として御社のEC事業成長をサポートします。

  • 導入実績2000社以上


    導入実績

  • 注文単価増加率114%

    導入1年後の
    注文単価
    増加率

  • 売上成長率128%

    導入1年後の
    売上成長率

  • EC支援歴20年


    EC支援歴

         

レスポンシブWebデザインカテゴリの最新記事