ノイズを減らしたミニマルなデザインへ

新たなことが始まることが多い春だからなのか、ブログデザインを少し変更したYuji（＠yuji_dlv）です。

今年に入りブログへの端末アクセス比率がス6：4とPCに比べてスマホ、タブレットが上回ったこともあり、基本デザインや機能はそのままで色、レイアウトの変更を行いました。

各端末へ影響をあたえる箇所と変更前と変更後のデザイン比較について記載しています。

基本情報(主な変更箇所)

PC / パソコン

PCからのアクセスにあたり、影響する箇所は、『トップページの記事タイトル下部の本文非表示』と『サイドバーやウィジットタイトルをホワイト背景に変更』になります。以前に比べPCからのアクセスの場合、物足りないイメージにはなりますが、表示速度の向上にも繋がっています。

Smartphone / スマホ

スマホからのアクセスにあたり、影響する箇所は、『トップページの記事タイトル下部の本文非表示』、『サイドバーやウィジットタイトルをホワイト背景に変更』、『スマホ、タブレットのトップページレイアウト変更』になります。特に記事一覧の下部(フッター)のレイアウトを大幅に変更したので見やすくなっていると思います。

Tablet / タブレット

タブレットからのアクセスにあたり、影響する箇所は、『トップページの記事タイトル下部の本文非表示』、『サイドバーやウィジットタイトルをホワイト背景に変更』、『スマホ、タブレットのトップページレイアウト変更』になります。画面の大きさにもよりますが(9.7インチ以上)だと、縦の場合スマホ表示、横の場合PC表示になると思います。

まとめ

主な変更箇所の『トップページの記事タイトル下部の本文非表示』、『サイドバーやウィジットタイトルをホワイト背景に変更』、『スマホ、タブレットのトップページレイアウト変更』以外にも細かい調整を行っていますが、見た目上かわらず、表示速度向上させています。

スマホ、タブレット、PCで検証済みではありますが、Android(スマホ、タブレット)に関しては種類が多いため端末によってはレイアウト崩れの可能性もあります。今回は、見やすさ、表示速度向上を目的とした変更を行いました。

ブログの基本デザインはTCDのMAGをカスタマイズして使用しています。