スポンサーサイト

このブログは移転しています。このエントリをEvernoteなどにファイリングされる場合は移転先のものをお使いください。ただし移転に際して一部エントリは削除しています、ご了承ください。
▶︎▶︎ このエントリの移転先に ((移動)) する
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Google_ReaderのCSSをプチ修正

このブログは移転しています。このエントリをEvernoteなどにファイリングされる場合は移転先のものをお使いください。ただし移転に際して一部エントリは削除しています、ご了承ください。
▶︎▶︎ このエントリの移転先に ((移動)) する

Google Readerの見栄えが Mac らしくないので少し手直し

11 月 1 日に Google Reader の UI が刷新されたことで前の UI で個人的に気に入っていなかった……

  • デザインが酷い
  • フォントの見栄えがよろしくない
  • リスト表示の境界線付近に折りたたみで隠れているテキストの一部が漏れてて汚い

という点が直る事を期待していましたが、直ったのはデザインだけ(個人的には嫌いではない)。

というわけで、残り二者を解決すべく該当部分の CSS をプチ修正。

ちなみに境界線付近でテキストの一部が漏れている…というのは中段右側の「バッテリー」というテキストの下あたりに見えるゴミみたいなもの。リストをクリックして展開した時に表示されるテキストの上部数ピクセルが漏れている。

まずこちらが修正前。

gr_cstmcss001.gif
【クリックで拡大】

そして修正したのがこちら。

gr_cstmcss002.gif
【クリックで拡大】

全体(各 CSS クラス)でフォントに Myriad Pro と HiraMaruPro-W4 (ヒラギノ丸ゴシック W4) を指定し、font-size を 13px、line-hight を 14px、letter-spacing に 1px を指定しただけ。bold (太字) も解除した方がより奇麗に見えそうなんだけど今回は割愛。

上図のように部分を抜き出してみるとあまり違いが感じられないかもしれませんが、ページ全体から受ける印象はこの程度の変更でも結構なものです。変に変え過ぎない、というのもコツかも?

Google Chrome の場合は Stylebot という機能拡張が便利です (初級程度の CSS の知識は必要) 。Safari だとカスタム CSS を作成して環境設定から指定したり、Firefox なら機能拡張を用いたりすれば同じようにカスタマイズできます。

CSS を自身で記述される場合は MacBook の小部屋さんで紹介されているエントリーが参考になりますので併せてご覧下さい。

余談ですが、Gmail にも似たような変更を施しました。

AdSense

Ads

Blog Search

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。