【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

2014年の振り返り!モバイルファーストラボで今年最も読まれた記事ベスト10を発表!

2014年の振り返り!モバイルファーストラボで今年最も読まれた記事ベスト10を発表!

モバイルファーストな2014年を振り返ってみる

いつもモバイルファーストマーケティングラボをご覧いただき、ありがとうございます。

2014年も残り僅かとなりました。ECサイト運営をされておられる方は年末商戦のまっただ中でお忙しいとは思います。

さて、この1年を振り返りますとモバイルシフトがより大きく進んだ1年となりました。

参考:スマートフォン利用が3割増、PC利用は2ケタ減でモバイルシフトが鮮明に

今回はそんな2014年を振り返り、総括としてモバイルファーストマーケティングラボにて最も読まれた記事ベスト10を発表したいと思います。

10位 レスポンシブな背景画像にコンテンツを重ねて表示させる3つの方法

https://www.aiship.jp/knowhow/archives/16956

コンテンツを重ねる方法

フルスクリーン画像を使ったサイトデザインの人気が高まるにつれ、背景画像上にコンテンツを配置するサイトが増えてきました。

この配置でレスポンシブ化する際に幾分かの調整が必要になりますので、その方法をメリット・デメリット交えてご紹介しています。

9位 レスポンシブ化で見えた数値の効果改善!「三愛水着楽園」リニューアル直後の検証レポート

https://www.aiship.jp/knowhow/archives/17606

三愛様検証

今春、レスポンシブなECサイトへとリニューアルを遂げた「三愛水着」様。そのリニューアル前後の数字で見えてきた、数値の効果や改善箇所についてまとめてみました。

8位 レスポンシブ対応JQueryプラグインでスライダー入門!

https://www.aiship.jp/knowhow/archives/16358

Slider

html/CSS/JavascriptやjQueryを勉強し始めた方でも使える、Flexslider2を使ってレスポンシブWebデザインに対応した画像スライダーを作る方法をご紹介しました。

7位 多デバイス化で考えるレスポンシブWebデザインのブレイクポイント

https://www.aiship.jp/knowhow/archives/13899

ブレイクポイント

考えれば考えるほど、デバイス別のブレイクポイントは複雑化しがちです。

そこでブレイクポイントを『メジャーブレイクポイント』と『マイナーブレイクポイント』とに分け、より分かりやすく簡単にブレイクポイントの設定ができる考え方について記事にしています。

6位 【保存版】レスポンシブWEBデザインのディレクションワークフロー

https://www.aiship.jp/knowhow/archives/14539

ディレクション

レスポンシブなECサイトを手がけてきたディレクターが、実体験を元にレスポンシブECサイトのディレクションワークフローを大公開。

アジャイル型で作りながら変化させる方法はレスポンシブではよく採用されていますが、ウォーターフローでワイヤーフレームをきっちりと作った上で後工程に入ることで後々の出戻り作業も少なくて済みます。

5位 bxsliderのサムネイル画像枚数を自由に変更できるようにする方法

https://www.aiship.jp/knowhow/archives/15580

ボックススライダー

bxsliderといえば、カスタマイズ性の非常に高いスライダー系プラグインで有名です。レスポンシブ対応やページャー・サムネイル画像のカスタマイズなどにも対応しており、「スライドショーが欲しい」と言われるとまず思い浮かぶプラグインになっています。

そんなbxsliderを使用したのサイト管理をより便利にする方法をご紹介。「サムネイル画像を使用していて、定期的にスライダー枚数を増減させたい」という方は必見です。

4位 レスポンシブWEBデザインの基本 max-widthで中央揃えレイアウト

https://www.aiship.jp/knowhow/archives/16724

中央レイアウト

レスポンシブWebデザインの基本的な見せ方として、サイト全体のレイアウトをセンタリング(中央寄せ)する方法をご紹介します。

3位 レスポンシブサイトでパララックス効果をCSSだけで実装する方法

https://www.aiship.jp/knowhow/archives/15843

CSSだけでパララックス

最近、LP(ランディングページ)などでパララックス効果(視差効果)を取り入れたサイトを目にします。

Webサイトにパララックス効果を持たせるには、javascriptによる実装がよく使われますが、ご紹介する方法は、javascriptは一切使わずにCSSだけで、しかもレスポンシブサイトにおいても簡単にパララックス効果を実装できてしまう、そんな方法です。

2位 【サンプル有】レスポンシブなグローバルナビの作り方3選

https://www.aiship.jp/knowhow/archives/14535

レスポンシブなグローバルナビ

レスポンシブサイトを構築する際、意外と引っかかるのが「グローバルナビ」

ページの横幅(キャンバス)いっぱいに表示させることが多い関係上、キャンバス幅が一定でなくなるレスポンシブWebデザインでは一筋縄ではいきません。

慣れない内は考えるのが面倒で「スマホ専用のナビゲーションを別途用意」したり、「グローバルナビをまるごと非表示にしてしまう」ということをされた方の少なくないのではないかと思います。

記事では「レスポンシブWebデザインで使えるグローバルナビ」をまとめています。

1位 レスポンシブWebデザインで成功するUI/UXのポイント5つ

https://www.aiship.jp/knowhow/archives/14719

UI/UX

レスポンシブWebデザインでサイト構築だけでなく、「モバイルファースト」が本格的に浸透してきた世界でのUI/UXを考えます。

今までのWeb構築で「当たり前」や「こうすべき」と思っていた感覚とは少し異なった設計でサイトを構築しなければなりません。

gunosyなどでバズったので、比較的多くのいいね!をいただくことができました。

最後に

いかがでしたでしょうか。

このブログのタイトルである「モバイルファースト」という言葉が出てきて早5年が経ちます。GoogleやAmazon、楽天などの大手サイトではPCのアクセスが大きく減少し、逆にスマートフォンのアクセスが3割り以上増えるなど市場のモバイル化は一層進みました。

ユーザーがよりモバイルで使いやすく、満足度の高いサイトを運営者様が提供できるように情報をお届けし、サポートをしていくのが私たちの役割だと考えています。

2015年もブログをお読みいただいているサイト運営者の方や経営者の方、クリエイターの方々に取って、より良い情報をお届け出来るよう今後も精進してまいります。

引き続き、よろしくお願いします。

上林

”スマホで売れる”ためには必須の「レスポンシブECサイト」とは?

CTA-IMAGE 2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。
また、検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。 そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。

・レスポンシブECサイトがなぜ今選ばれるのか
・これまでのECサイトの課題とは何なのか
・どのようにすれば解決できるのか

といったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。
ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。
機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+