FC2ホームページをレスポンシブデザインにする-知識のない私の最終手段-

こんにちは、アマハルです!

今回「FC2ホームページをレスポンシブデザインにする最終手段」を描いていきたいと思います。

 

レスポンシブデザインとはパソコンとスマホ用に違う表示でそれぞれ見やすく作られたデザインの事で、これができてないとスマホで見た時文字が小さかったり表示が汚くなったりしてしまいます。

 

私もこんな感じのホームページをFC2で作っているのですが

 

20200207003254

 

http://amaharumanga.web.fc2.com/

レスポンシブデザインにはしていません。

というか、HTMLやCSSの知識がなくできないというのが本当の所です。

(このサイトは簡単なHTMLだけで作っています)

 

色んな所で「レスポンシブデザイン」を検索し徹夜を覚悟で作ったこともありました。

しかしこの手のサイトはどれも「知識がある前提」で書かれていることが多く

なかなか作り上げるのは至難の業でした。

無料のレスポンシブデザイン用のテンプレートを使ってもうまく反映されなかったり、

CSSを一からやってみたり…どれも上手くいかず。

結局諦めてしまいました。

 

ただGoogleがやっている「モバイルフレンドリーテスト」というのがあって

こちらをクリアすればとりあえず合格かなと思った私。

こちらをご覧ください↓

 

20200207002836

 

 合格しています。

HTMLもCSSもいじっておらず、どうしてできたのか…?

 

 実はフォントの大きさです。

 

パソコン用にそれまでフォントを14ptにしていたのですが

それだとスマホ用では小さすぎてました。

そこでサイズを18ptに変更。

パソコンでは少し大きいかなとも思ったのですが見るのに支障がない程度だったので

この大きさに。

するとそれまで小さい豆粒ほどの字の大きさだったスマホ表示が若干大きくなりました。

そしてモバイルフレンドリーテスト。

こちらも前まで全然ダメだったのがフレンドリーに。

 

知識のない私にとっての苦肉の策、最後の手段でした。

ご参考までに。