« 前日 | ブログ TOP | 和みの庭 | 翌日 »

2016年08月27日

モバイル対応 できるかな?

強い台風が近付いているようで怖いけど 猛暑は少し収まった。
おかげで 庭仕事もできて パソコンの前で考えることもできた。

モバイル フレンドリー テストの結果を読んだり 対策をネットで調べたりして 直し方を少しだけ考えてみた。

指摘された問題点のうち viewport については html の metaを一行書き足すだけで解決できた。

スマホ用とパソコン用と二つの css を切り替える方法も調べた。

一枚目の画像は 今のまま。
二枚目の画像は meta に一行書き足してみたところ。

和みの庭 和みの庭 和みの庭

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

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

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



「モバイル用 viewport が設定されていません」というご注意は消えて 縮小表示されなくなったが 今度は「コンテンツの幅が画面の幅を超えています」というご注意。

「リンク同士が近すぎます」と言うご注意も そのまま。

次に 画面幅のサイズ指定などを消してみた。(三枚目の画像)

メニューバーを横幅いっぱいに作っているので 画面に収まらず うまくいかない。

すんなり解決とはいかなかったけど 進むべき方向は見えてきた。

パソコンの画面サイズで考えたデザインなので スマホの画面に詰め込むのは難しいような気がするが
もっと涼しくなったら・・・ ゆっくりと考えてみようかな。

« 前日 | ブログ TOP | 翌日 »