SEO内部対策「スマホ」についての記事一覧
モバイル用ページを別URLで管理する正しい方法
SEO対策の中で、スマホ対応はもはや必須と言っても良いほど重要な対策のひとつですが、モバイル用のページを以前からPC用ページとは別で既に用意していて、今後もそれで運用していく予定の方も多いかと思います。
この管理方法で注意したい所は、そのモバイル用に作成したページが正しくモバイル対応と認識されているのかどうかはもちろん、PC用とモバイル（スマホ）用のページが存在することを検索エンジンに正しく認識してもらわなければ、全く同じコンテンツがサイト内に存在すると認識されてしまい、せっかくの評価を落としてしまう可能性があるという点です。
では、今回はPC用ページとモバイル用ページを別々のURL（ディレクトリやサブドメイン）で管理する場合の正しい方法をご紹介したいと思います。
スマホ対応しているかどうかのテストは下記のページでチェックすることができます。
→モバイル フレンドリー テスト
WordPressのサイトをレスポンシブデザインにする方法
WordPress独自の方法があるようなタイトルですが…レスポンシブデザインは、WordPress専用の作り方が特別ある訳ではありません。
WordPressで作られたサイトでも、レスポンシブデザインにすることは難しくありません。
通常のサイトと同じ手順で簡単にレスポンシブデザインにすることができます！
スマホでのSEO対策を行うには、レスポンシブデザインは必須です。
ということで今回は、WordPressで作られたサイトに着目して、レスポンシブデザインを導入する方法をまとめていきたいと思います。
【css】displayの値オススメ5つ！レスポンシブデザインにも便利
webのコーディング作業で使用頻度の高いcssのうちのひとつ「display」は指定できる値が色々とあります。
基本は、要素の表示を指定するもので、spanのようなインライン要素をブロック要素として扱うことができたり、コンテンツの中身を非表示にしたりと、「display」はレスポンシブデザインにも大変便利なcssです。
そして、SEO対策を行うには、htmlの知識も多少必要となります。
本記事ではcssの「display」の中から特におすすめの値を5つ紹介するので、ぜひコーディングの参考にしてください。
レスポンシブデザイン簡単導入法03 – モバイルフレンドリー テスト編
レスポンシブデザインを導入する際に、モバイルフレンドリーのテストで確認されるかと思いますが、エラーの項目とそれぞれの合格ラインを確認したものをまとめたいと思います。
ぜひ、スマホ対応の参考にしてみてください。
https://www.google.com/webmasters/tools/mobile-friendly/?hl=ja
今回はモバイルフレンドリーをテストするために、このような仮のページを用意しました。（横幅：pc用960px/スマホ用100%）
そして、モバイルフレンドリーに合格するためにはこちらのエラー項目をクリアする必要があります。
- テキストが小さすぎて読めません
- モバイル用 viewport が設定されていません
- リンク同士が近すぎます
- コンテンツの幅が画面の幅を超えています
これらを色々な設定でテストしてみたいと思います。
レスポンシブデザイン簡単導入法02 – よく使うcssまとめ編
レスポンシブデザイン簡単導入法として全3回に分けレスポンシブ対応方法をご紹介していますが、前回の記事「レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編」を参考に、レスポンシブデザインの導入のためにビューポートとメディアクエリを設定した後は、スマホ用のcssを調整しながら各デバイスに対応していきます。
本記事ではレスポンシブ対応によく使うcssのポイントをご紹介したいと思います。
レスポンシブデザインに対応するには各デバイス用のcssを設定し表示します。
対応に必要なcssは、本記事でご説明するcssでほぼ完成してしまいます。
対応するにあたり、しっかりとバックアップを取りながらスマホ対応を進めましょう。
レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編
運営中のサイトをスマホ対応にしたいとお考えの方へ、具体的なレスポンシブデザインの導入方法を数回に分けてご紹介します。
レスポンシブデザインについては、2015年4月21日からスマホ対応していないサイトに対して、スマホでの検索結果が下がる、モバイルフレンドリーアルゴリズムが導入されることから、モバイルユーザーの多いサイトにとっては無視できない対応となります。
モバイルフレンドリーに対応しているかどうかは、Googleの「モバイルフレンドリーテスト」から確認できます。
※モバイルフレンドリーはサイト単位ではなく、ページ単位となるので、全ページ対応しないといけない訳ではありません。
今回は、このモバイルフレンドリーに対応する方法としてGoogleが推奨しているレスポンシブデザインにするための準備とポイントをご紹介します。
スマホ表示を高速化するAMP（Accelerated Mobile Pages）とは？
サーチコンソールにAccelerated Mobile Pages（以下AMP）という項目が追加されたことは、もうお気付きかと思いますが、2016年2月後半からgoogleの検索に追加表示されたというこのAMPとは実際のところ何なのか？現状、対応する必要があるのか？などをこの記事でご説明したいと思います。
簡単！レスポンシブデザインの作り方のすべて
ウェブサイトにレスポンシブデザイン導入されていますか？
2016年5月からモバイルフレンドリーアルゴリズムが強化される事をGoogleが発表しました。
詳細な日付はアナウンスされていませんが、徐々に更新されるとのことです。
これによって、よりスマホでのSEO対策にはレスポンシブデザインが必須となります。
念のため、スマホで上位表示させたい重要なページがモバイルフレンドリーに対応しているかどうかモバイル フレンドリー テストで確認しておきましょう。
この記事ではモバイルフレンドリーに対応するためのレスポンシブデザインの作り方をすべてご紹介したいと思います。
