ヘッダー　グローバルナビについて

Question

こんばんは、ソルトマンです。
ヘッダーが盛り込みすぎというご指摘をいただき、どうやって改善しようか思案中です。

商品の写真を現在ずらっと並べていますが、これを横に動くように設置したらどうかと考えていますが、そのやり方がわかりません。その方法自体か、やり方を紹介しているサイトがありましたら教えてください。

宜しくお願いします。

Accepted Answer

大変失礼いたしました！
買い物カゴをカスタマイズする方法を、会員ページのマニュアルにアップさせて頂きましたので、そちらをご確認頂ければと思います。

Answer

＞商品の写真を現在ずらっと並べていますが、
＞これを横に動くように設置したらどうかと考えていますが、

例えばこのようなイメージの事をおっしゃっておりますでしょうか。

■トップページ
http://www.rakuten.ne.jp/gold/askashop/
※3枚ほど大きな画像が表示され▼で動かせる

→スライダーjQueryプラグイン「Glide.js」
http://pannyatto.firebird.jp/archives/1653


■商品ページ
http://item.rakuten.co.jp/askashop/w2014031002/
※サムネイルサイズで商品が動かせる

→jQueryでギャラリーを実現するGalleryboxプラグイン
http://www.koikikukan.com/archives/2010/12/16-022222.php


ヘッダーの領域のおすすめの順番は、

屋号
ナビゲーション（検索窓含む）
企画バナー

ですね。上記のショップさんはわかりやすく綺麗に作ってます。

このスタイルは結構多いです。

ちなみにリニューアルの際に参考にして頂きたいのですが、

看板の上に動くバナーのようなものを入れているかと思いますが、
以下の考えもありますので、ご参考までに。

http://tempnate.com/lpo_make/hp_make20.html
http://news.mynavi.jp/news/2012/12/11/025/

に書いてある通りで、一般的にウェブサイトをスクロール無しで一つの画面を固定で凝視する事はあまりないかと思います。

私も楽天で買い物する時には、表示されたらすぐに下にスクロールします。
気に入らなければものの数秒で離脱し、検索結果に戻り、次に気になったショップの商品ページを見ます。

動きのある見せ方をした場合、最初の画面に表示されていないコンテンツはまず見られない可能性が高いです。
この領域で高さをとってしまうのは勿体ないですね。

そういう事で考えると、一般的な固定のグローバルナビゲーションがおすすめです。

Answer

【別件】

ご質問頂いた内容とは異なりますが気になりましたのでご連絡です。

現在買い物カゴのデザインを、青っぽく変更されておりますが、

参考までに以下のページを見てみて下さい。
http://iro-color.com/episode/repair-wasteful-habits.html

色には感情をコントロールする事ができ、
一般的に物を売るのに青はあまり適さないです。
青は節約、支出を抑える色と言われています。

内容は上記URLの記事を読んでみて下さい。

また、他にもこのようなサイトもあります。
http://news.mynavi.jp/news/2010/08/26/078/
http://creators-manual.com/button_conversion/

デザインはCSSを変更するパターンと、
画像に置き換えるパターンがあります。

わかりやすいデザインが一番良いですね。

Answer

早速のご返信ありがとうございます。参考にして、今、ヘッダー部分を改造しています。買い物かごについては、最初のセミナーの時にボタンを大きくすると良いと聞き、改造したのですが、その時に良い方法がわからず、ネットで見つけたCSSを使ったためにやむなく青にしてしまいました。セミナーでは赤いボタンの説明をされて、こういった事も教えていただけるという事だったので、やり方がありましたら赤い買い物ボタンの設置方法を教えてください。
あと、検索窓を大きくする方法というのも探してやってみたのですが、何故か意図する場所は大きくならず、そうでないところにCSSがかかって大きくなっていたりします。こちらも教えていただけると助かります。
宜しくお願いします！！

ヘッダー グローバルナビについて

ヘッダー　グローバルナビについて