現在、パソコンの数よりスマートフォンの数が上回り、パソコンよりもスマートフォンなどモバイルからのアスセスが増しています。モバイルで見やすいウェブページ作りが重要となってきます。Search Console のモバイルフレンドリー テストツールで、モバイルで見やすいかテストできます。
更新ができていないブログでアクセスも少ないウェブページです。検索結果、次のように表示されていました。
ページがモバイル フレンドリーではありません。
検索結果の画面ですが、この警告はサイトの所有者に対しての警告です。所有者以外の方には表示されません。
自分のスマートフォンでウェブページを確認すると、やはりモバイルフレンドリーではなく読みにくい。読めないことはないですがモバイルユーザーは避けるでしょう。モバイルフレンドリーである方が検索順位に優位だということがわかります。
モバイルフレンドリー テストツールは、ウェブページのURLを入れるだけ、面倒なことはありません。テストが終わると結果が出ます。
下記リンクSearch Consoleの「モバイルフレンドリーテスト」で行えます。
https://search.google.com/search-console/mobile-friendly?hl=JA
上の画像の結果はテーマをカスタマイズで改善しました後の結果です。私の場合、「Check to disable Responsive Layout 」このレイアウトを無効にした後、スマートフォンで改善を確認し、モバイルフレンドリーテストを行っています。
テーマのレイアウトを変更が可能な場合はそれをチェックすると簡単に改善されるかもしれません。
「モバイルフレンドリーです」と表記されていますが、「ブロックされたリソースが1件あります」と警告が出ています。(上記画像参照)
google botをブロックしていると、正確な結果が出ません。まずは「ブロックされたリソース」を改善する必要があります。Search Consoleで確認した結果、ブロックされたリソースやクロールエラーはありませんでした。
google botoのアクセスをブロックすると、google botがサイトのクロールやインデックス登録を行うことができなくなり、Google の検索結果でサイトの掲載順位が下がる場合があります。
「ページがモバイル フレンドリーではありません。」は消えています。
ご自分のスマートフォンやiPhoneで確認するとわかるとモバイルで読みやすいか否か、何を変更すればいいのかわかるかも知れません。
<head> タグの中にviewportの指定を追加します。
このサイトでは次のようにviewportを指定しています。
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no”>
つまりモバイルでのダブルタップやピンチでの拡大倍率は1.0に指定してあり、拡大縮小はできなく指定されています。実はiOS10(2016年9月)のSafariでは、この「user-scalable」の設定が機能しないようです。
モバイルデバイス上での横スクロールバーをしないでウェブサイトが閲覧できるように、コンテンツの幅はスクリーンより広げない方が良いとされています。
Viewportをデパイスに幅に合わせることにより、フォントが適切に拡大し読みやすくなります。GoogleはViewportをデパイスに幅に合わせることを推奨しています。
フォントを適切に拡大できるようにするため、Googleはボディでフォントサイズを16ピクセルに、行の高さを1.2emにそれぞれ設定し、テキストの残りの部分のサイズをベースサイズである16ピクセルの相対値に設定することを勧めている。たとえば、CSSで12ピクセルのフォントサイズ(ベースサイズの75%)を適用する「small」クラスセレクタと、20ピクセルのフォントサイズ(ベースサイズの125%)を適用する「large」クラスセレクタを作成する。
Googleはユーザーが誤ってタップしないように、リンクやボタンを配置するようガイドラインを作っています。
GoogleはFlash、Silverlight、Javaを使うことを好ましく思っていなく、それらの代替技術として、ブラウザベースのテクノロジを使うことを推奨しています。Flash、Silverlight、Javaのプラグインを使っている場合は改善した方が良さそうです。
モバイル対応に変更した場合、URL の再クロールを Google にリクエストします。それにより、検索結果に表示されるウェブページを更新することができます。「Fetch as Google」を使用します。
この方法で30 日間に 500 件まで 送信可能です。
This post was last modified on 11/03/2019 11:27 AM