どうも、@conchikuwaです。
僕自身もそうですが、ネットショッピングをPCではなくスマホやタブレットですることが増えてきました。タブレットの場合、PCと同じようなデザインでも表示領域が広いのでそんなに問題ありませんが、スマホの場合は表示領域が狭いのでそのままだと文字も読みにくく、ボタンも押しづらいのでできるならスマホ用のデザインにした方がユーザビリティ的にオススメです。
僕が運営しているプリザーブドフラワー専門花屋「ハナリロ」のスマホサイトは、一度ゴニョゴニョと弄ってからはそのまま放置していたのですが、この度一念発起していろいろとリニューアルを行いました。
今回行ったリニューアルの内容を簡単に抜粋すると
- ドロワーメニューの設置(右上の3本線をタップすると右からサブメニューが表示される。)
- 固定されるヘッダー
- ヘッダーのクリックトゥコール(スマホアイコンをタップすると電話がかけられるリンク)
- 高解像度画面(iphoneのretina等)に合わせて画像の高解像度に作り直し
- カテゴリーページにヘッダー設置
- 商品ページの整理
- 支払い方法、配送。よくある質問、初めてのお客様等の情報ページの制作
- カート内の入力エリアの幅の拡張(狭いと誤タップしやすいため)
- アイコンはwebフォントを使用(使ってみたかった)
等々です。それぞれいろいろと設置に苦労はしましたが、なんとか予定していたリニューアルはできたかなと思います。
▼ トップページはこんな感じ。PCサイトと合わせてオレンジ系の配色に。
▼ 右上のハンバーガメニューをタップするとサブメニューが表示される。
ドロワーメニューは実際そこまでクリックされるのかなとも思いますが、スマホサイトの流行りですし、単純にカッコイイので設置してみました。
今回のリニューアルは単純に綺麗にするのではなく、PCサイトにはあってスマホサイトにはなかった情報ページを用意したり、商品ページを綺麗に見やすくしたり、ショッピングカート内の入力欄やボタンを大きくして使いやすくしたり等々、買い物をしやすいサイト作りをモットー行いました。
これで完成ではなく、今後も見直し、修正を行っていきますが、当店にお越しいただいたお客様に少しでも楽しく安心したお買い物のお手伝いをできればと思っております。。。
iPhoneだけでなくAndroid端末でも表示確認、動作確認を行っておりますが、不具合がございましたら、ご連絡いただければ幸いです。
あとがき
当店のアクセス数が最近ではスマホ、タブレット経由が過半数を占めてきました。ただコンバージョンは圧倒的にPC経由でこれはやはりスマホサイトのユーザビリティが良くないので離脱率が高いのではと今回スマホサイトのリニューアルを行ないました。
外出時にスマホでチェックして購入はPCからという方もかなりいらっしゃると思いますので、今回のリニューアルでPC経由のコンバージョンがグググッと上がりまくるとまではいかないと思いますが、なんとか売上に結びついてくれればと思っております。
ではでは。。。
コンチクワブログのRSS & ソーシャルページ