久しぶりにブログのカスタマイズをしてみたんだけど、その際、スマホ用のデザインを確認してみたら色々と大変な状況になってた。
記事がはみ出す
自分の使っているスマホは、これ
キャリア | NTTドコモ |
---|---|
製造 | シャープ |
発売日 | 2013年6月21日 |
概要 | |
OS | Android 4.2 |
CPU | Qualcomm Snapdragon 600 APQ8064T 1.7GHz (クアッドコア) |
サイズ | 126 × 59 × 10.7(最厚部11) mm |
質量 | 約131 g |
連続通話時間 | 約630分(3G) 約610分(GSM) |
連続待受時間 | 約460時間(3G) 約400時間(LTE) 約400時間(GSM) |
充電時間 | 約170分 |
バッテリー | 2,100mAh |
内部メモリ | RAM:2GB ROM:32GB |
外部メモリ | microSD (2GBまで・ドコモ発表) microSDHC (32GBまで・ドコモ発表) microSDXC (64GBまで・ドコモ発表) |
なんだけど、すでに4年前の機種。
アップデートは2回くらいあったけど、androidのバージョンは最初のまま。
当然ながら、元から入ってるブラウザも古いものなんだけど その古いブラウザでこのブログみて見たら 恐ろしいほど表示が崩れてた 😯
なんというか・・・CSSがうまく反映されてなかったり、画像がうまく縮小されてなかったりでトップページからすでにぐちゃぐちゃ。
これを丁寧に直す知識はない。
ブラウザが古いせいであってくれ!と「chrome」を入れて見てみると
よかった、一応まともに表示されるようだ。
しかし、表のあるページはサイズ指定してるとはみ出すみたい。
今までまったく意識してなかったんだけど、スマホ表示を考えるなら 上のような表の場合は縦長な形式で作るべきなんだろうけど、なかなか難しいんだよねぇ。
だがしかし、
アクセス解析をみてみると、
のように、すでにモバイル端末が70%と多数を占めているんだよね。
PCで見てる人って少数派なのね・・・
使いやすいように、右側にウィジェットでカテゴリーやタブなどを並べる配置にしてあるのがもしかしたらあまり役にたってないのかも?とちょっと不安になる。
使用端末で特に多いのはやはり「iPhone」で、モバイル端末の50%以上を占めている。
もしかしたら「iPhone」なら解像度が高いので、PCタイプで表示されているのかなぁとも思ってるんですが、どうなんだろ?
一番アクセスが多いのが「iPhone」なのに、確認する手段がないんだよね。
まとめ
結局なにが言いたかったかというと、
今回のカスタマイズで、モバイルのみ表示される部分にも追加を加えたんだけど、どうやってもモバイル用デザインでは、PC表示のように使い勝手の良い形にはできなかったので、
モバイル端末でみていてページがひどく崩れてる人!いたら、「chrome」を入れてみてください!
モバイル端末で表などがみづらい場合、「PC表示」でみてください!