180117 モバイルフレンドリーその２
レスポンシブ未対応なのに、グーグル様から認定いただきました。
前回、エラーだった、
「コンテンツの幅が画面の幅を超えています」は、 viewport 設定などはそのままなのですが・・・なぜかクリア。
「クリック可能な要素同士が近すぎます」は、ここは改善しました。
以前の記事の画像ですが、
テキストリンクの間隔が狭いのが原因だと思われ、以前に♥マークの画像を書き込んではいたのですが、プラグインのソースを確認。
リスト表示だったので、divでくくり直しました。もともとリストには、margin なり、 padding が有ると思われますが、テンプレートの作者さんがCSSでその値を変更しているかもしれません。本来ならそこのCSSを書き変えるのが本筋なのでしょうけれど・・・
レスポンシブには対応していませんし、全体が縮小し画面が収まって、文字が小さいのが指摘されなかったのが不思議ではあります。
そして、viewport 設定して、img max-width:100% も指定しているのにレスポンシブしない理由が分かりました。
ヘッダーのブログ名の背景画像ですが、グーグルクロームなら、右クリックから、ソースを表示して、さらにCSSのアドレスをクリックすると、CSSを見ることができますが、CSSのヘッダー部分に背景画像でURLを書き込んでいるのが、img max-width:100% とならないようです。
考えてみたら、当然ですよね。
対策としては、背景画像にタイトルテキストを書き込んで画像として、HTMLに img で表示する。すると画面が小さくなると、今より見にくくなる・・・
なお、レスポンシブチェッカーではエラーとなります。
また、FC2ブログの場合、初期設定のままスマホなどで表示させた場合、スマホ用のテンプレートに自動で表示されるようになっているようです。当ブログはその設定を解除しています。
です。
応援よろしく
です。
