【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

フラットデザイン&レスポンシブ対応の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サイト」とは?

CTA-IMAGE 2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。
また、検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。 そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。

・レスポンシブECサイトがなぜ今選ばれるのか
・これまでのECサイトの課題とは何なのか
・どのようにすれば解決できるのか

といったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。
ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。
機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+