割と早く出来上がりました。全体的にクリームや茶色の艶消し系で統一したこともあって地味な印象かもしれませんが、新デザインでは記事の文字を大きくし、全体を３カラム仕様（左右サイドバー）へ変更して画面を広く使うレイアウトを採用してあります。今回はサイドバーにTwitterのタイムラインを組み込んでみたので、記事内容と共に、通常ブログには書かないような《日々の呟き》を見ることも可能です。まだ細かい微調整を残しつつも、とりあえずデザイン設定は略決定したこともあり、本日より運用を開始致します。
ただCSS（スタイルシート）編集を行う度にいつも考えることですが、他のブラウザ環境ではどういう風に見えているのか気になるところですね。現在私の使っている環境はブラウザが Firefox（48.0.2）で、以下のようなフォント設定になっています。
要するにWebページ側（当ブログの場合は"seesaa"のサーバー）で設定されたフォントや文字サイズがそのまま表示されるようになっています。よって、この部分が個人的にカスタマイズされた（又は狂いのある）ブラウザでは大きく乱れて表示されてしまうのです。実際に他のブラウザで見ると（※ChromeとSafari＝フォント/表示率の設定が全て異なる）文字の改行位置や大きさが（若干色も）崩れているのを確認できました。このような場合はGoogleやYahoo!など大手サイトのホームページを閲覧した時でも同様に表示が崩れているはずで、該当ページ側の問題というより個人のブラウジング環境によるところが大きいと思われます。もし大きく乱れて表示されている場合は各ブラウザのフォント設定を調整 してみて下さい。また今回はスマートフォン用のスタイルシートには全く手をつけていない為、スマホで閲覧した場合にはやや崩れた表示になっている部分があります
(※ヘッダーのブログ名位置等がずれている) 。
私自身はWebデザイナーでも何でもない素人ということもあってこの辺までが限界ですが、今回の作業でCSSに関する知っておくべきことや興味もちょっと出てきたことから、あくまでアマチュアのレベルで色々勉強してみたいと考えています。
HTML&CSSとWebデザインが 1冊できちんと身につく本
