モバイルフレンドリー(スマートフォン最適化)


モバイルフレンドリー ホームページ(ウェブサイト)のスマートフォン表示最適化

モバイルフレンドリー(スマートフォン最適化)とは、「お持ちのホームページ(ウェブサイト)がスマートフォン表示に最適化されている」ということを示します。

「モバイルフレンドリー」のポイントはスマートフォンなどのモバイル端末からの表示の際にストレスを感じずにホームページ(ウェブサイト)を閲覧できるかどうかという点ですが、このモバイルフレンドリーの要素は、「サイトのレイアウト」や「リンク同士の距離」など、ユーザーの閲覧性と操作性といった点が重要になります。

スマホ検索時の検索結果上位のための「モバイルSEO」として、そして、何よりスマートフォンからウェブサイト・ホームページへとアクセスするユーザーのために、モバイルユーザーへの配慮が必要になってきました。

スマートフォンが普及する前に制作されたウェブサイト・ホームページは、モバイルフレンドリーに対応していないケースがほとんどです。

株式会社ファンフェアファンファーレでは、モバイルフレンドリーに対応していないホームページ(ウェブサイト)をお持ちの方向けに、静的HTMLサイトやWordPressテーマなどをモバイルフレンドリーに対応させていただくサイトカスタマイズサービスを提供しております。

モバイルフレンドリー価格表 (モバイルフレンドリー化の料金表へ移動します)

目次

モバイルフレンドリーの必要性

モバイルフレンドリーの必要性

近年、スマートフォンの普及率が急増し、iPhoneやAndroid端末などのスマートフォンやiPadなどのタブレットからのホームページ(ウェブサイト)が閲覧される機会が増えてきました。

スマートフォンからのアクセスの際に、モバイルユーザーの閲覧性に配慮するスマホ最適化、「モバイルフレンドリー」の必要性は、サイトの閲覧性や操作性の向上によるホームページ(ウェブサイト)の離脱率を防ぐことがまず第一だと考えられます。

そして、そのスマホユーザーへの配慮そのものが、スマートフォンからのGoogle、Yahoo!検索において、検索結果に影響を及ぼすというSEO・モバイルSEOの視点からの必要性も同時に兼ね揃えています。

SEOのひとつの基準としての「サイトのスマホ最適化」

SEOの基準としてのモバイルフレンドリー

スマートフォンの普及と同時に検索エンジン利用者の数も、パソコンよりもスマートフォンからの利用が上回ったという事を受けて、Googleなどの検索エンジン側も、「ホームページ(ウェブサイト)がスマートフォン表示に最適化されているかどうか?」という点を検索結果の順位に影響を与えるという旨が発表されています。

すなわち、「モバイルフレンドリー」がSEOのひとつの基準となっています。特にスマートフォンからの検索の際には、「スマホ対応」がモバイルSEOとしての意味を持つようになりました。

スマートフォンの普及・スマートフォンからのウェブ検索の機会が増大し、ユーザーに選ばれるサイト、そして検索エンジンに選ばれるサイトの条件として、モバイルフレンドリー対応、モバイルフレンドリー対策の必要性が重要になってきました。

スマホに最適化されたモバイルフレンドリーサイトは、スマートフォンからの検索結果で「スマホ対応」と表示されます。

モバイルフレンドリーアップデートの特徴

モバイルフレンドリーアップデートの特徴

こうしたモバイルフレンドリーとSEO・検索順位の関係として、モバイルフレンドリーアップデートの特徴は次のようなものです。

  • モバイルフレンドリーサイトかどうかがSEOの基準として適用される
  • ホームページ全体ではなく、それぞれのページ単位が個別に対象となる
  • すべてのWeb検索ではなく、スマートフォンでの検索順位のみ影響する

モバイルフレンドリーテスト

所有するホームページ(ウェブサイト)が検索エンジンから見て「スマホ対応」であるか否かについて、以前は、Google社のモバイルフレンドリーテストツールで「モバイルフレンドリーサイト」であるかどうかを解析することができましたが、2023年12月よりモバイルフレンドリーテストツールの提供は終了となりました。

(参考イメージ:モバイルフレンドリーテストに合格していた場合、次のような結果が表示されていました)

モバイルフレンドリーテストに合格

モバイルフレンドリーテストに合格(Google社提供のテストツールの結果)

また、以前はモバイルフレンドリー対応(対策済)のウェブサイト・ホームページは、スマートフォンからの検索結果(SERPs)に「スマホ対応」という表示が出ていました(現在は表示されません)。

こうしたモバイルフレンドリーかどうかを確認するテストは、現在サーチコンソールやPageSpeed Insights、Google Lighthouseなどでも行うことができます。

「モバイルフレンドリーではありません」の表示

なお、ホームページのウェブマスターとしてのGoogleアカウントでログイン中にWeb検索を行った場合、自分の管理するホームページがモバイルフレンドリー未対応だった場合は、検索結果に「モバイルフレンドリーではありません」という警告文が表示されます。

ウェブユーザーの利便性と検索結果への影響

スマホ・モバイル(スマートフォンや携帯電話、タブレットPC)での表示に適したホームページ(ウェブサイト)の構造は、ウェブユーザーの利便性への影響だけでなく、特にスマートフォン・タブレットなどからの検索結果(SafariやChromeなどのブラウザアプリからの検索)に影響を与えます。

顧客層にモバイルユーザーが多いと推測される業種のウェブサイト・ホームページであれば、スマホ検索時の機会損失を防ぐために、モバイルフレンドリーの必要性は、さらに高まります。

モバイルフレンドリーの基準

モバイルフレンドリーの基準

モバイルフレンドリーの基準は、「レスポンシブデザイン(レスポンシブレイアウト)によって、スマートフォンなどからのアクセス時にウェブサイトのレイアウトを単純化して読みやすくする」ということをはじめ、リンク同士の距離が近すぎない、画面を引き伸ばさなくても画像の中の文字が読める程度に大きく表示されている、など様々なチェックポイントがあります。

サイトレイアウトが「スマートフォンの画面幅に適している」という点がまず第一ですが、合わせて、サイトユーザーの誤操作を防ぐためのリンク距離の配慮などが基本です。

さらに、レイアウトをスマートフォンに合わせても、サイト内に設置された画像内部の文字(画像に埋め込まれた文字)が小さくて読めないというケースも想定されます。

  • レスポンシブデザイン(サイトレイアウトがスマートフォンに適合)
  • 誤操作しにくいリンク設置(リンクの距離が適切)
  • 文字が読みやすい

モバイルフレンドリーテストでの項目

モバイルフレンドリーテストでの項目

以下の項目は、モバイルフレンドリーテストにおいて、モバイルフレンドリーサイトとして不合格になる場合の代表的なエラー項目です。

  1. 「テキストが小さすぎて読めません」 → ホームページのフォントサイズが小さすぎるなど。
  2. 「リンク同士が近すぎます」 → 誤タップの原因になります。
  3. 「モバイル用viewportが設定されていません」 ビューポートが適切に設定されていない。
  4. 「コンテンツの幅が画面の幅を超えています」 スマートフォン表示ページがスマートフォンの画面幅サイズを超え、CSSでの適切なサイズ変更やビューポートに設定が適切対応ではないなど

機種のデバイスサイズ変更による未対応化

また近年、スマートフォンのデバイスサイズ(画面のサイズ)が変更されることがあり、「今まで使用していたレスポンシブテーマ・レスポンシブ用CSSがiPhone4やiPhone5には対応していたものの、iPhone6やiPhone6Plusには対応していない」といった場合にも、レスポンシブの調整(CSS編集)を承っております。

モバイルフレンドリー化(スマートフォン最適化)するためのカスタマイズ

モバイルフレンドリー化(スマートフォン最適化)するためのカスタマイズ

モバイルフレンドリーテストに合格するためには、ホームページ(ウェブサイト)の構造がスマートフォンに最適化されている必要があります。

「スマホ最適」のポイントは「片手で操作していても使いやすいウェブサイトかどうか」という点です。

モバイルフレンドリー化のカスタマイズは、既存のホームページ(ウェブサイト)をスマホからのアクセスの際に、左右に分割されたレイアウトを上下分割にするなどのカスタマイズが一般的ですが、各所に配置されたリンク同士の距離や、「コンテンツ部分」の中の「テーブル(表)」などもレイアウト変更する必要がある場合があります。

画像で制作された横並びメニューの場合

画像で制作された横並びメニュー モバイルフレンドリー

例えば、横並びメニューがスマートフォンの小さい画面で表示されると、メニュー項目が画像だったとき縮小表示されるため、「文字が小さすぎて読めない」という事が起こります。

パソコンのブラウザサイズに合わせて制作された「テキストが埋め込まれた画像」が、横並びメニューのままスマートフォンの横幅まで縮小された時、引き伸ばさなければ読めないほどに縮小されてしまうケースがあります。

コンテンツ部分とサイドバー部分

コンテンツ部分 サイドバー部分 モバイルフレンドリー

また、ページ全体のレイアウトが本文の示された「コンテンツ部分」とサイドバーのメニューリストの構造になって場合、レイアウトがキチキチすぎて、サイドバーに何があるのかわからなかったり、画面を引き伸ばして見る必要が出てきます。

モバイルフレンドリー、スマホ最適化は、検索エンジンのためというよりも、それだけでなく何より「見る人のため」。

片手で操作していてもストレス無く情報を読むことができるウェブサイトの構造は、何よりもウェブサイトを閲覧しているユーザーの利便性確保になります。

スマホ表示時の理想的なレイアウト構造

スマホ表示時理想的レイアウト構造 モバイルフレンドリー

理想的なウェブサイト・ホームページとしては「画面を引き延ばすためにもう片方の手でスマートフォンを支えなくても良いようにする」という構造が理想的です。

「では、わざわざスマートフォン用のサイトをもうひとつ作れば良いのか?」

いえいえ、ご心配なく。

スマートフォンからアクセスされた時にはパソコンで見るときと少し違ったレイアウトで表示する、などのちょっとしたカスタマイズで実装することができます。

スマホ表示用に少画像を新規制作する必要がある場合がありますが、大半のホームページ(ウェブサイト)は、少しのカスタマイズでモバイルフレンドリー化することができます。

ウェブサイトユーザーの利便性向上、そしてSEO(検索エンジン最適化)のため、「スマホ対応」のモバイルフレンドリー対策は、良いウェブサイトの必須条件になります。

ウェブサイトのスマートフォン表示最適化のポイント

ウェブサイトのスマートフォン表示最適化のポイント

ホームページ(ウェブサイト)のモバイルフレンドリー化(スマートフォン表示最適化)のポイントはレイアウト調整だけではありません。

「モバイルフレンドリー」は、「サイトのレスポンシブ化」といった、レイアウト調整が大枠にはなりますが、リンク距離やテーブルレイアウトなど、細かいポイントまで配慮すると、さらにスマホユーザーのユーザビリティを向上させることができます。

ウェブサイト(ホームページ)のレスポンシブ化

ホームページ(ウェブサイト)のレスポンシブ化

ホームページ制作 京都のWeb制作会社(ホームページ制作会社)株式会社ファンフェアファンファーレでは、モバイルフレンドリーに対応していないホームページ(ウェブサイト)をお持ちの方向けに、静的HTMLサイトやモバイルフレンドリー未対応のWordPressテーマなどを「モバイルフレンドリー対応サイトへ」と変更させていただくサイトカスタマイズサービスを提供しております。このサービスは、ホームページ(ウェブサイト)のレスポンシブ化が基本となります。

「ホームページ(ウェブサイト)のレスポンシブ化ってどういうこと?」

「レスポンシブウェブデザインは通常のウェブデザインとどう違うの?」

「今のホームページをレスポンシブウェブデザインに変更できるの?」

そんな疑問をお持ちの方も多いと思います。

ここでは、モバイルフレンドリーの一つの要素である「ホームページ(ウェブサイト)のレスポンシブ化」をお伝えさせていただきます。

ホームページ(ウェブサイト)のレスポンシブデザイン

ホームページ(ウェブサイト)のレスポンシブデザイン

「レスポンシブ」には、「反応がよいさま」という意味があります。

ホームページ(ウェブサイト)のレスポンシブデザイン・レスポンシブウェブデザインとは、ホームページ(ウェブサイト)を構築するにあたり、単一のファイルでページを生成しながら、CSSなどによってウェブページのレイアウトを変更するというウェブサイトデザインの手法です。

窮屈なレイアウトから幅広く読みやすいレイアウトへ

レスポンシブウェブデザイン

レスポンシブデザインは、パソコンからホームページにアクセスした場合は、「本文カラムとサイドバー」といったように、左右に分割された2カラムレイアウトで表示され、一方スマートフォンなどからアクセスした場合は、「1カラムレイアウト」として、本文カラムを横幅いっぱい表示した後に、その下にサイドバー部分を横幅いっぱいに表示するといった、「デバイスごとのレイアウト変更」を実装しているウェブデザインです。

本文が表示されるコンテンツ部分とサイドバーなど、左右2つに分割されたレイアウトの場合、スマートフォンでサイトが表示された場合は、画面の横幅の関係で窮屈なサイトに見えてしまいます。

レスポンシブデザインは、こういった仕様の場合に、新たにスマートフォン用サイト(スマートフォン用ページ)を作ることなく、タブレットPCやスマートフォンなど、サイトにアクセスするデバイスによって、最初に横幅いっぱいの「コンテンツ部分」そしてその下に横幅いっぱいの「サイドバー部分」といったように、表示するレイアウトを異なるものにするというウェブデザインの方法です。

コンテンツ部分・サイドバー部分として、左右に分割されたブロックを、スマートフォン表示の際には「上下に分割」することによって、サイトの中身を見やすくするという配慮です。

「レスポンシブ非対応」からホームページをレスポンシブ化する

「レスポンシブ非対応」からホームページをレスポンシブ化する

ホームページの構造上、スマートフォンからのアクセスの際に、ホームページのパーツのサイズを変更する仕様に設計している必要があります。

モバイルフレンドリーサイトへの第一歩は、このホームページのレスポンシブ対応です。

レスポンシブ非対応のサイトデザインの場合、該当ファイルを操作することにより、レスポンシブ対応のウェブデザインへの変更することができます。

ホームページの構造が、各ページごとに異なるような複雑な設計の場合、それぞれのファイルを操作する必要が生じますが、一般的には、幾つかのファイルの操作でレスポンシブ化することができます。

ホームページのレスポンシブ化は、現状のサイト設計によって、修正を加えるファイル数が異なります。

静的HTMLサイトの場合は、全てのHTMLを操作する必要がある場合がありますが、WordPressなどのCMSの場合は、テーマファイルの操作で、全ページ一括で変更できる場合があります。

テキスト・テーブル・リンク等の整形

テキスト・テーブル・リンク等の整形 モバイルフレンドリー

例えば、エクセルのようなテーブル(表)が4列に分かれていた場合、スマートフォンで4列となると、相当幅が小さいものになります。

このような場合に、パソコンブラウザでのサイト表示の際は4列、スマートフォンで表示した場合は2列ごとや1列ごとにして、左右分割されたものを上下に回りこませることによって、表を読みやすくする配慮が必要になる場合があります。

しかしながら、テーブルにおいては、列数の調整だけでは、わかりにくい場合があるため、スマートフォン表示用に別の表を生成する必要があるケースもあります。

リンクの距離

また、リンクの距離が近すぎると、スマホユーザーの誤操作を招くため、スマホ表示用にリンク同士の距離を調整したほうが良いケースがあります。

これらテキスト・テーブル・リンク等の整形については、サイトボリューム(ページ数やページごとの要素の数など)によって異なるため、現状のウェブサイトを確認しながら、別途お見積りさせていただいております。

画像の適正化

画像の適正化 モバイルフレンドリー

画像内に埋め込まれた文字が、スマホ最適化によって表示される横幅が広がり、画像自体が大きく表示されたとしても、スマートフォンなどのデバイスの幅の関係で、埋め込まれた文字が読みにくい場合があります。

この場合は、表示する画像をパソコン版とスマートフォン版の2つを用意し、スマートフォンからのアクセスの場合は後者を表示させる、といった配慮が必要になる場合があります。

画像の適正化については、埋め込まれたフォントの種類や加工前の素材の有無などによって対応できない場合があるため、スマートフォン用素材の新規のご制作などで対応させていただく他、弊社では取り扱えない可能性がありますことを予めご了承ください。

モバイルフレンドリー価格表

モバイルフレンドリー価格表

お持ちのホームページ(ウェブサイト)をモバイルフレンドリーに対応させていただくサイトカスタマイズサービスの価格表になります。

静的HTMLサイトやWordPressテーマなど、CMSテーマのモバイルフレンドリー化(レスポンシブ化)にも対応しております。

ご訪問不要

基本料金

86,900円(税別 79,000円)~

レイアウトの変更(レスポンシブ化)などのみ、画像の再加工が不要で、特段複雑な構造になっていない場合

テキスト・テーブル・リンク等の整形は、サイトボリューム(ページ数やページごとの要素の数など)によって異なるため、別途お見積りさせていただきます。

Web制作サービスのご依頼・お見積り・お問い合わせ

モバイルフレンドリー化(ウェブサイトのレスポンシブ化など)の流れ

まずは、弊社お問い合わせフォームよりお問い合わせください。

その際に現状のホームページ(ウェブサイト)の構造を把握するため、合わせてウェブサイトのURLをご送信ください。

簡単なご質問と、サイト分析完了後、お見積額を提示させていただきます。

お見積額がご予算に合えば、制作(カスタマイズ)を開始させていただきます。

その際にFTP情報やCMSのログイン情報など、ウェブサイトのカスタマイズに必要な情報をお知らせいただくか、ウェブサイト全体の構成ファイルを弊社までご送信ください。

カスタマイズ完了後、FTPで直接カスタマイズさせていただいた場合はメールなどでご連絡を、ファイルを送信いただいた場合は、修正ファイルを圧縮ファイルでお送りいたします。

納期

概ね 3営業日

(制作開始からの最短日数)

ウェブサイトの構造により、納品までの日数が延びることがあります。その際は、予めご連絡させていただきます。

詳しくはお問い合わせフォームより、お問い合わせください。

(記載価格は税込表記となっております)

モバイルフレンドリー化の流れと手順(詳細)

価格が大幅に変動するケース

モバイルフレンドリー価格・料金 大幅に価格が変動するケース  ホームページのモバイルフレンドリー化サービス

「ホームページのモバイルフレンドリー化を検討しているが、基本料金の範囲内でカスタマイズ可能だろうか?」

「メインのホームページとは別にスタッフブログと新着情報機能を設置しているが、価格はどれくらい変わるのだろうか?」

ホームページのモバイルフレンドリー化は、現状のホームページの仕様により価格が大幅に変わる場合があります。制作された仕様により方法や作業範囲が大きく異なるためです。

ホームページのモバイルフレンドリー化サービスのご利用にあたり、サービス価格が大幅に変動するケースをお伝えさせていただきます。

モバイルフレンドリー化サービスの基本料金の範囲

モバイルフレンドリー化サービスの基本料金は、レイアウトの変更(レスポンシブ化)などのみで、画像の再加工が不要で、特段複雑な構造になっていない場合の価格です。

ホームページのテキスト・テーブル・リンク等の整形は、サイトボリューム(ページ数やページごとの要素の数など)によって異なるため、別途お見積りさせていただきます。

その他、次のようなホームページ構造の場合は、基本料金に加えて別途料金が必要となります。

  1. メインサイト+サブサイト
  2. ホームページ+特設ページ

また、メインカラム内などに複数のブロックに分かれた要素がたくさん配置されている場合、別途費用を申し受ける場合があります。

メインサイト+サブサイト

メインホームページとサブホームページを同時にモバイルフレンドリー化

メインとなるホームページのサブディレクトリやサブドメインに、メインとなるホームページとは異なるレイアウトのサブサイトが設置されている場合は、モバイルフレンドリー基本料金に加えて、サブサイトの修正分の追加費用が必要となります。

  • 例 ① メインとなるホームページ+サブディレクトリ「blog」にWordPressなどのCMSが設置され、メインとなるホームページとは別レイアウトで稼働しているケース
  • 例 ② メインとなるホームページの他に、サブドメインで他のホームページを稼働しているケース

ホームページ+特設ページ

メインとなるホームページとは異なるレイアウトで、一部ディレクトリやサブドメイン、他ドメインに「リクルートページ」や「キャンペーンページ」、プログラムで動的生成されるページなどの特設ページが設けられている場合、モバイルフレンドリー基本料金に加えて、特設ページの修正分の追加費用が必要となります。

  • 例 ① メインとなるホームページのサブディレクトリに「リクルートページ」や「キャンペーンページ」などが設置されており、メインとなるホームページとは別レイアウトで稼働しているケース
  • 例 ② メインとなるホームページのサブディレクトリに、新着情報や掲示板など、phpやcgiなどでプログラムが設置され、ページが動的生成されているケース

ページ内の要素を複数に分割しているケース

また、メインカラム内などに複数のブロックに分かれた要素がたくさん配置されている場合、別途費用を申し受ける場合があります。

  • 例 ① 本文カラム内に、横幅が3分割などに分割された要素が配置され、アーカイブページなどでリスト化されているケース
  • 例 ② トップページやコンテンツページなど、固定的なページの本文カラム内に、横幅が3分割された要素や2分割された要素が入り混じって配置されているケース

その他、特殊なホームページの構造の場合は、モバイルフレンドリー化サービスの基本料金の他に、別途修正費用が発生する場合がありますので、対象となるホームページをご確認後にお見積りをさせていただいております。

ホームページのモバイルフレンドリー化サービスをご利用の際は、対象ホームページのURLを添えてお問い合わせフォームよりお申込ください。

モバイルフレンドリー化の流れと手順

モバイルフレンドリー化の流れと手順

モバイルフレンドリー化の流れと手順

このページでは、ホームページのモバイルフレンドリー化サービスのご利用にあたっての「モバイルフレンドリー化の流れと手順」をお伝えさせていただきます。

京都のWeb制作会社(ホームページ制作会社)株式会社ファンフェアファンファーレでは、モバイルフレンドリーに対応していないホームページ(ウェブサイト)をお持ちの方向けに、静的HTMLサイトやモバイルフレンドリー未対応のWordPressテーマなどを「モバイルフレンドリー対応サイトへ」と変更させていただくサイトカスタマイズサービスを提供しております。

ホームページのモバイルフレンドリー化にあたり、実作業としては以下の手順で作業を進めてまいります。

  1. ホームページをレスポンシブレイアウトへの変更
  2. 各ページ内部のテーブル、グローバルメニューなどの整形
  3. ホームページ内に設置されたリンク同士の距離の適正化

現状のホームページを確認させていただいてからのお見積、モバイルフレンドリー化着手となりますので、まずは現在ご利用のホームページのURLを添えて、弊社お問い合わせフォームよりご連絡くださいませ。

外部からのサイト参照では確認できない点がある場合は、お見積りの際にFTP接続情報などをお伺いする場合があります。予めご了承ください。

ホームページのモバイルフレンドリー化サービスご利用の流れ

ホームページのモバイルフレンドリー化サービスご利用の流れ

まずは、弊社お問い合わせフォームより、お問い合わせ内容 「モバイルフレンドリーお見積り」をご選択の上、メッセージ本文に「モバイルフレンドリー化の対象ホームページ(ウェブサイト)のURL」を添えてお問い合わせください。

お問い合わせ・お見積りのご依頼いただきました後、現状のホームページ(ウェブサイト)の構造を把握するため、ご送信いただきましたホームページ(ウェブサイト)を参照し、ご確認させていただきます。

万が一「レイアウト崩れなどを起こしているページ」などがございましたら、お問い合わせ時に該当ページのURLを添えていただければ幸いです。

現状のホームページのご確認

現状のホームページのご確認 モバイルフレンドリー

ご送信いただきましたホームページのトップページに設置されているリンク先(内部リンク)などを確認させていただき、同一ドメイン下に設置されているページを調査させていただきます(原則、本サービスのご利用はドメイン単位とさせていただいております)。

ホームページのサイトボリュームによって、現状確認に数営業日かかる場合がありますことを予めご了承ください。

現状のホームページの確認、サイト分析完了後、簡単なご質問事項を添えて「お見積額」を提示させていただきます。

対象となる範囲を確定

モバイルフレンドリー 修正対象範囲確定

メインとなるホームページの構造の他、サブディレクトリにCMSを設置されているケースなど、同一ドメイン下に設置されているページが、それぞれ異なる様々なレイアウトになっている場合、お見積額が高額になるケースがございます。

なお、原則、サブドメインに設置されているホームページにつきましては、別件扱いとしてお取り扱いさせていただいております。

ホームページの構造が複雑な場合は、場合によっては、ホームページ全体のCMS化(WordPress化)の方が、予算が抑えられるケースがありますので、お見積額提示の際に合わせてご案内させていただいております。

カスタマイズ範囲とお見積額がご予算に合えば、制作(カスタマイズ)を開始させていただきます。

カスタマイズに必要な情報のご提供

モバイルフレンドリー カスタマイズ 必要情報提供

ホームページのモバイルフレンドリー化サービスをご利用の際には、ホームページのファイルを操作できるようにFTP情報やCMSのログイン情報など、ホームページ(ウェブサイト)のカスタマイズに必要な情報をお知らせいただくか、ウェブサイト全体の構成ファイルを弊社までご送信ください。

該当ファイルのカスタマイズ完了後、FTPで直接カスタマイズさせていただいた場合はメールなどでご連絡を、ファイルを送信いただいた場合は、修正ファイルを圧縮ファイルでお送りいたします。

モバイルフレンドリー化の手順

モバイルフレンドリー化の手順

ホームページのモバイルフレンドリー化の手順は、①レスポンシブレイアウトへの変更、②ページ内部のテーブル、グローバルメニューなどの整形、③リンク距離の適正化などの順にカスタマイズさせていただきます。

  1. ホームページをレスポンシブレイアウトへの変更
  2. 各ページ内部のテーブル、グローバルメニューなどの整形
  3. ホームページ内に設置されたリンク同士の距離の適正化

レスポンシブレイアウトへの変更

レスポンシブレイアウトへの変更 モバイルフレンドリー

まず、ホームページ全体のレイアウト構造を、モバイル端末からのアクセス時に変更する「レスポンシブレイアウト」へと変更させていただきます。

レスポンシブレイアウト(レスポンシブデザイン)は、パソコンからホームページにアクセスした場合は、「本文カラムとサイドバー」といったように、左右に分割された2カラムレイアウトで表示されるホームページに、スマートフォンなどからアクセスした場合には、「1カラムレイアウト」として表示するレイアウトです。

このレスポンシブレイアウトは、2分割されていたレイアウトを、「横幅いっぱいに表示」し、上下に振り分けます。本文カラムを横いっぱいに表示したその下に、サイドバー部分を横幅いっぱいに表示するといった、「デバイスごとのレイアウト変更」を実装したウェブデザインです。

静的HTMLホームページの場合はこのレスポンシブレイアウトへの変更にあたり、各々のHTMLの要素にID付やClass付、ビューポートの設定などをしていく必要が生じるケースがあり、この場合は費用が高額になるケースがあります。

また、レスポンシブ未対応のWordPressテーマをレスポンシブレイアウトへと変更させていただくことも可能です。

ホームページ(ウェブサイト)のレスポンシブ化

レイアウト崩れなどを起こしているページの同時修正

レイアウト崩れページ同時修正 モバイルフレンドリー

次に、ホームページの中で、レイアウト崩れなどを起こしているページがある場合、レスポンシブレイアウトへの変更と合わせて修正させていただきます。

レイアウト崩れなどを起こしている問題があるページの同時修正は、モバイルフレンドリー化サービスの基本料金に加えて別途費用を申し受ける場合がありますことを予めご了承ください。

事前にご連絡いただいていた場合は、別途費用の有無をお見積に掲載させていただきます。

ページ内部のテーブルなどの要素、グローバルメニューなどの整形

ページ内部 テーブル 要素 グローバルメニュー 整形 モバイルフレンドリー

ホームページの基本レイアウトのレスポンシブレイアウトへの変更が完了したのち、本文カラム内などに設置されているテーブルや、分割されたブロック要素をレスポンシブ化させていただきます。

また、同時にスマートフォン端末からの閲覧に適さないグローバルメニューなどの整形も行います。

ホームページがHTMLのテーブルを多く利用した仕様で設計されている場合、モバイルフレンドリー化には根本的なページテンプレートの変更が必要な場合があります。

リンク距離の適正化

リンク距離の適正化 モバイルフレンドリー

ホームページの基本レイアウト、ページ内部の要素のレイアウトのモバイルフレンドリー化が完了した後、スマホアクセス時の誤タップを防ぐためのリンク距離の適正化などの調整をさせていただきます。

ページ内のテキストリンクや画像リンクの状態を確認し、リンク同士の距離が近すぎてスマートフォン表示の際にタップの原因となっている場合は、こうしたリンクの調整を行い、モバイルフレンドリーに対応したホームページへと変換させていただきます。

なお、コンテンツページ内部のリンクにつき、個別の調整が必要なケースではモバイルフレンドリー化にかかる費用が高額になるケースがあります。

モバイルフレンドリー化の完了

モバイルフレンドリー化の完了

これらモバイルフレンドリー化の作業が完了後、「モバイルフレンドリーテスト」を行い、テストに合格した際にモバイルフレンドリーカスタマイズ完了とさせていただき、作業完了のご連絡させていただきます。

なお、静的HTMLサイトのモバイルフレンドリー化では、WordPress化などのサービスのほうが費用がお安くなるケースもあります。詳しくはソース詳細の確認後になりますので、現状のホームページのURLを添えてお問い合わせフォームよりお見積のお問い合わせをお願いいたします。

モバイルフレンドリーの必要性と検索結果への影響

モバイルフレンドリーの必要性と検索結果への影響

モバイルフレンドリーの必要性と検索結果への影響

京都のWeb制作会社(ホームページ制作会社)株式会社ファンフェアファンファーレでは、モバイルフレンドリーに対応していないホームページ(ウェブサイト)をお持ちの方向けに、静的HTMLサイトやモバイルフレンドリー未対応のWordPressテーマなどを「モバイルフレンドリー対応サイトへ」と変更させていただくサイトカスタマイズサービスを提供しております。

スマートフォンでのホームページ閲覧の機会が高まり、スマホユーザーからのホームページアクセスがPCユーザーの数を超えたことから、モバイルフレンドリーは、ホームページを利用したWebマーケティングでの重要性、モバイル検索のSEOとしての重要性の観点から、必要性が高まってきました。とりわけ店舗等、顧客層の検索方法がスマートフォンの場合はその重要性は非常に高まっています。

ここでは、モバイルフレンドリーの必要性と検索結果への影響をお伝えさせていただきます。

高まる「モバイルフレンドリー」の必要性

高まる「モバイルフレンドリー」の必要性

近年、スマートフォンの普及率が急増し、iPhoneやAndroid端末などのスマートフォンやiPadなどのタブレットからのホームページ(ウェブサイト)が閲覧される機会が増えてきました。

スマートフォンからのウェブ検索数が、PCでの検索数を超え、それと比例してホームページ(ウェブサイト)の閲覧環境としてスマートフォンからのアクセス機会が増加している傾向にあります。

モバイルフレンドリーによってホームページの離脱を防ぐ

モバイルフレンドリー ホームページの離脱を防ぐ

ホームページのマーケティング活用においても、スマートフォンからのアクセスの際に、モバイルユーザーの閲覧性に配慮するスマホ最適化、「モバイルフレンドリー」の必要性は、サイトの閲覧性や操作性の向上によるホームページ(ウェブサイト)の離脱率を防ぐことがまず第一だと考えられます。

そして、もし同じようなホームページが検索結果に並んだ中では、「スマホ対応」という表示か、「モバイルフレンドリーではありません」という表示かを比較した場合、「スマホ対応」ページの方に優位性があると考えることができます。

さらに、そのスマホユーザーへの配慮そのものが、スマートフォンからのGoogle、Yahoo!などのウェブ検索において、検索結果順位に影響を及ぼすというSEO・モバイルSEOの視点からの必要性も同時に兼ね揃えています。

検索結果への影響

検索結果への影響

SEOのひとつの基準としての「サイトのスマホ最適化」が注目されています。

スマートフォンの普及・スマートフォンからのウェブ検索の機会が増大し、ユーザーに選ばれるサイト、そして検索エンジンに選ばれるサイトの条件として、モバイルフレンドリー対応、モバイルフレンドリー対策の必要性が重要になってきました。

スマートフォンの普及と同時に検索エンジン利用者の数も、パソコンよりもスマートフォンからの利用が上回ったという事を受けて、Googleなどの検索エンジンも、「ホームページ(ウェブサイト)がスマートフォン表示に最適化されているかどうか?」という点を「検索結果の順位に影響を与える」という旨が発表されています。

すなわち、「モバイルフレンドリー」がSEOのひとつの基準となっています。特にスマートフォンからの検索の際には、「スマホ対応」がモバイルSEOとしての意味を持つようになりました。

「スマホ対応」の表示

スマホに最適化された「モバイルフレンドリーサイト」は、スマートフォンからのウェブ検索結果で「スマホ対応」と表示されます。

「モバイルフレンドリーではありません」の表示

「モバイルフレンドリーではありません」の表示

逆にモバイルフレンドリーサイトとして認識されていないホームページ(ウェブサイト)の場合は、サイト所有者がウェブ検索を行った場合、検索結果で「モバイルフレンドリーではありません」と表示されます。サイト所有者以外のユーザーの場合は、何も表示されません。

SERPsランキングへの影響

モバイルフレンドリー 検索順位への影響

モバイルフレンドリーアップデートにより、検索結果(SERPs)では「スマホ対応」の表示などの追加のほか、スマートフォンなどのモバイル端末からのウェブ検索時のランキングに影響を与える流れにあります。

モバイルフレンドリー、モバイルSEOもランキングの一つの要素として影響を及ぼしていますが、現在では、通常のSEO・コンテンツ品質の方が比重は高く、モバイルフレンドリーによる直接の大きな影響はそれほどない状況です。

しかしながら、モバイルフレンドリー以外の、通常のSEO要因をより機能させるためには「モバイルフレンドリー」が一つのポイントとして考えられます。

モバイルユーザーの閲覧性・操作性向上のために

モバイルユーザーの閲覧性・操作性向上のために

モバイルフレンドリーは、SEOとしての要因もありますが、まず第一にスマートフォンなどのモバイルユーザーへのサイトユーザビリティ向上が最大の目的であり、対応すべきポイントとして考えられます。

ホームページにアクセスしたモバイルユーザーの閲覧性、操作性を向上がモバイルフレンドリーの目的です。

モバイルフレンドリーの目的

モバイルフレンドリーの目的

ホームページにアクセスするユーザーの「読みやすさ」や「操作のしやすさ」を向上させることがモバイルフレンドリーの目的です。

モバイルSEOとしてのモバイルフレンドリーサイトかどうかの基準は、あくまでモバイルユーザーにとって有益なサイトを検索結果に表示するという検索エンジンの目的、機能に応じた結果であり、根本的なモバイルフレンドリーの必要性自体は、こうしたユーザーへの配慮が目的となっています。

Webマーケティングツールとしての価値を向上

モバイルフレンドリーサイトへとホームページの仕様を変更することで、モバイルユーザーに対してのページ品質が高まるため、モバイルSEOとしての検索順位の向上に加えて、結果的に、スマートフォンからのサイトアクセスの際のサイト離脱率の低減や、PV数の向上などによって、より深いPR、プロモーションを行うことができるため、ホームページの「Webマーケティングツールとしての価値」を向上させる事ができます。

ホームページのスマホ対応後の運用を考えた設計

ホームページ スマホ対応 後 運用 設計

ホームページのスマホ対応とその後のホームページ運用を考えたスマホ対応後のホームページのモバイルフレンドリー設計について。

弊社の基本的な考え方としては、ホームページはずっと改良を重ねていくものだと考えています。

ホームページのモバイルフレンドリー化によってスマホ対応した後のホームページ運用において、なるべく運用しやすいホームページ設計が必要だと考えております。

ホームページのモバイルフレンドリーに関しては、様々な方法がありますが、ホームページのスマホ対応化後の新規ページの生成の際に二度手間三度手間にならないように、運用しやすいホームページヘと変換することを心がけています。

ホームページのスマホ対応とその後の運用を考えた設計

モバイルフレンドリー(スマートフォン最適化)以外のカスタマイズについて

モバイルフレンドリー以外のカスタマイズについて

弊社のモバイルフレンドリー(スマートフォン最適化)サービスは、ワードプレスなどのCMSテーマのモバイルフレンドリー化(レスポンシブ化)にも対応しております。

一般的な静的HTMLサイト(スタティックHTMLサイト)だけでなく、ワードプレスなどのCMSで制作されたホームページ(ウェブサイト)のモバイルフレンドリー対策のカスタマイズに対応しております。

リンク距離の修正や画像の適正化、カラーの調整などにつきましては、通常のホームページ修正サービスをご利用ください。

ホームページの更新・修正料金 価格表

ワードプレステーマなどのモバイルフレンドリー化・レスポンシブ化以外の機能追加・カスタマイズについては、WordPress(ワードプレス)のカスタマイズCMSカスタマイズをご参照ください。

モバイルフレンドリー化(レスポンシブ化)に合わせて、ウェブサイトをCMS化されるご予定の場合は、既存ウェブサイトのWordPress化(CMS化)をご参照ください。

弊社制作のホームページ(ウェブサイト)は全てレスポンシブ対応、モバイルフレンドリーサイトです。
既存ウェブサイトをCMS化される場合は、自動的にモバイルフレンドリーサイトになります。本カスタマイズは必要ありません。

ホームページ制作 京都のWeb制作会社
株式会社ファンフェアファンファーレ

ホームページ制作、サイトカスタマイズなどのお問い合わせ・Web制作のご依頼はこちら