ブログのデザインであるブログのテーマ。
はてなブログでも多くのテーマが存在ます。このブログのテーマは「Smooth」というテーマなのですが、少し前からスマホ用の画面の上側にブログタイトルとはてなブックマークボタンが現れるようになりました。
はてなブログのテーマSmoothのデザインが変わった？-スマートフォン用デザイン上部にブックマークが現る
はてなブログ全体のデザインが変更されたのか、「Smooth」というテーマのデザインが変更されたのかはわからないのですが、ある日突然スマホ用のブログ画面の上部にブログタイトルとはてなブックマークボタンがずっと現れるようになりました。
上の写真の矢印の部分が今回加わったブログタイトルとはてなブックマークボタンです。この部分がスクロールしてもずっと現れるのです。
ブログの読み手としてはブログのタイトルがずっと表示されているので、どんなことが書かれている記事なのかが分かりやすくなった変更かなと思います。また、すぐにブックマークできるので、その点でも使いやすさがアップしました。
一方で、通常、ブログのデザインが少し変わったとしても、ブログを書く際には何の問題もないのですが、このブログに関しては、デザインを色々カスタマイズしており、今回のデザイン変更によって、これまでカスタマイズした部分を少し変更する必要が出てきました。
見出しのアンダーラインの変更
まず初めに、ブログの見出し部分のアンダーラインの形を変更しました。
元々大見出しには上の写真のように、左端が矢印のようになったアンダーラインを使っていたのですが、今回のデザイン変更によって、下の写真のように、シンプルなアンダーラインにしました。
理由は、ブログのタイトルがずっと記事のタイトルがブログ上部に表示され、その最初の文字とアンダーラインの左端の飾り部分が重なってしまい、見づらくなってしまったからです。
実は、自分でもこういうデザインの変更を行ったときのやり方がよくわかっていないので、この変更を行うだけでかなりの時間を要しました。
トグルメニューの位置を変更
このブログのスマホ用の画面の右上には、トグルメニューという、折り畳み式のメニューを設定しているのですが、このトグルメニューの位置も変更しました。
元々メニューは上の写真のように、ブログの一番右上に設置していました。
ですが、今回新しくなったデザインでは、右上に、はてなブックマークボタンが常設されているので、トグルメニューをクリックすると、はてなブックマークのページに飛ぶようになってしまったのです。
この誤作動を回避するために、トグルメニューをメニューの右上からタイトルの下へと移動させました。
この移動も、自分でトグルメニューを設置しているにもかかわらず、なかなかうまくできず、とても時間がかかりました。
ブログのデザインを固めてから1年ほど、デザインをいじることはなかったので、デザインの変更時に入力したコードの意味などを完全に忘れてしまっていたことが、今回の変更でよくわかりました。
今後はもう少しこまめにデザインについてチェックして、コードの意味などを確認していきたいなと思いました。
※はてなブログのデザインカスタマイズでおすすめな記事一覧はこちら
はてなブログPROの紹介
はてなブログには無料ブログと有料プランのはてなブログPROがあります。
初心者の場合は最初は無料ブログでブログを書きながら、収益化などを図りたいと思った場合にはてなブログPROへ切り替えるのがおすすめ。
私も最初は無料ブログで初めて今ははてなブログPROを使っています。
良いところとして、
・自動広告が表示されない（自分で広告をつけて収益化できる）
・カスタマイズの幅が広がる
・メンテナンスフリーなので書くことに集中できる
・はてなブロガーさんとのつながりができる
という4つがあります。
私としては無料ブログでやっていたころよりもはてなブログProに変えたほうが使い勝手がよく、サブブログも作りやすいのでお勧めです。
ブログをこれまでよりもさらに良くしていきたい、将来的には収益化も考えているという場合に特におすすめですので是非ご検討ください。
※はてなブログProの登録はこちら
終わりに
このブログでははてなブログのテーマ「Smooth」のスマホ版のデザインが変わったことと、デザイン変更に伴い実施したことをご紹介しました。
デザインの変更はブログ初心者にとってとても難しいことなので、色々大変だったのですが、今回の変更で自分のブログのデザインを見返す機会となり、良かったなと思いました。
※ブログ毎日更新を365日続けた話はこちら
にほんブログ村