スマートフォンサイト制作

スマートフォンサイト制作

近年のスマートフォンやタブレット端末の普及に伴い、サイトによってはアクセスの30%~50%が携帯端末からのアクセスといったケースも増えてきています。この状況下、スマホからページにアクセスしたときに、表示されたページがスマ—トフォンに対応している場合と未対応の場合、滞在時間に約3倍もの差があるという調査報告もあります。1日あたりの平均Web閲覧時間が長いというスマートフォンユーザーの特性から考えても、スマートフォンをはじめとするマルチデバイスへの対応は急務といえるでしょう。


3つの対応方法

1. スマ—トフォン/タブレット用サイトを別に制作

スマートフォンをはじめ、多様化するデバイスに合わせたサイトやページを、PC用サイトとは別に作成する方法です。他の手法と比べ、デザインの自由度も高く、デバイスごとに提供する情報、表現を変えることができます。つまり、デバイスごとに異なるユーザニーズを考慮した、マルチデバイス対応が可能です。

メリット

・情報最適化が可能:デバイスごとにページを作成するため、各デバイスごとのユーザの利用シーンに最適化された情報提供が可能です。
・古いブラウザにも対応可能:個別にページを作成するため、IE6などの古いブラウザにも対応可能です。
・効果を見ながら拡張できる:最低限必要なページ数、情報量からスタートすることができるため、各デバイスでの効果をみながら拡張することができます。

デメリット

・運用の負担が増える:PCサイトとは別に、サイトが増えるのと同じことになるため、投稿や修正の際に、手間が管理の手間が増えます。また、修正が発生した場合、デバイスの数だけ、複数ページで異なる箇所の修正が必要になります。
・コストがかかる:デバイスごとにサイトやページを作成するため、制作や管理にコストがかかります。
・URLが別になる場合があります。これはSEO的にはあまりよいとはいえません。

こんな方にオススメ

PCユーザーよりもスマートフォンユーザーの方が優先度が高い
運用に手間がかかっても大丈夫
スマホ、タブレット等に対応する場合、予算はある程度準備できる

2. レスポンシブWebデザインによる対応

PC用とスマートフォン用のサイトを分けることなく、ひとつのソースでどちらにも対応できるようにする方法です。ブラウザの幅を自動的に判断し、最適化されたデザインで表示します。コモデザインのサイトも、このレスポンシブWebデザインの手法で作られています。試しに、ブラウザの幅を狭めたり広げたりしてみてください。画面の幅に応じてレイアウトが変わっていくことがご確認いただけるかと思います。Googleも公式に推奨している手法で、海外では主流になりつつあります。

メリット

・運用・更新が効率的:ひとつのHTMLファイル(ワンソース)で管理するため、1つの更新で各デバイスに全て反映されるため、運用・更新が効率的です。
・SEOに効果的:検索エンジンに対して特別な設定を行う必要がありません。また、Googleも公式にこの手法を推奨しており、URLがひとつのためSEOに効果的であると言われています。
・運用が容易:PC版サイトもスマホ版サイトも1つのソースコードで実現しますので、何か修正をしたい場合でも1枚のファイルを修正すればよいので、メンテナンス性に優れています。

デメリット

・リニューアルが必要:ページの構造や設計がまったく異なるため、運用中のサイトで対応できない場合、リニューアルが必要になります。
・スマートフォンでの表示がやや重くなる:レスポンシブWebデザインでは、PCサイトのHTMLソースを利用します。このPC用の画像やCSSを読み込むため、スマートフォンでの表示が重くなる可能性があります。
・古いブラウザに対応できない:HTMLの新しい技術を利用して実装するため、IE6など古いブラウザに対応できません。

こんな方にオススメ

PCユーザーもスマートフォンユーザーもどちらも大事にしたい
運用・更新を効率的に行いたい
SEOに強いサイトにしたい
サイト全体を作り直すための時間的余裕はある

3. プラットフォーム変換による対応(外部サービスのご紹介)

PCサイト向けに制作したコンテンツのソースコードを、変換エンジンと呼ばれるアプリケーションを用いて解析し、スマートフォンやタブレット端末などの各デバイス向けに自動変換させるます。導入が容易で、短納期でマルチデバイスへの対応が可能です。しかし、現存するサイトの完成度が問題になり、デバイスごとの細かな制御はできません。「とにかく早くマルチデバイス対応をさせたい!」という方には一つの選択肢となるでしょう。
※コモデザインではこのサービスを行っておりません。外部サービスのご紹介となります。

メリット

・導入が容易:現存するサイトに一切手を加える必要がないため、運用中のサイトへ比較的容易に導入することができ、短納期でマルチデバイスへの対応が可能です。
・管理や更新がラク:現存するサイトのみ更新を行えば、自動的に各デバイス向けサイトも更新されます。
・古いブラウザにも対応可能:デバイスごとに変換ルールを変更できるため、IE6などの古いブラウザにも対応できます。

デメリット

・デバイスごとの細かな制御ができない:一定の変換ルールで現存するサイトが変換されるため、表示におけるデバイスごとの細かな制御ができません。そのため、スマートフォンやタブレット端末などの場合、文字が読みにくい、操作がしにくいなど、ユーザビリティの問題が生じることがあります。
・現存するサイトの完成度が問題になる:現存するサイトのデザインルールが統一されていないと、個別の対応が必要となり、コスト・開発期間が増えることがあります。
・ランニングコスト増加に注意が必要:アクセス数で従量課金するサービスが多いため、利用するユーザが増えるとランニングコストも増加していきます。

こんな方にオススメ

とにかく急いでスマートフォンユーザーに対応させたい
年間のランニングコストも十分確保できる
運用の手間はかけたくない


料金

項目数量料金の目安内容
スマホ専用サイト制作1サイト200,000円〜トップページ+5ページまで
下層ページ追加
(スマホ専用)
1ページ5,000円〜
レスポンシブWebデザインサイト制作1サイト200,000円〜トップページ+5ページまで
下層ページ追加
(レスポンシブ)
1ページ¥5,000〜機能の追加は別途

※掲載料金はすべて税別価格です。
※この制作料金は2014年4月現在のものです。予告なく変更される場合がございますので、ご了承ください。


サービスのながれ

1.お仕事のご相談/お問い合わせ

お問い合わせは、当サイトのフォームまたはお電話やファックスでお受けしております。ご予算・ご希望のプラン・ご希望の納期やご要望があれば合わせてお知らせください。

2.ヒアリング(打ち合わせ)

東京近郊のお客様であれば、なるべく直接お会いしてお話を伺います。遠方のお客様の場合は、電話やメール、スカイプでヒアリングをさせていただきます。

3.お見積もり

ヒアリングの内容をもとに、お客様のビジネスに最適なスマートフォンへの対応方法と制作内容を、見積もりと一緒にご提案させていただきます。

4. ご契約・着手金のお支払い

ご提案内容とお見積金額にご了解いただけたらご契約となります。着手金としてお見積金額の半額を指定口座にお振り込みください。

5. 企画・構成案のご提出

ホームページの構成やおおまかなレイアウト、システムの仕様をご提案いたします。

6. デザインのご提案、調整

打ち合わせで得た情報を基に弊社でデザインいたします。弊社が作成したデザインとお客様とのイメージ、ご意見をすり合わせ、よりクオリティーの高い物へとしていきます。
※原稿や画像は基本的にお客様でご用意願います。

7. コーディング

でき上がったデザインをスマートフォンのブラウザで最適に表示されるようコーディングします。

8. ホームページ仮アップ

弊社サーバーにホームページを仮アップします。お客様には実際に画面でご覧いただき動作確認をお願いいたします。

9. 完成・納品

動作確認終了後、制作完成です。ご指定のサーバにアップされた状態で納品とさせていただきます。

10. お支払い

ホームページの公開の翌月末までに、弊社指定の口座に残金のお振込みをお願いいたします。

11. アフターケア

更新方法のご説明や、ホームページの運用方法をアドバイスさせていただきます。公開後も何かお困りのことがあれば、いつでもご相談ください。