SEO内部対策に必要な情報を解説します

SEOならSEOパック

SEO内部対策「スマホ」についての記事一覧

モバイル用ページを別URLで管理する正しい方法

SEO対策の中で、スマホ対応はもはや必須と言っても良いほど重要な対策のひとつですが、モバイル用のページを以前からPC用ページとは別で既に用意していて、今後もそれで運用していく予定の方も多いかと思います。

この管理方法で注意したい所は、そのモバイル用に作成したページが正しくモバイル対応と認識されているのかどうかはもちろん、PC用とモバイル(スマホ)用のページが存在することを検索エンジンに正しく認識してもらわなければ、全く同じコンテンツがサイト内に存在すると認識されてしまい、せっかくの評価を落としてしまう可能性があるという点です。

では、今回はPC用ページとモバイル用ページを別々のURL(ディレクトリやサブドメイン)で管理する場合の正しい方法をご紹介したいと思います。

スマホ対応しているかどうかのテストは下記のページでチェックすることができます。
モバイル フレンドリー テスト

この記事の続きを読む…

WordPressのサイトをレスポンシブデザインにする方法

WordPressのサイトをレスポンシブデザインにする方法と言われると、まるで独自の方法があるようなタイトルですが、
レスポンシブデザインに対応するのは、WordPress(ワードプレス)限定の作り方が特別ある訳ではなく、
WordPressで制作されているサイトでも、レスポンシブデザインにすることは難しくありません。
通常の運営しているwebサイトと同じ手順で、簡単にレスポンシブデザインに対応することができます。

Googleもレスポンシブデザインのサイト運営を推奨しており、スマホ(モバイル)でのSEO対策を行うには、レスポンシブデザインは必須です。
管理・運用面の観点からも、1つのファイルでパソコン表示とスマホ表示をCSSにより調整するレスポンシブ対応はとても便利でお勧めです。

ということで本記事では、WordPressで作られたサイトに着目して、レスポンシブデザインを導入する方法をまとめていきます。
WordPressのサイトをレスポンシブデザインにする方法
この記事の続きを読む…

【css】displayの値オススメ5つ!レスポンシブデザインにも便利

webのコーディング作業で使用頻度の高いcssのうちのひとつ「display」は指定できる値が色々とあります。
基本は、要素の表示を指定するもので、spanのようなインライン要素をブロック要素として扱うことができたり、コンテンツの中身を非表示にしたりと、「display」はレスポンシブデザインにも大変便利なcssです。

そして、SEO対策を行うには、htmlの知識も多少必要となります。
本記事ではcssの「display」の中から特におすすめの値を5つ紹介するので、ぜひコーディングの参考にしてください。

【css】displayの値オススメ5つ!レスポンシブデザインにも便利

この記事の続きを読む…

レスポンシブデザイン簡単導入法03 – モバイルフレンドリー テスト編

レスポンシブデザインを導入する際に、モバイルフレンドリーのテストで確認されるかと思いますが、エラーの項目とそれぞれの合格ラインを確認したものをまとめたいと思います。
ぜひ、スマホ対応の参考にしてみてください。
https://www.google.com/webmasters/tools/mobile-friendly/?hl=ja

今回はモバイルフレンドリーをテストするために、このような仮のページを用意しました。(横幅:pc用960px/スマホ用100%)
20150331_responsive-web-design-mobile-friendly-test_02

そして、モバイルフレンドリーに合格するためにはこちらのエラー項目をクリアする必要があります。

  • テキストが小さすぎて読めません
  • モバイル用 viewport が設定されていません
  • リンク同士が近すぎます
  • コンテンツの幅が画面の幅を超えています

これらを色々な設定でテストしてみたいと思います。

この記事の続きを読む…

レスポンシブデザイン簡単導入法02 – よく使うcssまとめ編

レスポンシブデザイン簡単導入法として全3回に分けレスポンシブ対応方法をご紹介していますが、前回の記事「レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編」を参考に、レスポンシブデザインの導入のためにビューポートとメディアクエリを設定した後は、スマホ用のcssを調整しながら各デバイスに対応していきます。

本記事ではレスポンシブ対応によく使うcssのポイントをご紹介したいと思います。

レスポンシブデザイン簡単導入法02 - よく使うcssまとめ編

レスポンシブデザインに対応するには各デバイス用のcssを設定し表示します。
対応に必要なcssは、本記事でご説明するcssでほぼ完成してしまいます。
対応するにあたり、しっかりとバックアップを取りながらスマホ対応を進めましょう。

この記事の続きを読む…

レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編

運営中のサイトをスマホ対応にしたいとお考えの方へ、具体的なレスポンシブデザインの導入方法を数回に分けてご紹介します。

レスポンシブデザイン簡単導入法01 - ビューポート・メディアクエリ編

レスポンシブデザインについては、2015年4月21日からスマホ対応していないサイトに対して、スマホでの検索結果が下がる、モバイルフレンドリーアルゴリズムが導入されることから、モバイルユーザーの多いサイトにとっては無視できない対応となります。

モバイルフレンドリーに対応しているかどうかは、Googleの「モバイルフレンドリーテスト」から確認できます。
※モバイルフレンドリーはサイト単位ではなく、ページ単位となるので、全ページ対応しないといけない訳ではありません。

今回は、このモバイルフレンドリーに対応する方法としてGoogleが推奨しているレスポンシブデザインにするための準備とポイントをご紹介します。

この記事の続きを読む…

スマホ表示を高速化するAMP(Accelerated Mobile Pages)とは?

サーチコンソールにAccelerated Mobile Pages(以下AMP)という項目が追加されたことは、もうお気付きかと思いますが、2016年2月後半からgoogleの検索に追加表示されたというこのAMPとは実際のところ何なのか?現状、対応する必要があるのか?などをこの記事でご説明したいと思います。

サーチコンソールでのAMP対応の確認方法

この記事の続きを読む…

簡単!レスポンシブデザインの作り方のすべて

ウェブサイトにレスポンシブデザイン導入されていますか?

2016年5月からモバイルフレンドリーアルゴリズムが強化される事をGoogleが発表しました。
詳細な日付はアナウンスされていませんが、徐々に更新されるとのことです。
これによって、よりスマホでのSEO対策にはレスポンシブデザインが必須となります。

念のため、スマホで上位表示させたい重要なページがモバイルフレンドリーに対応しているかどうかモバイル フレンドリー テストで確認しておきましょう。

この記事ではモバイルフレンドリーに対応するためのレスポンシブデザインの作り方をすべてご紹介したいと思います。

この記事の続きを読む…

SEO内部対策まとめ

SEOツール無料トライアル

プロも個人も、高機能なSEOツールを体験ください。

コンテンツ分析や内部SEO対策、競合分析ができるSEOツールが7日間体験可能!

seodoor by SEO Pack

登録申し込み後自動でログインされます。アカウント情報はご登録のメールアドレスへ自動送信されておりますのでご確認ください。

SEO Packキャンペーン
内部修正サービス

公式SNS

Twitter

facebook