
カートに入れるボタン、買い物かごボタンしっかり作りこみしていますか?Amazonログイン&ペイメントが始まりますます注目されるカートボタン。色合いやデザインはどう決めるべきなのでしょうか。
ブランディングを重視したボタンデザイン
トップ写真はMUJIオンラインストアのカートボタンですが、無印良品のブランディングが強烈に印象づけられますね。ホバー時のカートボタンの色も無印のブランドカラーが生かされています。
しかし、この例は「ブランディング」が完成されている場合にのみ効果を発揮します。まだブランド知名度が低いストアの場合は手痛い失敗になる可能性が大きいです。
ショッピングモールごとに考えてみる
モール型ECサイトでいえば、Yahoo!ショッピングはYahoo!自体がブランド化しようとしている傾向がありデフォルトのカートボタンのデザインがオレンジに変わっています。
オレンジカラーというのはAmazonも意識しているカラーで、Amazon曰く「オレンジ・ゴールド系はカート獲得率が飛躍的に上がる」とのことです。Amazonログイン&ペイメントでもゴールドカラーを推しているのがAmazonが調べた根拠の結果なのでしょう。
楽天の場合
楽天のデフォルトカートボタンは最悪と言い切ってしまいましょう。まだデフォルトのボタンを使っている場合はCSSで書き換えてみましょう。
input[value="買い物かごに入れる"]{
background:url("画像URL");
width:265px;
height:55px;
text-indent:-9999px;
border:none;
cursor:pointer;
margin-top:8px;
}
input[value="買い物かごに入れる"]:hover{
opacity:0.8;
}
このようにCSSに記述しましょう。inputボタンだけを置き換えてしまうとすべてが変わってしまうのでinput[value="買い物かごに入れる"] でカートボタンだけを変更します。
カートボタンは楽天Goldやキャビネットに保存しておけばよいでしょう。
画像込みでカートボタンの説明は当社ブログで御覧ください。
http://www.jiriki.co.jp/blog/ec/ec-button-cart
EDITOR PROFILE
LLC JIRIKI inc.
淵上 喜弘
LLC JIRIKI inc.
LLC JIRIKI inc.でできること
-
WEBサイト制作
-
サイトコンサルティング・SEO・AIO対策

