PCとスマホで違うHTML,テンプレートを使用したい場合、Wordpressで作成する場合は便利なプラグインがあるようです。
最近はレスポンシブも増えていますが、別々のソースを使用する場合もまだまだ多いです。 
今後そのような状況になりそうなので、プラグインを使ってインストールしてみました。
紹介出来そうなのが3つありましたので、早速紹介したいと思います。
<h2>Multi Device Switcher</h2>
オプションという観点から見ると、こちらが一番豊富だと思います。 
日本人の方が作成しているのでもちろん日本語です。
インストール後、 
外観に「マルチデザイン」という項目が表示されるので、そこに行くと・・・ 
<img decoding="async" loading="lazy" class="alignnone size-full wp-image-6756" src="/uploads-archive/2015/01/63f69f1dd8f70898fe27f1cedb432022.png" alt="スクリーンショット 2015-01-27 13.25.00" width="636" height="632" srcset="/uploads-archive/2015/01/63f69f1dd8f70898fe27f1cedb432022.png 636w, /uploads-archive/2015/01/63f69f1dd8f70898fe27f1cedb432022-150x150.png 150w, /uploads-archive/2015/01/63f69f1dd8f70898fe27f1cedb432022-300x298.png 300w, /uploads-archive/2015/01/63f69f1dd8f70898fe27f1cedb432022-228x226.png 228w" sizes="(max-width: 636px) 100vw, 636px" /> 
上の写真のようにスマートフォンやタブレット、ガラケー用にテーマを選択できます。
&nbsp;
<img decoding="async" loading="lazy" class="alignnone size-full wp-image-6757" src="/uploads-archive/2015/01/6b7ba6b5ae155ddc315f9163d52f02f3.png" alt="スクリーンショット 2015-01-27 13.25.28" width="635" height="773" srcset="/uploads-archive/2015/01/6b7ba6b5ae155ddc315f9163d52f02f3.png 635w, /uploads-archive/2015/01/6b7ba6b5ae155ddc315f9163d52f02f3-246x300.png 246w, /uploads-archive/2015/01/6b7ba6b5ae155ddc315f9163d52f02f3-228x277.png 228w" sizes="(max-width: 635px) 100vw, 635px" /> 
ユーザーエージェントも自由に記載できます。
&nbsp;
<img decoding="async" loading="lazy" class="alignnone size-full wp-image-6758" src="/uploads-archive/2015/01/fd55dcab43344213382d993a5b900c85.png" alt="スクリーンショット 2015-01-27 13.25.54" width="626" height="350" srcset="/uploads-archive/2015/01/fd55dcab43344213382d993a5b900c85.png 626w, /uploads-archive/2015/01/fd55dcab43344213382d993a5b900c85-300x167.png 300w, /uploads-archive/2015/01/fd55dcab43344213382d993a5b900c85-228x127.png 228w" sizes="(max-width: 626px) 100vw, 626px" />
スマートフォン等で見た際に、PC版を表示といったボタンの設定の可能です。
かなりいい感じだと思いますが、下のサイトでは評価があまりされてないようですね・・・
&nbsp;
<a class="link" href="https://wordpress.org/plugins/multi-device-switcher/" target="_blank">Multi Device Switcher</a>
&nbsp;
<h2>Any Mobile Theme Switcher</h2>
&nbsp;
こちらはインストール後、 
設定に「Any Mobile Theme」という項目が表示されます。 
このプラグインはスマホを細かくわけることができます。 
iPhone,Android,Window Mobileなんかもありますね。
&nbsp;
<img decoding="async" loading="lazy" class="alignnone wp-image-6759" src="/uploads-archive/2015/01/a295efa61f1546a4357a80912da40e45.png" alt="スクリーンショット 2015-01-27 13.24.16" width="630" height="626" srcset="/uploads-archive/2015/01/a295efa61f1546a4357a80912da40e45.png 737w, /uploads-archive/2015/01/a295efa61f1546a4357a80912da40e45-150x150.png 150w, /uploads-archive/2015/01/a295efa61f1546a4357a80912da40e45-300x297.png 300w, /uploads-archive/2015/01/a295efa61f1546a4357a80912da40e45-228x226.png 228w" sizes="(max-width: 630px) 100vw, 630px" />
&nbsp;
スマホでも更に細かくテーマを切り替えたい場合はこちらがいいかもしれませんね。
&nbsp;
<img decoding="async" loading="lazy" class="alignnone wp-image-6760" src="/uploads-archive/2015/01/a46b88b50609c8e40a9c933330ba9b63.png" alt="スクリーンショット 2015-01-27 13.55.48" width="630" height="414" srcset="/uploads-archive/2015/01/a46b88b50609c8e40a9c933330ba9b63.png 729w, /uploads-archive/2015/01/a46b88b50609c8e40a9c933330ba9b63-300x197.png 300w, /uploads-archive/2015/01/a46b88b50609c8e40a9c933330ba9b63-228x149.png 228w" sizes="(max-width: 630px) 100vw, 630px" />
&nbsp;
オプションとしては、先ほどのにもあった「PC版」「スマホ版」へ切り替えリンクがフッターに表示されます。 
また、「PC版」「スマホ版」の表示の記憶を設定できます。
評価としては、こちらのほうが先ほど紹介したものよりは高くなっております。
<a class="link" href="https://wordpress.org/plugins/any-mobile-theme-switcher/" target="_blank">Any Mobile Theme Switcher</a>
&nbsp;
<h2>Device Theme Switcher</h2>
&nbsp;
インストール後、 
外観に「Device Themes」という項目が表示されます。
そこへ行くと以下の画像のようなページになりますが・・・上２つと比べるとちょっと、、、って感じですね。
&nbsp;
<img decoding="async" loading="lazy" class="alignnone wp-image-6761" src="/uploads-archive/2015/01/f807abd3976c74e7052d670856dd8e23.png" alt="スクリーンショット 2015-01-27 13.24.47" width="630" height="211" srcset="/uploads-archive/2015/01/f807abd3976c74e7052d670856dd8e23.png 867w, /uploads-archive/2015/01/f807abd3976c74e7052d670856dd8e23-300x100.png 300w, /uploads-archive/2015/01/f807abd3976c74e7052d670856dd8e23-228x76.png 228w" sizes="(max-width: 630px) 100vw, 630px" />
<a class="link" href="https://wordpress.org/plugins/device-theme-switcher/" target="_blank">Device Theme Switcher</a>
&nbsp;
&nbsp;
一つのWordpressで作れば、記事やカテゴリが共有できるので便利ですね！！

WordPressにてデバイス毎にテーマを切り替えさせるプラグイン

アニメーション付きSVGで実装する滑らかで自然なアニメーション

現在、正式リリースされているのはWindows８.1といわれるバージョンですが、次期のWindowsOSとして９を飛ばして（8.1が９扱い？）１０が開発されています。
自作好きとしては、注目です。 
最近ではすっかり、自作のコストメリットも薄くなり、意欲も薄れてMacbook一本にしてしまったのですが、今でも自宅は自作PCですし、意味もなくLINUXを入れて楽しんでいたりします。
今回は、Windows10のプレビュー版が日本語対応したというニュースが出ましたので、MacbookにBootcampを入れることができるか試してみました。
<h3 id="toc_1">Windows10プレビュー版の入手</h2>
Windows10のプレビュー版は、バグや改善点をフィードバックする事を前提に 
「Windows Insider Program」から登録すれば、無料で入手することができます。 
バグのフィードバックはシステムに組み込まれていますので、特に意識をすることなく普通に試すことができます。 
そして、フィードバックに基づく改善・開発を続けプレビュー版は、発売前後でライセンスが切れ使用ができなくなります。
残念ながら、プレビュー版から製品版へのアップグレードはできませんので、人柱として試す方に利用は限られます。
<a href="http://answers.microsoft.com/ja-jp/windows/forum/windows8-windowsinstall/windows8releasepreview%E3%81%8B%E3%82%89%E8%A3%BD/ea6b100a-57f0-44c8-9f8b-27ef8c4b5547" target="_blank">Windows8ReleasePreviewから製品版へのアップグレードについて</a>
「Windows Insider Program」は<a href="https://insider.windows.com/" target="_blank">こちら</a>から
<h3 id="toc_2">BootCampでWindows10をインストール</h2>
BootCampの使い方などの説明は割愛します。 
以下のブログなどで丁寧に説明してくださっています。
<a title="Permanent Link to Boot Camp - Mac に Windows8 をインストール" href="http://pc-karuma.net/mac-bootcamp-windows8-install/" target="_blank" rel="bookmark">Boot Camp &#8211; Mac に Windows8 をインストール</a>
「Windows Insider Program」からダウンロードしたisoファイルをBootCamp
アシスタントを用いて、外部メディアに焼付けるといった作業は通常通りで何も滞り無く進みました。
別のUSBメモリーにWindows用のドライバーを格納し、Windows用のスペースを決めて、再起動でインストールがスタートします。
<h3 id="toc_3">インストール開始時に問題発生</h2>
通常であれば、そのままWindowsのインストール画面が立ち上がりスタートをするはずが、黒画面に起動するためのメディアがないという警告が出て、その後進まなくなってしまいました。 
解決方法はoptionキーを押して、起動するディスクというのを指定する必要がありました。
<a href="http://support.apple.com/ja-jp/HT1310" target="_blank">Appleのサポートページ</a>がわかりやすいです。
その後は、順調でインストールまで駆け上がっていきました。
初期設定も非常に短く、今までですとコンピュータ名などの入力があったのですが、ユーザーネームを決めるくらいだったと思います。 
確かに、このコンピュータ名をいきなり決めろというのは、十回以上もインストールをしてきましたがとにかく煩わしかったです。 
特に、慣れていないユーザーにとっては、ナンノコッチャで一気にハードルに感じると思います。
<h3 id="toc_4">Windows サポートソフトウェアをインストール</h2>
<a href="/uploads-archive/2015/01/ScreenClip.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-6751" src="/uploads-archive/2015/01/ScreenClip-300x187.png" alt="ScreenClip" width="300" height="187" srcset="/uploads-archive/2015/01/ScreenClip-300x187.png 300w, /uploads-archive/2015/01/ScreenClip-1024x640.png 1024w, /uploads-archive/2015/01/ScreenClip-228x142.png 228w, /uploads-archive/2015/01/ScreenClip.png 1280w" sizes="(max-width: 300px) 100vw, 300px" /></a>
このように初期画面が立ちがりますが、このままではインターネットも繋がらない状態でほぼ何も出来ません。 
先ほど、USBメモリに焼いたWindows サポートソフトウェアをインストールします。 
ここが肝でトラックパッドや無線LAN、Bluetoothといった各種ドライバーがインストールされ、フル活用が出来るようになります。 
しかしながら、ここでも一つ問題が発生。 
外部ディスプレイが認識されません。 
これもディスプレイドライバーがまだ未対応なためであるでしょう。 
こればかりは解決策もないので、ドライバーが作成されるまで待つしかありません。
<a href="/uploads-archive/2015/01/37e3808047553cedb34daa9b1d7ab2a3.jpeg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-6750" src="/uploads-archive/2015/01/37e3808047553cedb34daa9b1d7ab2a3-300x225.jpeg" alt="写真" width="300" height="225" srcset="/uploads-archive/2015/01/37e3808047553cedb34daa9b1d7ab2a3-300x225.jpeg 300w, /uploads-archive/2015/01/37e3808047553cedb34daa9b1d7ab2a3-1024x768.jpeg 1024w, /uploads-archive/2015/01/37e3808047553cedb34daa9b1d7ab2a3-228x171.jpeg 228w" sizes="(max-width: 300px) 100vw, 300px" /></a>
Windows8ではメトロUIという全画面のアプリ選択画面がデフォルトになっていましたが、Windows10では、デスクトップがデフォルトです。 
正直、PCのあるべき姿はこっちですよね。タブレットやスマートフォンと垂直に統合をしたかったと思われるのですが、PCはやっぱりデスクトップがデフォルトであるべきです。 
メトロUIはスタートメニューに残っていました。このくらいがベストだと思います。
<h3 id="toc_5">まとめ</h2>
以下、Macbookpro（2013）を基準にしていますので、環境やインストール時のバージョンやドライバーの違いで再現しないこともあると思いますので、ご了承下さい。
<ul>
<li>トラックパッドや無線LANなど基本的な動作は問題なし。</li>
<li>インストール時のBootはoptionキーを押して明示的に指定をする必要があった。</li>
<li>外部ディスプレイに出力はまだ出来なかった。</li>
</ul>
以上、人柱報告です。

Windows10をBootcampにインストール

ちょっと古いが、ネット通販に関するおもしろいアンケートがあったのでメモ。
<a href="https://www.fast-ask.com/report/report-netshopping-20141205.html" target="_blank"> https://www.fast-ask.com/report/report-netshopping-20141205.html</a>
&nbsp;
<h2>ネット通販利用する主な端末</h2>
全体
PC：87.1%
SP：8.7%
タブレット：3.8%
&nbsp;
詳細
<table>
<tbody>
<tr>
<td></td>
<td></td>
<td>PC</td>
<td>SP</td>
</tr>
<tr>
<td rowspan="4">男性</td>
<td>20代</td>
<td>87.20%</td>
<td>6.40%</td>
</tr>
<tr>
<td>30代</td>
<td>89.60%</td>
<td>6.40%</td>
</tr>
<tr>
<td>40代</td>
<td>91.20%</td>
<td>6.40%</td>
</tr>
<tr>
<td>50代</td>
<td>95.20%</td>
<td>1.60%</td>
</tr>
<tr>
<td rowspan="4">女性</td>
<td>20代</td>
<td>72.80%</td>
<td>22.40%</td>
</tr>
<tr>
<td>30代</td>
<td>75.20%</td>
<td>18.40%</td>
</tr>
<tr>
<td>40代</td>
<td>92.80%</td>
<td>6.40%</td>
</tr>
<tr>
<td>50代</td>
<td>92.80%</td>
<td>1.60%</td>
</tr>
</tbody>
</table>
そんなにか?と思うほどPCでの利用が多い。
SPについては20代、30代の女性が圧倒的に多いことがわかる。
今回10代は対象外だったが、おそらくもっと多いのだろうと予想できる。
&nbsp;
<h2>ネット通販の利用シーン</h2>
<table>
<tbody>
<tr>
<td></td>
<td></td>
<td>普段使い</td>
<td>ご褒美</td>
<td>ギフト</td>
<td>その他</td>
</tr>
<tr>
<td rowspan="4">男性</td>
<td>20代</td>
<td>75.20%</td>
<td>50.40%</td>
<td>27.20%</td>
<td>14.40%</td>
</tr>
<tr>
<td>30代</td>
<td>82.40%</td>
<td>53.60%</td>
<td>36.00%</td>
<td>25.60%</td>
</tr>
<tr>
<td>40代</td>
<td>88.00%</td>
<td>48.80%</td>
<td>35.20%</td>
<td>17.60%</td>
</tr>
<tr>
<td>50代</td>
<td>88.80%</td>
<td>36.00%</td>
<td>28.00%</td>
<td>16.80%</td>
</tr>
<tr>
<td rowspan="4">女性</td>
<td>20代</td>
<td>79.20%</td>
<td>61.60%</td>
<td>45.60%</td>
<td>7.20%</td>
</tr>
<tr>
<td>30代</td>
<td>86.40%</td>
<td>48.80%</td>
<td>40.00%</td>
<td>16.00%</td>
</tr>
<tr>
<td>40代</td>
<td>86.40%</td>
<td>38.40%</td>
<td>41.60%</td>
<td>14.40%</td>
</tr>
<tr>
<td>50代</td>
<td>90.40%</td>
<td>37.60%</td>
<td>36.80%</td>
<td>16.00%</td>
</tr>
</tbody>
</table>
自分のための日用品の購入が多いことがわかる。
本アンケートのおもしろいところは、普段使いの商品購入について掘り下げているところ。
&nbsp;
<h2>普段使いの商品選びに与える影響</h2>
<table>
<tbody>
<tr>
<td></td>
<td>非常に影響を与える</td>
<td>影響を与える</td>
<td>どちらともいえない</td>
<td>あまり影響を与えない</td>
</tr>
<tr>
<td>サイト内での商品の探しやすさ</td>
<td>31.80%</td>
<td>51.70%</td>
<td>12.90%</td>
<td>2.80%</td>
</tr>
<tr>
<td>サイト自体のデザイン性</td>
<td>11.30%</td>
<td>38.70%</td>
<td>33.50%</td>
<td>12.80%</td>
</tr>
<tr>
<td>商品のレコメンド機能の有無</td>
<td>14.90%</td>
<td>35.70%</td>
<td>34.00%</td>
<td>9.90%</td>
</tr>
<tr>
<td>商品写真の豊富さ</td>
<td>29.90%</td>
<td>49.40%</td>
<td>14.40%</td>
<td>4.80%</td>
</tr>
<tr>
<td>商品紹介記事のおもしろさ</td>
<td>9.10%</td>
<td>28.40%</td>
<td>38.90%</td>
<td>17.50%</td>
</tr>
</tbody>
</table>
商品の探しやすさが重要で、デザイン、写真、内容についてはあまり重要視されていない。
要は目的が決まっていることが多いようだ。
&nbsp;
<h2>普段使いの商品購入の意思決定に与える影響</h2>
<table>
<tbody>
<tr>
<td></td>
<td>非常に影響を与える</td>
<td>影響を与える</td>
<td>どちらともいえない</td>
<td>あまり影響を与えない</td>
</tr>
<tr>
<td>商品の品質</td>
<td>41.80%</td>
<td>46.00%</td>
<td>10.40%</td>
<td>1.40%</td>
</tr>
<tr>
<td>商品の知名度</td>
<td>10.50%</td>
<td>36.80%</td>
<td>37.20%</td>
<td>11.90%</td>
</tr>
<tr>
<td>商品の話題性</td>
<td>8.40%</td>
<td>29.00%</td>
<td>37.90%</td>
<td>19.10%</td>
</tr>
<tr>
<td>商品の納期</td>
<td>21.20%</td>
<td>47.60%</td>
<td>23.30%</td>
<td>7.10%</td>
</tr>
<tr>
<td>商品の価格</td>
<td>64.10%</td>
<td>29.60%</td>
<td>5.40%</td>
<td>0.60%</td>
</tr>
</tbody>
</table>
購入する商品が決まっていればやはり価格重視になるよう。
意外と納期はそこまで影響が無いようにも思える。
&nbsp;
<h2>普段使いの商品購入の後押しを与える影響</h2>
<table>
<tbody>
<tr>
<td></td>
<td>非常に影響を与える</td>
<td>影響を与える</td>
<td>どちらともいえない</td>
<td>あまり影響を与えない</td>
</tr>
<tr>
<td>送料の有無</td>
<td>56.60%</td>
<td>33.80%</td>
<td>8.30%</td>
<td>0.70%</td>
</tr>
<tr>
<td>レビューなどの評価</td>
<td>24.50%</td>
<td>45.70%</td>
<td>20.90%</td>
<td>6.10%</td>
</tr>
<tr>
<td>先着○名でのプレゼントの有無</td>
<td>5.90%</td>
<td>19.70%</td>
<td>35.90%</td>
<td>23.90%</td>
</tr>
<tr>
<td>抽選○名でのプレゼントの有無</td>
<td>3.80%</td>
<td>13.40%</td>
<td>36.10%</td>
<td>26.50%</td>
</tr>
<tr>
<td>数量限定かどうか</td>
<td>5.70%</td>
<td>15.50%</td>
<td>39.60%</td>
<td>24.00%</td>
</tr>
<tr>
<td>購入時に付与されるポイントの有無</td>
<td>21.00%</td>
<td>46.50%</td>
<td>22.70%</td>
<td>6.60%</td>
</tr>
<tr>
<td>購入時のキャッシュバックの有無</td>
<td>12.90%</td>
<td>37.10%</td>
<td>34.30%</td>
<td>10.20%</td>
</tr>
<tr>
<td>購入時に無料で付いてくるセットアイテムの有無</td>
<td>7.70%</td>
<td>28.70%</td>
<td>35.00%</td>
<td>18.30%</td>
</tr>
<tr>
<td>期間限定の割引の有無</td>
<td>19.90%</td>
<td>48.80%</td>
<td>21.60%</td>
<td>7.20%</td>
</tr>
<tr>
<td>納期短縮サービスの有無</td>
<td>8.00%</td>
<td>22.30%</td>
<td>40.10%</td>
<td>18.60%</td>
</tr>
<tr>
<td>ショップオリジナルアイテムかどうか</td>
<td>3.40%</td>
<td>13.10%</td>
<td>37.80%</td>
<td>27.90%</td>
</tr>
</tbody>
</table>
個人差はあると思うが、すごく参考になるデータ。
送料の有無がここまで影響があるとは思わなかった。
あと、意外とレビューは見ているようだ。
&nbsp;
無料配布のアンケート結果だが、一応個人情報の入力が必要なため一部抜粋とさせていただいた。
おもしろいアンケートと思うので、ぜひ見てみてください

ネット通販アンケート

今回は動画でweb系のスキルを学べるサービスをご紹介します。
以前、web上で学べるサイトを紹介した時にあった、ドットインストールやschooも動画で学べるサイトですね！ 
その二つはかなり普及されているように感じます。
今回ご紹介するのは3つのサイトになります。
<h2>Progate</h2>
<a href="http://prog-8.com/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6683" src="/uploads-archive/2015/01/Progate-Learn-to-Code-Learn-to-be-Creative.-1024x571.jpg" alt="Progate Learn to Code, Learn to be Creative." width="620" height="346" srcset="/uploads-archive/2015/01/Progate-Learn-to-Code-Learn-to-be-Creative.-1024x571.jpg 1024w, /uploads-archive/2015/01/Progate-Learn-to-Code-Learn-to-be-Creative.-300x167.jpg 300w, /uploads-archive/2015/01/Progate-Learn-to-Code-Learn-to-be-Creative.-228x127.jpg 228w, /uploads-archive/2015/01/Progate-Learn-to-Code-Learn-to-be-Creative..jpg 1183w" sizes="(max-width: 620px) 100vw, 620px" /></a>
<a href="http://prog-8.com/" target="_blank" class="link">Progate | Learn to Code, Learn to be Creative.</a>
<h2>Udemy</h2>
<a href="https://www.udemy.com/courses/" target="_blank"><img decoding="async" loading="lazy" class="alignnone wp-image-6681" src="/uploads-archive/2015/01/Best-Online-Courses-Udemy-1024x571.jpg" alt="Best Online Courses Udemy" width="620" height="346" srcset="/uploads-archive/2015/01/Best-Online-Courses-Udemy-1024x571.jpg 1024w, /uploads-archive/2015/01/Best-Online-Courses-Udemy-300x167.jpg 300w, /uploads-archive/2015/01/Best-Online-Courses-Udemy-228x127.jpg 228w, /uploads-archive/2015/01/Best-Online-Courses-Udemy.jpg 1183w" sizes="(max-width: 620px) 100vw, 620px" /></a>
<a href="https://www.udemy.com/courses/" target="_blank" class="link">Best Online Courses | Udemy</a>
<h2>Learn Git</h2>
<a href="http://www.git-tower.com/learn/videos" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6682" src="/uploads-archive/2015/01/Learn-Git-Learn-Version-Control-with-Git-1024x571.jpg" alt="Learn Git - Learn Version Control with Git" width="620" height="346" srcset="/uploads-archive/2015/01/Learn-Git-Learn-Version-Control-with-Git-1024x571.jpg 1024w, /uploads-archive/2015/01/Learn-Git-Learn-Version-Control-with-Git-300x167.jpg 300w, /uploads-archive/2015/01/Learn-Git-Learn-Version-Control-with-Git-228x127.jpg 228w, /uploads-archive/2015/01/Learn-Git-Learn-Version-Control-with-Git.jpg 1183w" sizes="(max-width: 620px) 100vw, 620px" /></a>
<a href="http://www.git-tower.com/learn/videos" target="_blank" class="link">Learn Git &#8211; Learn Version Control with Git</a>

動画で学べるwebサービス3つのご紹介

PHP 日付、曜日を操作する関数

<h2>クレショフ効果</h2>
組合せ①
<a href="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6699" src="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg" alt="f31bb40bb3430abf631e2272745089b6_s" width="235" height="355" srcset="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg 424w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-198x300.jpg 198w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-228x344.jpg 228w" sizes="(max-width: 235px) 100vw, 235px" /><img decoding="async" loading="lazy" class="alignnone wp-image-6700" src="/uploads-archive/2015/01/f067ea0290cc244b066bd6f37a64e212_s.jpg" alt="f067ea0290cc244b066bd6f37a64e212_s" width="234" height="355" /></a>
組合せ②
<a href="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6699" src="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg" alt="f31bb40bb3430abf631e2272745089b6_s" width="235" height="355" srcset="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg 424w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-198x300.jpg 198w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-228x344.jpg 228w" sizes="(max-width: 235px) 100vw, 235px" /></a><a href="/uploads-archive/2015/01/c8752b03ac9ac93f7b3d1d64881c788d_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6720" src="/uploads-archive/2015/01/c8752b03ac9ac93f7b3d1d64881c788d_s.jpg" alt="c8752b03ac9ac93f7b3d1d64881c788d_s" width="236" height="356" srcset="/uploads-archive/2015/01/c8752b03ac9ac93f7b3d1d64881c788d_s.jpg 424w, /uploads-archive/2015/01/c8752b03ac9ac93f7b3d1d64881c788d_s-198x300.jpg 198w, /uploads-archive/2015/01/c8752b03ac9ac93f7b3d1d64881c788d_s-228x344.jpg 228w" sizes="(max-width: 236px) 100vw, 236px" /></a>
組合せ③
<a href="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6699" src="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg" alt="f31bb40bb3430abf631e2272745089b6_s" width="235" height="355" srcset="/uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s.jpg 424w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-198x300.jpg 198w, /uploads-archive/2015/01/f31bb40bb3430abf631e2272745089b6_s-228x344.jpg 228w" sizes="(max-width: 235px) 100vw, 235px" /></a><a href="/uploads-archive/2015/01/77cfb2e14a2226ab3f307983ede4d21c_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6703" src="/uploads-archive/2015/01/77cfb2e14a2226ab3f307983ede4d21c_s.jpg" alt="77cfb2e14a2226ab3f307983ede4d21c_s" width="350" height="232" srcset="/uploads-archive/2015/01/77cfb2e14a2226ab3f307983ede4d21c_s.jpg 640w, /uploads-archive/2015/01/77cfb2e14a2226ab3f307983ede4d21c_s-300x198.jpg 300w, /uploads-archive/2015/01/77cfb2e14a2226ab3f307983ede4d21c_s-228x151.jpg 228w" sizes="(max-width: 350px) 100vw, 350px" /></a>
組合せ①～③で女性はどんな心境でしょうか？
きっと左側の女性の表情がそれぞれ違って見えてくるはずです。
女性がどんな心境にいるのか読み取ろうとすると、右側の写真の影響で無意識にバイアスがかかってイメージができてしまうんですね。
これを「クレショフ効果」というそうです。
&nbsp;
実際どんな場合に応用できるかというと、商品の説明ページにおいてシチュエーションを具体的に想像させることで購買意欲をかき立てるとのこと。
例えば「恋人と美味しいワインを一緒に飲みたい」と思わせたり、「パーティーに良いお酒を持っていたったらウケるかな」と想像するように促すというものです。
<a href="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6707" src="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg" alt="7a89c5ccdc01da94c6fc2b9faf827dd2_s" width="234" height="353" srcset="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg 424w, /uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s-198x300.jpg 198w, /uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s-228x344.jpg 228w" sizes="(max-width: 234px) 100vw, 234px" /></a><a href="/uploads-archive/2015/01/86652d58125e3dd0ff1294f809a379d8_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6708" src="/uploads-archive/2015/01/86652d58125e3dd0ff1294f809a379d8_s.jpg" alt="86652d58125e3dd0ff1294f809a379d8_s" width="233" height="350" srcset="/uploads-archive/2015/01/86652d58125e3dd0ff1294f809a379d8_s.jpg 427w, /uploads-archive/2015/01/86652d58125e3dd0ff1294f809a379d8_s-200x300.jpg 200w, /uploads-archive/2015/01/86652d58125e3dd0ff1294f809a379d8_s-228x341.jpg 228w" sizes="(max-width: 233px) 100vw, 233px" /></a>
<a href="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6707" src="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg" alt="7a89c5ccdc01da94c6fc2b9faf827dd2_s" width="234" height="353" srcset="/uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s.jpg 424w, /uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s-198x300.jpg 198w, /uploads-archive/2015/01/7a89c5ccdc01da94c6fc2b9faf827dd2_s-228x344.jpg 228w" sizes="(max-width: 234px) 100vw, 234px" /></a><a href="/uploads-archive/2015/01/8d30a20398ac40f75c7d2d457adb4a42_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6710" src="/uploads-archive/2015/01/8d30a20398ac40f75c7d2d457adb4a42_s.jpg" alt="8d30a20398ac40f75c7d2d457adb4a42_s" width="414" height="276" srcset="/uploads-archive/2015/01/8d30a20398ac40f75c7d2d457adb4a42_s.jpg 640w, /uploads-archive/2015/01/8d30a20398ac40f75c7d2d457adb4a42_s-300x200.jpg 300w, /uploads-archive/2015/01/8d30a20398ac40f75c7d2d457adb4a42_s-228x152.jpg 228w" sizes="(max-width: 414px) 100vw, 414px" /></a>
イメージ付したい画像を近くに置くことで、お客さんは無意識にワインに対してロマンティックなイメージや、楽しいイメージを想像する可能性が高くなります。
商品単体の画像にこだわるもの大切ですが、商品画像のまわりに配置する画像も大切という事ですね。
&nbsp;
商品自体が無機質なものほど、商品単体の画像より同時に掲載する画像が大切になってきます。
<a href="/uploads-archive/2015/01/8cbd08a2054cd53bb901e366da701c27_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6711" src="/uploads-archive/2015/01/8cbd08a2054cd53bb901e366da701c27_s.jpg" alt="8cbd08a2054cd53bb901e366da701c27_s" width="374" height="249" srcset="/uploads-archive/2015/01/8cbd08a2054cd53bb901e366da701c27_s.jpg 640w, /uploads-archive/2015/01/8cbd08a2054cd53bb901e366da701c27_s-300x200.jpg 300w, /uploads-archive/2015/01/8cbd08a2054cd53bb901e366da701c27_s-228x152.jpg 228w" sizes="(max-width: 374px) 100vw, 374px" /></a>
食器を扱っている場合であれば下のようなシンプルな画像に加えて、実際に使っているシーンの画像や大きさが伝わる画像を加える事でより具体的に商品をイメージできます。
<a href="/uploads-archive/2015/01/21bc994c0698e4e07948bfb02f0e56e1_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6712" src="/uploads-archive/2015/01/21bc994c0698e4e07948bfb02f0e56e1_s.jpg" alt="21bc994c0698e4e07948bfb02f0e56e1_s" width="332" height="221" srcset="/uploads-archive/2015/01/21bc994c0698e4e07948bfb02f0e56e1_s.jpg 640w, /uploads-archive/2015/01/21bc994c0698e4e07948bfb02f0e56e1_s-300x200.jpg 300w, /uploads-archive/2015/01/21bc994c0698e4e07948bfb02f0e56e1_s-228x152.jpg 228w" sizes="(max-width: 332px) 100vw, 332px" /></a><a href="/uploads-archive/2015/01/540bb370edfd70c57b1b8bae053c0b32_s.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6714" src="/uploads-archive/2015/01/540bb370edfd70c57b1b8bae053c0b32_s.jpg" alt="540bb370edfd70c57b1b8bae053c0b32_s" width="329" height="219" srcset="/uploads-archive/2015/01/540bb370edfd70c57b1b8bae053c0b32_s.jpg 640w, /uploads-archive/2015/01/540bb370edfd70c57b1b8bae053c0b32_s-300x200.jpg 300w, /uploads-archive/2015/01/540bb370edfd70c57b1b8bae053c0b32_s-228x152.jpg 228w" sizes="(max-width: 329px) 100vw, 329px" /></a>

ECサイトのデザインに役立つ心理学2

お仕事もご一緒させて頂いている知人が携わっている会社でインバウンドECのサービスを開始致しました。
<a href="http://bizmakoto.jp/makoto/articles/1501/14/news129.html" target="_blank">日本郵便と中国最大の旅行サービスが提携、訪日客のホテルに商品配達</a>
弊社では越境ECを掲げていますが、グローバルに展開、外貨を稼ぐという手段のもう一つにインバウンドECがあります。
越境ECとインバウンドECの違いは以下のようになります。
<a href="/uploads-archive/2015/01/bfb477adedcc62811dfe122a22e07935.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-6692" src="/uploads-archive/2015/01/bfb477adedcc62811dfe122a22e07935-300x126.png" alt="越境ECインバウンドEC" width="300" height="126" srcset="/uploads-archive/2015/01/bfb477adedcc62811dfe122a22e07935-300x126.png 300w, /uploads-archive/2015/01/bfb477adedcc62811dfe122a22e07935-228x95.png 228w, /uploads-archive/2015/01/bfb477adedcc62811dfe122a22e07935.png 999w" sizes="(max-width: 300px) 100vw, 300px" /></a>
&nbsp;
両方共、外貨を獲得するということに変わりはないのですが、お客様のいる場所が異なります。
越境ECは文字通り日本から越境してお客様のいる国にモノを運びます。
インバウンドECは日本に来たお客様向けにECを提供します。商品の受取は訪日中に滞在するホテルや空港、店頭での受取ということになるでしょう。
<h2>越境ECインバウンドECのメリットデメリット</h2>
ここで、両者のメリットデメリットというところを考えてみたいと思います。
<ul>
<li>越境ECの最大の障壁はローカライズが必要ということ。中国では、基本チャットベースで交渉をしながら決済までいきます。</li>
<li>物流においては、インバウンドECが圧倒的な優位性があります。どこから運んでも1日2日で納品することが可能でしょう。</li>
<li>2014年過去最高を記録してもインバウンドECのマーケットは1400万人。越境ECであれば、世界中の人がターゲットになります。</li>
</ul>
<h2>まとめ</h2>
以上は考えられる程度ではありますが、先ほどのリリース文を見ると、訪日中国人200万人のマーケットに対して、30億円の売上目標ということでインバウンドECでも十分なマーケット規模はあることが伺い知れます。
まだ、サイト自体は公開されていないようなので、引き続き、期待をしてウォッチしていきたいと思います。

訪日観光客向けのインバウンドEC

テキストで括弧の横の余分なスペースを軽減するjQueryコード

なんてタイトルですが、 
設定していないわけではないんですよね。
基本的には大抵横幅960pxと設定してサイトのデザインをするのですが、 
そうではなく、ウィンドウ幅に合わせてサイトをデザインしているサイトのご紹介になります。
ちなみに、すべてレスポンシブです。(このデザインでは当たり前ですね・・・)
<h2>CKD 空気圧機器 制御機器 自動機械装置 総合メーカー</h2>
<a href="http://www.ckd.co.jp/" target="_blank"><img decoding="async" loading="lazy" class="alignnone wp-image-6651" src="/uploads-archive/2015/01/adc21716ea7107c1e81ce6f6606b5748-1024x704.jpg" alt="CKD 空気圧機器 制御機器 自動機械装置 総合メーカー" width="600" height="413" srcset="/uploads-archive/2015/01/adc21716ea7107c1e81ce6f6606b5748-1024x704.jpg 1024w, /uploads-archive/2015/01/adc21716ea7107c1e81ce6f6606b5748-300x206.jpg 300w, /uploads-archive/2015/01/adc21716ea7107c1e81ce6f6606b5748-228x156.jpg 228w, /uploads-archive/2015/01/adc21716ea7107c1e81ce6f6606b5748.jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a class="link" href="http://www.ckd.co.jp/" target="_blank">CKD 空気圧機器 制御機器 自動機械装置 総合メーカー</a>
<h2>二本松物流株式会社</h2>
<a href="http://www.nihonmatsu.co.jp/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6653" src="/uploads-archive/2015/01/df99cf4351e17c302856aa4718f41d2b-1024x704.jpg" alt="チルド配送 小口配送 食品流通｜二本松物流株式会社" width="600" height="413" srcset="/uploads-archive/2015/01/df99cf4351e17c302856aa4718f41d2b-1024x704.jpg 1024w, /uploads-archive/2015/01/df99cf4351e17c302856aa4718f41d2b-300x206.jpg 300w, /uploads-archive/2015/01/df99cf4351e17c302856aa4718f41d2b-228x156.jpg 228w, /uploads-archive/2015/01/df99cf4351e17c302856aa4718f41d2b.jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a href="http://www.nihonmatsu.co.jp/" target="_blank" class="link">チルド配送 小口配送 食品流通｜二本松物流株式会社</a>
<h2>WENT Coffee Co.</h2>
<a href="http://went.tokyo/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6652" src="/uploads-archive/2015/01/WENT-Coffee-Co.-1024x704.jpg" alt="WENT Coffee Co." width="600" height="413" srcset="/uploads-archive/2015/01/WENT-Coffee-Co.-1024x704.jpg 1024w, /uploads-archive/2015/01/WENT-Coffee-Co.-300x206.jpg 300w, /uploads-archive/2015/01/WENT-Coffee-Co.-228x156.jpg 228w, /uploads-archive/2015/01/WENT-Coffee-Co..jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a href="http://went.tokyo/" target="_blank" class="link">WENT Coffee Co.</a>
<h2>産科婦人科 佐川クリニック</h2>
<a href="http://www.sagawa-clinic.com/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6655" src="/uploads-archive/2015/01/11ae9f919045eb3d93e0c6235608142f-1024x704.jpg" alt="産科婦人科 佐川クリニック" width="600" height="413" srcset="/uploads-archive/2015/01/11ae9f919045eb3d93e0c6235608142f-1024x704.jpg 1024w, /uploads-archive/2015/01/11ae9f919045eb3d93e0c6235608142f-300x206.jpg 300w, /uploads-archive/2015/01/11ae9f919045eb3d93e0c6235608142f-228x156.jpg 228w, /uploads-archive/2015/01/11ae9f919045eb3d93e0c6235608142f.jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a href="http://www.sagawa-clinic.com/" target="_blank" class="link">産科婦人科 佐川クリニック</a>
<h2>47株式会社</h2>
<a href="http://47co.jp/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6650" src="/uploads-archive/2015/01/bbf335ff0c9ee09eb10cce23d1e0291a-1024x704.jpg" alt="47株式会社 もっと暮らしやすくなるための日本づくり" width="600" height="413" srcset="/uploads-archive/2015/01/bbf335ff0c9ee09eb10cce23d1e0291a-1024x704.jpg 1024w, /uploads-archive/2015/01/bbf335ff0c9ee09eb10cce23d1e0291a-300x206.jpg 300w, /uploads-archive/2015/01/bbf335ff0c9ee09eb10cce23d1e0291a-228x156.jpg 228w, /uploads-archive/2015/01/bbf335ff0c9ee09eb10cce23d1e0291a.jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a href="http://47co.jp/" target="_blank" class="link">47株式会社 | もっと暮らしやすくなるための日本づくり</a>
<h2>KITOTE</h2>
<a href="http://kitote.jp/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6656" src="/uploads-archive/2015/01/836e34f27a4ed5e6b0a8edab4b6b3cca-1024x704.jpg" alt="天然木と手仕事の建具『KITOTE』" width="600" height="413" srcset="/uploads-archive/2015/01/836e34f27a4ed5e6b0a8edab4b6b3cca-1024x704.jpg 1024w, /uploads-archive/2015/01/836e34f27a4ed5e6b0a8edab4b6b3cca-300x206.jpg 300w, /uploads-archive/2015/01/836e34f27a4ed5e6b0a8edab4b6b3cca-228x156.jpg 228w, /uploads-archive/2015/01/836e34f27a4ed5e6b0a8edab4b6b3cca.jpg 1101w" sizes="(max-width: 600px) 100vw, 600px" /></a>
<a href="http://kitote.jp/" target="_blank" class="link">天然木と手仕事の建具『KITOTE』</a>
<h2>株式会社アトラエ</h2>
<a href="http://atrae.co.jp/" target="_blank"><img decoding="async" loading="lazy" class="alignnone size-large wp-image-6654" src="/uploads-archive/2015/01/dd73a0b7be8e988f2053dfff0048e2aa-1024x695.jpg" alt="株式会社アトラエ Atrae, Inc." width="600" height="413" /></a>
<a href="http://atrae.co.jp/" target="_blank" class="link">株式会社アトラエ | Atrae, Inc.</a>

横幅なんて設定しない！ウィンドウ幅ピッタリのサイト7つ

ミャンマー大統領、総選挙へスー・チー氏らと会談
<a href="http://www.nikkei.com/article/DGXLASGM12H7D_S5A110C1FF8000/" target="_blank">http://www.nikkei.com/article/DGXLASGM12H7D_S5A110C1FF8000/</a>
&nbsp;
ミャンマー、2014年の観光客は300万人11億3,500万ドル
<a href="http://www.myanmar-news.asia/news_acx6yrmJfq.html" target="_blank">http://www.myanmar-news.asia/news_acx6yrmJfq.html</a>
&nbsp;
インフレ率10%
<a href="http://jinjibu.jp/news/detl/8670/" target="_blank">http://jinjibu.jp/news/detl/8670/</a>
<a href="http://jinjibu.jp/news/detl/8670/" target="_blank"> </a>
ミャンマーが「ASEAN観光フォーラム2015」のホスト国に
<a href="http://www.myanmar-news.asia/news_abUlMaL7OC.html" target="_blank">http://www.myanmar-news.asia/news_abUlMaL7OC.html</a>
<a href="http://www.myanmar-news.asia/news_abUlMaL7OC.html" target="_blank"> </a>
住商がミャンマーで中型火力 16年稼働、工業団地に供給
<a href="http://www.nikkei.com/article/DGXLASDZ25I0N_V21C14A2TJ2000/" target="_blank">http://www.nikkei.com/article/DGXLASDZ25I0N_V21C14A2TJ2000/</a>
<a href="http://www.nikkei.com/article/DGXLASDZ25I0N_V21C14A2TJ2000/" target="_blank"> </a>
ミャンマー鉄道、ヤンゴン市環状線を電化へ
<a href="http://myanmarjapon.com/newsdigest/2015/01/09-000617.php" target="_blank">http://myanmarjapon.com/newsdigest/2015/01/09-000617.php</a>
<a href="http://myanmarjapon.com/newsdigest/2015/01/09-000617.php" target="_blank"> </a>
対ミャンマー投資、1.7倍 8400億円
<a href="http://www.nikkei.com/article/DGXLASGM03H2R_W5A100C1FF1000/" target="_blank">http://www.nikkei.com/article/DGXLASGM03H2R_W5A100C1FF1000/</a>
<a href="http://www.nikkei.com/article/DGXLASGM03H2R_W5A100C1FF1000/" target="_blank"> </a>
総選挙、10月下旬から11月初旬までに実施
<a href="http://www.nikkei.com/article/DGXLASGM02H2F_S5A100C1FF8000/" target="_blank">http://www.nikkei.com/article/DGXLASGM02H2F_S5A100C1FF8000/</a>
<a href="http://www.nikkei.com/article/DGXLASGM02H2F_S5A100C1FF8000/" target="_blank"> </a>
日本通運がミャンマー進出
<a href="http://www.myanmar-news.asia/news_aartZQzjGu.html" target="_blank">http://www.myanmar-news.asia/news_aartZQzjGu.html</a>
<a href="http://www.myanmar-news.asia/news_aartZQzjGu.html" target="_blank"> </a>
日本取引所と大和総研、ミャンマー証取と23日に合弁契約
<a href="http://www.nikkei.com/article/DGXLASGC19H15_Z11C14A2EE8000/" target="_blank">http://www.nikkei.com/article/DGXLASGC19H15_Z11C14A2EE8000/</a>
<a href="http://www.nikkei.com/article/DGXLASGC19H15_Z11C14A2EE8000/" target="_blank"> </a>
ミャンマーの携帯電話事情
<a href="http://wirelesswire.jp/Global_Trendline/201501051830.html" target="_blank">http://wirelesswire.jp/Global_Trendline/201501051830.html</a>

最近のミャンマー関連ニュースまとめ

SVGとCSS3でできる筆記体のアニメーションをやってみる

コンビニやスーパーマーケットでの商品配置はお客さんの行動心理を読み取った配置になっているとよく聞きます。繁盛している雰囲気を出すために、コンビニの雑誌売り場を外から見える場所に配置して立ち読み客を賑やかしになってもらうというのは有名です。
小売店において行動心理を応用した配置はとても一般的になっているので、リアル店舗同様、ＥＣサイトのデザインにも行動心理を考慮するのは必須だと思います。運営サイトの売上を伸ばすためにせっかくなので利用しようと思ったものをまとめてみます。
<h2>画像の配置</h2>
<a href="/uploads-archive/2015/01/center_effect.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6632" src="/uploads-archive/2015/01/center_effect.jpg" alt="center_effect" width="703" height="133" /></a>
上に並んでいるのは「おせち」の写真ですが、あなたはどのおせちを選びますか？
&nbsp;
このように水平に画像を並べた場合、中央に配置された画像を選ぶ傾向が強くなるそうです、これは「センターステージエフェクト」と呼ばれます。
上の画像は横並びですが、これを縦に配置した場合でも同様に中央が選ばれる傾向が強くなるとの事です。
売りたい商品の画像は中央に置く方が良さそうです。
&nbsp;
<h2>価格差がある場合</h2>
通常のＥＣサイトではそれぞれ商品ごとに価格が異なるので、まずは価格がどの商品を選ぶかの主な理由になります。
&nbsp;
例えば、WEB上で画像素材を提供するサービスがあったとします。
下の二つのプランがあった場合、ユーザーは基本的に無料のプランを選ぶ傾向にあります。
ユーザーの内、有料プランを選ぶユーザーはひとにぎりなので、収益を上げにくく、価格を上げざるを得ない状態になり悪循環に陥る可能性もあります。
<a href="/uploads-archive/2015/01/center_effect4.gif"><img decoding="async" loading="lazy" class="alignnone wp-image-6658" src="/uploads-archive/2015/01/center_effect4.gif" alt="center_effect4" width="630" height="231" /></a>
しかし 下のようにさらに高額なプランを作った場合はどうでしょうか。
２つしかプランがなかった時に比べて格段に有料プランを選ぶユーザーの数が増える傾向にあると言われています。
<img decoding="async" loading="lazy" class="alignnone wp-image-6644" src="/uploads-archive/2015/01/center_effect2.gif" alt="center_effect2" width="621" height="233" />
昔から日本人は松竹梅の竹を選ぶと言われますが、日本人に限らず海外でも同じ傾向があるようです。

ECサイトのデザインに役立つ行動心理

In terms of creating a website (corporate or personal) it do not have to be coded from scratch anymore. Thanks to many kind and generous designers / developers, high quality web templates are distributed freely over the Internet.
There are tonnes of templates sites out there, that makes searching for a free yet high quality templates hard and tedious, so I attempted to collect and showcase you some of really good ones. Here, I present 8 High Quality Free Web Templates and Layouts.
I&#8217;m sure you&#8217;ll a find a gem or two that will absolutely ease your workflow!
&nbsp;
<a href="https://dribbble.com/shots/1819180-Free-Dashboard-Ecommerce-Admin">ECommerce Dashboard Template</a>  (PSD).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_23.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6614 " src="/uploads-archive/2015/01/monthly_freebie_dc_23.jpg" alt="monthly_freebie_dc_23" width="660" height="260" /></a>
&nbsp;
<a href="https://www.behance.net/gallery/21521941/Creative-Agency-Web-Template">Creative Agency Web Template</a>  (PSD).
<a href="/uploads-archive/2015/01/Screen-Shot-2015-01-13-at-16.00.36.png"><img decoding="async" loading="lazy" class="alignnone wp-image-6626 " src="/uploads-archive/2015/01/Screen-Shot-2015-01-13-at-16.00.36-1024x582.png" alt="Screen Shot 2015-01-13 at 16.00.36" width="663" height="372" /></a>
<a href="http://graphicsbay.com/item/bj-rn-multipurpose-landingpage/380">BJÖRN Multipurpose Landing Page</a>  (PSD).
<img decoding="async" loading="lazy" class="alignnone wp-image-6613 " src="/uploads-archive/2015/01/monthly_freebie_dc_20.jpg" alt="monthly_freebie_dc_20" width="660" height="266" srcset="/uploads-archive/2015/01/monthly_freebie_dc_20-300x120.jpg 300w, /uploads-archive/2015/01/monthly_freebie_dc_20-228x91.jpg 228w" sizes="(max-width: 660px) 100vw, 660px" />
<a href="https://dribbble.com/shots/1802406-Freebie-Moderno-Creative-Simple-Portfolio-Page">Moderno Creative Simple Portfolio Page</a>  (PSD).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_24.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6615 " src="/uploads-archive/2015/01/monthly_freebie_dc_24.jpg" alt="monthly_freebie_dc_24" width="658" height="278" /></a>
<a href="http://www.mightydeals.com/deal/free-resume-template-by-fernando-bez.html">Resume Template</a>  (PSD).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_21.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6616 " src="/uploads-archive/2015/01/monthly_freebie_dc_21.jpg" alt="monthly_freebie_dc_21" width="655" height="340" /></a>
<a href="http://www.robertbrodziak.com/en/free-wordpress-themes/daily-theme/">Daily</a>  (WordPress Theme).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_25.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6617 " src="/uploads-archive/2015/01/monthly_freebie_dc_25.jpg" alt="monthly_freebie_dc_25" width="655" height="263" srcset="/uploads-archive/2015/01/monthly_freebie_dc_25.jpg 750w, /uploads-archive/2015/01/monthly_freebie_dc_25-300x120.jpg 300w, /uploads-archive/2015/01/monthly_freebie_dc_25-228x91.jpg 228w" sizes="(max-width: 655px) 100vw, 655px" /></a>
<a href="http://www.daniel-klose.com/online-services/life-is-good-wordpress-theme/">Life Is Good</a>  (WordPress Theme).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_26.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6618 " src="/uploads-archive/2015/01/monthly_freebie_dc_26.jpg" alt="monthly_freebie_dc_26" width="655" height="242" /></a>
<a href="http://themehybrid.com/themes/yarn">Yarn</a>  (WordPress Theme).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_27.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6619 " src="/uploads-archive/2015/01/monthly_freebie_dc_27.jpg" alt="monthly_freebie_dc_27" width="653" height="279" /></a>
<a href="https://themeisle.com/themes/zerif-lite/">Zerif Lite</a>  (WordPress Theme).
<a href="/uploads-archive/2015/01/monthly_freebie_dc_28.jpg"><img decoding="async" loading="lazy" class="alignnone wp-image-6620 " src="/uploads-archive/2015/01/monthly_freebie_dc_28.jpg" alt="monthly_freebie_dc_28" width="649" height="273" /></a>
&nbsp;

Free Web Templates &#038; Themes

取り上げるのが少し遅くなってしまいましたが、経済産業省が推し進める「クールジャパン」プロジェクトの一環ということで、 
「クールジャパンストア」が先月オープンしていました。
<a href="https://iroya.jp/specials/cool-japan" target="_blank">https://iroya.jp/specials/cool-japan</a>
紹介記事
<a href="http://www.fashionsnap.com/news/2014-12-04/iroya-cooljapan/" target="_blank">http://www.fashionsnap.com/news/2014-12-04/iroya-cooljapan/</a>
<h2>「クールジャパンストア」の特徴</h2>
<ul>
<li>「IROYA」というECサイトの中に一つのカテゴリーとして登場。</li>
<li>日本の「伝統色」といわれる「葡萄⾊（えび）」「墨⾊」などの商品を展開</li>
<li>オムニチャネルとして、実店舗（2014年12月28日まで）でも販売</li>
<li>残念ながら英語表記や海外発送はない</li>
</ul>
<h2>その他クールジャパンのサイト</h2>
<h3>日本ユニシス</h3>
JCRAFTS
<a href="http://www.jcrafts.com/jp/shop/" target="_blank">http://www.jcrafts.com/jp/shop/</a>
<h3>アレックス株式会社</h3>
http://www.alexcious.com/ja/
<h2>まとめ</h2>
このような伝統工芸品を海外向けに販売するサイトは数年前からウォッチを続けておりますが、未だ成功例のような話を聞いたことがありません。
この「クールジャパンストア」越境ECの成功事例となることを願ってやみません。
&nbsp;
&nbsp;
&nbsp;

経済産業省が推し進める「クールジャパンストア」

以前(2014年12月9日)に<a href="/officer/%E5%BA%83%E3%81%8C%E3%82%8B%E5%80%8B%E4%BA%BA%E9%96%93%E6%B1%BA%E6%B8%88.html" target="_blank">広がる個人間決済</a>という記事を書いたが
そのちょうど1週間後LINE Payがローンチされた。
この手のサービスは海外で話題になってしばらくしてから日本国内で類似サービスが始まるがそのスピードには驚いた。
LINE Payは、ご存知の方も多いと思うが、個人間で決済(送金)ができたり、
決済手段としても利用できるサービスだ。
既存のLINEアプリの機能として追加されている。
詳しくはこちら
<a href="http://jp.techcrunch.com/2014/12/16/jp20141216line-pay/" target="_blank"> http://jp.techcrunch.com/2014/12/16/jp20141216line-pay/</a>
&nbsp;
また、さらにすごいことに、昨日(2015年1月6日)にLINEタクシーがローンチされた。
これはUberと同類のサービスだが、LINE Payでのクレジットカード決済に限定することで
両サービスの相乗効果を狙っている模様。
&nbsp;
個人的には非常にうまい連携方法であり、LINE Payの利用も一気に加速するのではないかと思う。
&nbsp;
多くのユーザーを抱えるLINEだが、それに決済という強い武器が加われば、非常に収益性の高い、言ってみればどんなサービスでもできる会社になる。
今までの流れはサービス → 決済だったが、これは逆パターンであるところが個人的には興味深い。
&nbsp;
まずはLINE Payが日常の決済手段として浸透することが必須だが、そのへんを注目しておきたいと思う。
次はぐるなびと提携して予約+事前支払いできるサービスなどが出るのではないかと個人的には予想している

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧

2015/01/27

2015/01/27

2015/01/27

2015/01/27

2015/01/22

2015/01/22

2015/01/22

2015/01/21

2015/01/21

2015/01/14

2015/01/14

2015/01/14

2015/01/14

2015/01/14

2015/01/13

2015/01/08

2015/01/08

2015/01/08