さとぴーの選択範囲

ロードバイクと日々の記録。

文字サイズ変更 13px→14px

ホームページの掲示板と掲示板の過去ログの文字サイズを13pxから14pxにしたかっただけなのですが、思っていた以上に作業が難航しブログの更新をする時間がありませんでした。
(本末転倒)

そしてブログのCSSを見てみると( ゚д゚)ハッ!

このブログの本文も13px…。これを14pxに変更するのは簡単だけれど、横幅も広げてやらないと読みにくいかもなぁ…となり、すると背景画像も広げてやらなきゃならないなぁと。

ホームページで使っているHTMLとCSSがごっちゃまぜのBBSNoteのスキンを弄るよりブログのCSSを弄るほうが見栄えとHTMLがわかれているので楽といえば楽なのですが画像も編集もしなきゃならないのが…。

と思いましたが、なんだ、画像の幅を30px広げるだけでよさそうじゃん…と作業にとりかかり。

Painter2016

Painter2016で編集してGIF形式で保存!

しかし、なぜか白い部分がグレーになる_□○_

Painter9で保存すると問題無かったので、Painter9で作業続行。
10年前のソフトのほうが基本性能がしっかりしているのって一体…。

でも、Painterは絵を描くためのソフトなので、このあたりの事を気にする人はPhotoshopを使えば…。
Photoshop Elementsの体験版今度試してみよう…。

横幅を広げトンボの位置を中央に

やっかいなの事に、トンボが中央にあるデザイン。
画像サイズの半分の長さの別な画像を作成し、それをものさし代わりにして中央の位置を出しトンボを移動。

しかし、思っていたほど大変な作業ではありませんでした。
画像編集といっても5枚しかなく、CSSをほんのちょっと書き換えるだけ。

本文の幅を、470px→495pxで25px、横幅全体は760px→790pxで30px広げ、背景画像もそれにあわせて30px広げ、CSSと画像ファイルをホームページがあるレンタルサーバ側に置き、このブログのCSSとして呼び出す形でカスタマイズ。

横幅を広げた背景画像をどこに置いたのかわからなくなる可能性が高いので、そんな形になりました。

ブログ背景画像
ブログ背景画像
ブログ背景画像
ブログ背景画像
ブログ背景画像

横幅を広くした背景画像。

ブルーの部分の元の画像は右側にむかって明るくなるようにグラデーションがかかっていて、Painterで256色で保存すると明るさの境界で段差。仕方がないので選択範囲をかけて均一色で塗り潰しました。

横幅が広がったので、画像のサムネイルも150pxから180pxに変更。

自分でカスタマイズしたのにいつもと見た目が違うので違和感がまだありますが、小さい文字は50才を超えるときびしいので仕方ありません。
13pxから14pxにしただけですけどね。

大きすぎても読みにくいのが…。

ただ、弄ったのはPC版のテンプレートなので、スマートフォンで閲覧されている方にはまったく関係なく。
そして時代はスマートフォンで、PCでブログを読む人激減中なのに何やっているんでしょう_□○_
コメント
この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事へのトラックバックURL

文字サイズ変更 13px→14pxへのトラックバック