シンプルなブログを目指して!WordPressテーマを自作しました

シンプルなブログを目指して!WordPressテーマを自作しました

18/09/10 タグ:

企業や自営業、はたまた自分が運営しているブログなどを発信するツールでよく使うブログ。
無料で使うことのできるブログサービスはとても便利ですが、多機能すぎてデザインがゴチャゴチャしてませんか?
こんにちは。mashiCoと申します。

私はそのような読みにくいデザインが嫌いなので極力最低限の機能だけで構成されているブログを自作してみましたのでご紹介します。

かなりシンプルに仕上げた「mashi_Command」

私はフロントエンドエンジニアとしても活動しています。(すごく大雑把に言うとホームページ等を作る人)
そもそもコードを書くようになったのもブログをカスタマイズしてみたいというところから入り、今に至ります。

今までいくつかのブログを運営していまして、その時は無料で配布されている極力シンプルなデザインのものを選んで使っていましたが、もっとシンプルなものを使いたい!という欲が出てきたのでこのブログを作ることにしました。

スポンサードサーチ

意識した点

  • スマホで見られることを意識して1カラムにした
  • メニューを大きく表示し、PC・スマホでも共有の見た目にした
  • ヘッダー・フッターには余計な情報を置かないようにした

スマホで見られることを意識して1カラムにした

最近は全体の7割り程度がスマホからの閲覧になっています。そのためスマホからの見た目に比重を置くサイトが増えてきました。

今までのサイトはPC表示に比重を置いていたので、サイドバーにたくさんの情報が記載されており、それが「ゴチャゴチャ感」を生んでいる要因でもありました。
また、そのようなサイドバーはスマホ表示にしたときには本文の下に表示されるので、結局見てもらえないことが多いです。

そのようなことを避けるためにもサイドバーをなくし、必要な情報を別ページで見えてもらえるようにしました。

メニューを大きく表示し、PC・スマホでも共有の見た目にした

最近スマホでよく見かける右上にある三本線のメニュー(ハンバーガーメニュー)を大きめに設定しました。
これはスマホで画面の上まで指が届かないということを少しでも改善できるようにやってみました。

また、一般的にはPCでは画面上にメニューが表示され、スマホではハンバーガーメニューに格納されるという仕様が多いですが、今回はどちらで見ても差があまりないように同じにしてみました。

ヘッダー・フッターには余計な情報を置かないようにした

一般的なサイトはヘッダーにブログの説明文などを、フッターに著者の情報などを記載していることが多いかと思います。
1ページの中でそのような情報も知ってもらうチャンスではあるので悪くはないと思いますが、本当に必要であれば別ページにあっても見に来てもらえると思うので、こちらも外しました。

このブログではヘッダーにトップへ飛べるロゴとメニューのみ。
フッターにはSNSやプロフィールに飛べるアイコンのみにしてみました。

最後に

かなりのシンプルデザインだったため、作るのは非常に簡単でしたし、可読性は非常に高い出来になったかと思います。
今後は関連する記事であったり、多少の広告は実装していこうと思いますが、こちらも可読性に比重を置き最低限の仕様にしていきたいと思います。

テニスラジオ配信中

この番組はスクールやサークルなどでテニスを楽しまれてる方とテニス情報を共有したり、趣味のIT関連についてお話しする番組です。

anchorからpodcastが聞ける各プラットフォームへ配信していますので、ぜひ「mashi_Tennis」で検索して聞いてもらえると嬉しいです!

※こちらのリンクはanchorのプラットフォームへのリンクとなります。