いつも遅れてくるバスが珍しく定刻に来ました。降りる時に運転手さんがマイクで「本日はー到着が遅れましてーたいへんご迷惑をおかけしましたー」
一本前のバスでした。
毎度。俺です。
このブログは基本的にスキーと自転車のブログなのでこれから私が書く記事に興味を持たれる読者はきわめて少ないと思いますが、そんなことは1ミリグラムも気にせず好きなことを書きます。
今回はブログ題字（てっぺんの「せめてひとなみに。」という大きなタイトル）のあしらいを少しいじってみました。
デフォルト状態はこちら。
あまりに本文の字が小さくて老眼殺しのデザインだったので全体に字を大きくしたほか、書体を「游ゴシック体」に変更しています。その状態がこちら。
游ゴシックを標準で備えているOSがまだ限られている（Windows8.1以降とOSX Marvericks以降）ため、この通りの見栄えにならない環境も多いかと思いますが、仕事ではないのでそんなことは1ppmも気にしません。
テキトーに選んだテンプレートですが、背景の雰囲気がなかなかよいのでこれに合わせて題字のあしらいも変えてみましょう。もう頭の中にイメージはできています。
まず、文字色を白に変更します。
印象が軽やかになりましたが、背景の空とのコントラストが小さくて少し読みにくくなってしまいました。そこで、文字に影をつけます（後の作業を考慮してコントラストは少しきつめにしています）。
文字が浮き出て読みやすくなりました。影の色は背景画像の樹の影のあたりからスポイトで濃い色を拾い出しています。このためにわざわざ調色するのが面倒だったからですが、すでに使われている色から同系色を選べばだいたい間違いないとも言えます。
上に書いたとおりコントラストを少しきつめにしましたので、文字と影を全体的に少し透けさせて背景となじませます。それがこちら。
水彩画ちっくな題字になりました。もちろん、ぼかし量や透過率などをいろいろ増減させてみて自分の気に入るバランスにしています。
ちょっとおぼろすぎる感じもしますが、いったんこれでFIX。
最後に、今回の改修でいじったCSS。この記事と関係ない部分は省略しています。プロパティで言うと text-shadow と opacity の部分がCSS3です。
h1 a {
color : #fff ; /* 文字色 */
text-shadow : 0 0 10px #0b1574 ; /* 影 */
opacity : 0.666 ; /* 透過率 */
}