スマホに合わせたサイトデザインを今頃になって考えてみた

2019年7月17日

wordpressイメージ

WordPressをめでたく5.2にし、強化されたデザイン面を活用すべく「ギャラリー」を所々に設けて、写真を横並びにしたり説明文を写真に被せて表示させてみたりしたのですが、これは失敗だったな、と最近思うようになりました。

と言うのも、当サイトにおける最近の閲覧デバイスの半数以上がスマホだからです。(多分、当サイトに限った事ではないように思います)

写真を横に2枚並べたらえらい小さくなってしまうし(実は、スマホで見ると1枚ずつ縦並びに変換されるのかと思っていた)その上に説明文を被せようものなら、全く写真が見えなくなってしまってました。
これと似たような感じで、文章を写真に回り込ませるのも、スマホだと酷い有様になってしまうので、使用をやめました。

写真は横に並べたりせず、1枚ずつ縦並びの方がいいようです。
また、PCで文章と写真を横並びに表示させたいなら、「メディアと文章」を使用すれば、PCでは写真の横に文章、スマホでは写真の下に文章(もしくはその逆)という設定ができるので、それを使った方がいいのかな、と思いました。

そしてもうひとつ。
リンク色に関して、マウスオーバーした際の色のみ変更してある個所があったのですが、そもそもスマホでマウスオーバーなんてできないので、これも無意味。
というよりも、スマホだとリンクなのかどうか分からず、とても不親切な仕様になってしまってました。

このように、もうPCでの見栄えを重視してはいられない時代なのだと、今更ながらに気づいた訳です。遅すぎですね……。
これから少しずつ、今まで書いてきた記事を再び修正しようと思います。まだ記事数が少ない段階で気づいて良かった。

追記:この記事を書いた後、少しずつ過去の記事を全て修正したんですが、実際にやってみたところ、「メディアと文章」は いまいち。なかなか思うように上手く配置できず (妙な余白が出来る等)、代わりに「カラム」を使用したところ、ほぼほぼ自分の思い通りの配置にできました。

2019年7月17日暮らしIT関連, WordPress

Posted by ranmo