ブログをPCでもスマホでも見やすいよう、表示改善しました!500記事達成目前の前に色々改善していきます!
今まで、気づいていたのですが、このブログの文字が少し見にくいという問題がありました。問題は主に下記の2点です。
1.PCの表示で、文字が小さすぎ?少し見にくい
2.スマホだと変なところで改行される
これに対して、改善をほどこしてかなり見やすくしましたのでご報告させて頂きます!スマホのほうは各記事の修正が必要なので、改善適応中です!実は500記事目前なので、その前に頑張って直したいと思ってます。
それでは、それぞれの問題とその改善について説明していきます。
問題1:PCの表示で、文字が小さすぎ?少し見にくい
このブログでは下記の画像のように12pxという文字のサイズを主に使用して作成していました。しかし、この12pxというのは少し小さい部類で、見にくい面があります。個人的に小さい文字が好きなのでよかったので良かったと言えばよかったのですが、、、、老若男女皆様に見やすい文字ではなかったのです。
また、フォントがデフォルトのMSゴシックなので、みにくいというか、文字が綺麗でなかったんです。
そこで、まずこの問題に対して対処を行いました。といっても普通にフォントを大きくして、フォントを変えただけです。フォントは15pxにしました。結構大きめですが、かなり見やすくなったと思います。また、フォントも業界ではよく使われているメイリオ系のフォントが選ばれるように設定しました!
この文字だとアンチエイリアスがきいて、かなりみやすく文字が見られると思います。これで、誰もが見やすくなったのではないかと思ってます。
問題2:スマホだと変なところで改行される
これは前から気づいていたのですが、、、ある意味面倒なので放置していました(笑) しかし、そろそろ直さなければと重い腰をあげました。
これは、過去のテンプレートのPC側の表示です。文章が読みやすいように、1行30文字ぐらいでわざと頻繁に改行をいれていたんですよね。たとえ、文章の途中でも。よく日本語は30文字~40文字ぐらいで改行した方が読みやすいといいますからね。
しかし、これでスマホ表示すると、、、、下記のようにちょっと見にくい状態になっていたんです。改行位置が違うので、中途半端あな文章の途中の位置で改行されることになってしまっています。
そこでこれについては、、、、地道に改行を削除して直していっています。改行を削除すると、PC側の表示が見にくくなりそうですが、それは大丈夫です。PC側の文字を大きくしたので、改行しなくても最大でも35文字ぐらいしか表示されないからです。これもあって実はPCの文字を大きくしたというのも一因にあります、、、(笑)
とりあえずこの改善をすると下記のようにちゃんとした改行で読みやすい文章になります。しかし、現在、490記事ぐらいの公開記事があるので地道に少しずつ直しています。ただただ改行を削除して、適切な位置で読みやすいように空白行を入れていく作業です。
ちょっと単純作業で辛いですが、、、一つ一つ手動でやっていくしかないかと思ってます。適切なところで空白行を入れないと、文章が連なって読みにくくなるので。そうなると自分が判断しないといけないため、プログラムで自動化することはできないのです。単純さぎょうですが、地道に頑張ろうと思います!
⇒「〇ブログ/web技術」カテゴリ記事一覧
その他関連カテゴリ