株式会社 Jファーム

商品数が膨大ではないショッピングサイトのお手本のようなサイトだと思います。
メインカラーが赤ですが、真っ赤じゃないところもいいです。
トップページでは、おすすめ商品を３つ並べ、その次にはカテゴリーを３つ並べています。最近もっとも主流と言えるようなオーソドックスなパターンが好感です。
About TOMATOとして訴求したい特徴を２つ配置しています。
背景のない画像を並べることですっきりとした印象になっています。背景のある画像（カテゴリー）は丸型で抜いて筆記体のキャプションをつけることで印象的になっています。
「商品のご紹介」ページでは、ページ上部にメニューを設置して目的の商品にたどり着きやすくしてあります。これまではサイドにメニューとして並べることが多かったと思いますが、レスポンシブではサイドはメインの下に配置されるためスマホでは選びやすく設置したはずのメニューがページの一番下まで行かないと表示されないということになってしまうため、このようにメインブロックの上部に並べてあげる工夫が必要です。
一覧に並ぶ各商品は背景のない写真が使われています。このように商品写真を一覧として並べる時には背景がある写真どうかで印象が大きく変わってきます。背景まで考えて撮影された写真であれば良いのでしょうが、なんとなく自分で撮影した写真であれば背景をなくした写真として使うことも考えとしておすすめです。「写真から商品を切り抜いて使ってみたい！」と思ってもphotoshopがないと難しいです。そんな時には切り抜き.jpのようなサービスを試してみてください。
商品詳細ページは、見本のようなレイアウトです。ご利用ガイドなどのサイドに配置されたメニューはスマホではアコーディオン式に表示されます。BiNDでは通常表示とアコーディオン表示を切り替えることはできないので、これをするにはパソコンとスマホでブロックを別にする必要があります。
商品詳細ページの下部分には関連商品として４つの商品が横並びで表示されます。BiNDで作成できるのはhtmlファイルなので自動的に関連商品をピックアップして表示されるようなことはできません。あらかじめ「関連商品」としてブロックを作っておき、共有のパーツとして利用することになります。
フッターメニューの使い方も非常に参考になります。