【はてなブログ】超簡単☆スマホ画面の文字を見やすくする



小さい文字好きですか?私は嫌いです。

特にスマホの小さな画面で小さい文字を一生懸命見ていると、発狂しそうになります。

ということはスマホ画面の文字サイズを適切に設定してあげるだけで、結構嬉しくなっちゃうブログ読者がいるということです。私とか。

 

今回ははてなブログスマホ画面の文字サイズのカスタマイズについて書きます。

f:id:nishino-kiiro:20181122091202p:plain

 

 

はてなブログの設定で文字サイズの変更はできない

はてなブログの文字サイズは、あらかじめ用意されている設定項目では変更できません。

CSSをゴリゴリ書いてあげる必要があります。

とっても簡単なので手順を説明しますね!

 

設定手順

手順1.コードをコピーする

こちらのコードをコピーしてください。

文字サイズは16pxだとスマホ版ニュースサイトなどと同じくらいなので読みやすいと思います。

変更したい場合は好きな数字を設定してくださいね。

<style type="text/css">
  .entry-content {
    font-size:16px;
  }
</style> 

 

手順2.はてなブログの管理画面にアクセス

はてなブログの管理画面にアクセスし、デザインメニューを選択します。

 

スマホマークヘッダを選択します。

f:id:nishino-kiiro:20181122092231p:plain

 

タイトル下のHTMLを記載する部分に先ほどコピーしたコードを貼り付けます。

f:id:nishino-kiiro:20181122092354p:plain

 

変更を保存するボタンを押して、終わり!

 

簡単でしょ^^

 

確認方法

実際にスマホ画面で比較してみました

実際にどのくらい読みやすくなったのか確認してみます。

 

文字サイズ変更前↓

f:id:nishino-kiiro:20181122093451j:image

 

文字サイズ変更後↓

f:id:nishino-kiiro:20181122093456j:image

 

だいぶ読みやすくなりましたね!

これで読者の皆さんも喜んでくれるはずです。

 

まとめ:読み手を意識した画面デザインをする

書き手側が小さい文字が平気であると、こんなことは全く気にならないと思います。

しかし、世の中には老眼で小さい文字が苦手な人もいますし、老眼じゃなくても単に小さい文字が苦手な人もいます。

なるべく沢山の人に快適に読んでもらうには、いろんな角度から読みやすさを追求する必要がありますね。

 

読んでくださりありがとうございました。