ブログの表示を改善する

ブロガーというシステムでこのブログを書いている。今迄、「見栄えよりは内容が大切だ」と思っていたから、なるべくシンプルな表示を心掛けて来た。

しかし、気になっていた事が幾つかある。

準見出しの件

ブロガーの機能では、文は構造化出来て、ヒラの文は標準、その上のレベルが準見出し、小見出し、見出し、と全部で4つのレベルが存在する。

私は、準見出しでパラグラフに分けて書いているのだが、その見出しがヒラの文と同じ大きさ文字で、一行の空白と太字になっているだけが違いだった。文章中でも太字を使っているから、それと見分けが付きにくい。

引用のタグの件

それから、引用のタグもあって、引用の部分の表示はボックスの中になって、自分で書いた文と、他人が書いた文を区別出来る仕掛けもある。

しかし、そのボックスの境界が表示されていないので、単にインデントしているだけにしか見えず、見分けが付きにくい。

コメント欄の件

ブログにコメント欄というものがある。これは、ページには記事の最後に自動的に付くようになっていた。

ブログの投稿だと、下記の写真の 0件のコメント: と書いてある部分をクリックしないと登場しないので、今迄はあまり気にして無かった。

しかし、最近はページの記述に力を入れている。読者と繋がるツールとしてあった方が良いのではと思っていたのだが、今迄一度も使われて無かったので邪魔に感じていた。

CSSを追加する

それで、カスタマイズする事にした。テーマのカスタマイズで、上級向けの設定にCSSを追加という項目があって、それで表示方法を変えることが出来るらしい。

• 準見出し → h4 アンダーラインを引く、見出しを2文字インデントする
• 引用タグ → blockquote 背景を灰色にする

具体的には、

h4{
padding:0em 2em;
border-bottom: 1px #777777 solid;
}
blockquote{
background-color:#eeeeee;
padding:0.2em 0.4em;
position:relative;
width:88%;
align:center;
}

という要素の定義を追加してみる。以前の準見出しは、上記の 準見出しの件、引用タグの件、コメント欄の件 のような見栄えだったので、随分と見やすくなった。

レイアウトの変更

コメント欄については、レイアウトを変更することで解決した。footer-1という部分に基本情報ガジェットというものを導入する。それで、私のプロフィールが見えるようになるのだが、公開するのはメールアドレスだけにした。これで、読者が私に連絡する手段ができた。

そして、メインという部分のブログの投稿ガジェットを編集 とすると、ブログの投稿の設定というウインドウが開く。その中で、投稿ページのオプションの部分でコメントのチェックを外すとコメント欄は表示されなくなる。

ところで、そうやっている間に面白いものを見つけた。そのウインドウの一番下にアイテムの並び替えという部分があって、その中の要素に投稿本文がある。そこには、以下の文が掲載されていた。

Lorem ipsum vim ut utroque mandamus intellegebat, ut eam omittam ancillae sadipscing, per et eius soluta veritus.

おお、これはラテン語だ。何と書いてあるのだろう。これ位の長さの文なら訳せるだろうと思ったけど、誰か物好きがやっているに違いないと思って検索してみた。…すると、

これは、ラテン語もどきの意味の無い文らしい、と分かった。見栄えを検証する為に文章を載せる時、文章が読めると見栄えよりも文の内容に意識が向かうので、わざと読めないけど文章らしいアルファベットの並びを載せるのが習わしとなっているのだ。

モバイル用表示には影響せず

残念ながら、今回の 準見出し と 引用タグ の表示改善について、モバイル用表示には影響がなかった。これを修正するには、もっと高度な知識が必要らしい。