• このエントリーをはてなブックマークに追加
  • このエントリーをはてなブックマークに追加

これまでご紹介してきたレスポンシブECサイトを構築する際に役立つ情報や、弊社が実際にレスポンシブECサイトを構築する際に参考にしている情報・書籍をまとめてみました。

初めてレスポンシブサイトを構築される方、これまでのレスポンシブサイトを見直してより効果的なサイトにしようと検討されている方は是非ご参考ください。

レスポンシブ書籍関連

まずはレスポンシブサイトを構築する際に参考になる書籍を3つご紹介。レスポンシブサイト構築の基本の「キ」から、テクニック的なものまで掲載されています。

レスポンシブ・ウェブデザイン標準ガイド あらゆるデバイスに対応するウェブデザインの手法

レスポンシブWebデザイン構築の基本的な情報が書かれた書籍です。構築方法やその手順、初心者が参考になるポイントがたくさん書かれています。実は私も初めはこの本を読んで勉強しました。

モダンWeb

量は多くありませんが、レスポンシブWebデザインの根幹でもある、メディアクエリに関することの基本が書かれています。その他最新のWeb構築技術についても書いているので、持っていて損は無い一冊です。

Web制作者のためのCSS設計の教科書 モダンWeb開発に欠かせない「修正しやすいCSS」の設計手法

CSS設計の専門書。レスポンシブ専門ではないですが、モダンな構築ワークフローや、CSS設計の基礎、スタイルガイドの詳細が紹介されています。より効率的に保守運用ができるクラス設計の思想まで踏み込んだ内容なので、少し上級者よりかもしれません。

レスポンシブの事例まとめサイト

次に国内、海外のレスポンシブサイトを集めた事例をまとめたサイトをご紹介します。ワイヤーフレームやデザイン、構成の参考になる点がたくさんあり、常にチェックをしておきたいサイトです。

国内のレスポンシブサイト事例を多く掲載

RWDJP

RESPONSIVE WEB DESIGN JP

ジャンルを問わず日本国内のレスポンシブサイトを多く掲載しており、更新頻度も高く最新情報を得るには持ってこいのサイトです。デザイン的にも優れているサイトが多く、参考になるところがたくさんあります。

海外のレスポンシブサイト事例

MQ

Media Queries

こちらは海外のレスポンシブサイトの事例集。更新頻度はそこまで高くはないですが、デザイン性や日本ではあまり見ない構成をしたレスポンシブサイトがあり、新しい視点でサイト構築が出来そうです。

行き詰った時などに眺めているとヒントが見えるかもしれません。

レスポンシブECサイト構築準備や速度向上

レスポンシブECサイトを構築する前や、その準備で確認しておくべき事や構築後の運用について解説しました。レスポンシブWebデザインでよく言われる「速度問題」についての改善方法もご紹介しています。

準備や運用について

レスポンシブEC構築のポイント後編

レスポンシブECサイトを作る前に「何をすればいいの?」「普通のECサイトの準備と何が違うの?」という疑問に応えます。

レスポンシブECサイトを成功に導くポイント(準備〜コーディング編)
レスポンシブECサイトを成功に導くポイント(SEO〜集客編)

レスポンシブサイトで読込速度を向上させるポイントについて

スピード

レスポンシブECサイトの読込速度を向上させるポイントについてご紹介します。どれも工数はそこまでかかるものではないので、簡単なものから是非実践してください!

<決定版>レスポンシブECサイトの読込速度を上げるコーディング方法8選
レスポンシブECサイトの読込速度を上げる方法7選 後編

その他レスポンシブサイト制作の際のポイント

レスポンシブなディレクション

その他のレスポンシブECサイトを制作する上で、必ずチェックしておきたいポイントをまとめています。特にディレクションのワークフローはこれまでのECサイト構築とは異なる部分もあるので、要チェックです。

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

【追記あり】ウェブサイトをモバイル対応する前にウェブ担当者が必ずチェックすべき項目8選

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

レスポンシブサイト構築でディレクターが注意する7つのポイント

終わりに

いかがでしたでしょうか。少し駆け足気味にご紹介してしまいましたが、どれもレスポンシブサイトを構築する際には重要なポイントばかりです。特にこれまで通りの構築方法でレスポンシブサイトを構築すると少し戸惑うかもしれません。

しかし初めにきっちりと基礎を固めてしまえば、レスポンシブサイトはマルチデバイスでの運用に持ってこいの手法です。スマホやタブレット、PCをそれぞれ同じソースコードで対応させることが出来るので運用工数をぐっと抑えることが出来ます。

これからレスポンシブECサイトを構築される方や、もっと効果的なレスポンシブECサイトを構築したい方は、どんなことでもお気軽にご相談ください!相談・見積もりは無料です。

aishipRサービスのお問い合わせ