マウスやすめ～パソコンに疲れたら・・・ 自分癒しのBLOG～

フリーの画像編集ソフトGIMP（回転・傾き補正）

Ξ 2009/3/31 火曜日

画像がそのままだと横になっていたり、逆さになっていたりすることがあります。
その画像を正位置にします。

■決まった角度での回転

『画像』→『変換』から回転角度をクリックします。

■細かい指定での回転

をクリックします。

スライダや角度を入力し回転させます。
回転の中心を変えることもできます。

これで傾きや画像の正位置を補正できます。

| → コメント (0) | ∇ GIMP |

IE8・IE7・IE6・FireFox・Google Chrome・Safariを同時起動させてみた

Ξ 2009/3/30 月曜日

IE８も出そろったようなので、ブラウザを一挙同時起動させてみた。

上から
IE7（37％）・Firefox（24％）
IE6（18％）・Google Chrome（8％）
Safari（7％）・IE8（4％）
の順です。

ちなみにこのサイトの閲覧ブラウザの順番となっています。

IEの同時起動は、

ひとつのパソコンでIE7とIE8を共存させる方法

マルチIEのインストール

を参考にしてください。

| → コメント (0) | ∇ やってみました！, 環境 |

フリーの画像編集ソフトGIMP（テキスト・整列編）

Ξ 2009/3/29 日曜日

画像にテキスト（文字）を入れてみましょう。

■テキスト

をクリックして テキストエディタで文字を記入します。

でフォントの種類や大きさ色を変更できます。

色を”メイリオ”に変更し、大きさを22px、色：をクリックして文字色パネルから白に変更しました。

■整列

整列をクリックしふたつのテキストを選択します。

並べるからふたつのテキストの高さを同じにしました。

整列では縦横を中央、上、下、右、左に合わせきれいに並べることができます。

| → コメント (0) | ∇ GIMP |

最近の心配事がひとつ、ゴールデンの耳血腫

Ξ 2009/3/29 日曜日

昨年の11月から、治ってはまたなって、右かと思えは今度は左となかなか治らないゴールデンの耳血腫。

治療法はレーザー手術、外科手術、投薬などあるらしいのだが歳も歳なので手術しても再発の可能性があるということで投薬を続けている。

薬はプレロン錠とコンドロイチン、

プレロン錠はいわゆるステロイドで抗炎症作用があるので、この薬を飲んでるとかゆみがなくなるためか首を振らなくなったり、耳をこすりつけたりしません。

コンドロイチンは最近人間でも有名になってきましたが、関節などに良いとされるものです。耳の軟骨に良いとのことです。
ちなみにこれが効くのか、ゴールデンの足腰がしっかりしてきたように思います。

毎週のように通っているので治療費もばかにならないのですが早く良くなってほしい一心で通い続ける日々です。

あっ！お金のことも考えると心配事はふたつです。

| → コメント (0) | ∇ ペット |

フリーの画像編集ソフトGIMP（トリミング、トーンカーブ、リサイズ編）

Ξ 2009/3/29 日曜日

GIMPでサイト用の画像を作ってみましょう。

サカサつららの画像です。

ブログなどの画像を扱う場合、デジカメの写真を適正化することが多いと思います。写真の大きさや明るさを変えたりすることで、見やすい写真にすることができます。

■トリミング

をクリックし画像の見せたい部分を選択します。

これで画像のトリミングができます。

■トーンカーブ

『ツール』→『色ツール』→『トーンカーブ』からトーンカーブの調整を開きます。

Photoshopなどでもそうなのですが、Ｗｅｂ上ではコントラストのきいたメリハリのある画像が奇麗に見えますのでそのようにカーブを調整します。
直線の線を逆Ｓ字にすると明るい部分がより明るく、暗い部分がより暗くなりメリハリがつきます。基本的に『逆Ｓ字』が基本となります。画像によって明るさを調整しましょう。
プレビューで確認して『ＯＫ』で確定します。

■リサイズ

画像のサイズが大きい場合、ＤＡＴA量も大きくなってしまいサーバーを圧迫し表示も遅くなってしまうのでピクセルで大きさを調整します。自分の場合は長辺で800pxぐらいにしています。

『画像』→『画像の拡大縮小』で画像の拡大・縮小を開きます。

幅を800にし高さを『拡大縮小』をクリックします。
これで画像のサイズが小さくなりました。

■画像の保存

『ファイル』→『保存』で画像を保存します。

| → コメント (0) | ∇ GIMP |

フリーの画像編集ソフトGIMP（インストール編）

Ξ 2009/3/24 火曜日

Linuxを使っている人ならだれでも知っていると思うのですが、『GIMP』というフリーの画像編集ソフトがあります。

だいぶ昔（2000年頃）になりますがWindowsで使えるようになったと聞いて使っていた時期があります。人にも勧めていたり、Linuxではちょこちょこ使っていたのですがPhotshopを使っている手前、マシンにインストールしたことはありませんでした。
今回リクエストがありGIMPの最新版をWindowsにインストールしてみましたが、昔に比べかなり良くなっておりなかなか使えそうです。

■ダウンロード＆インストール

http://www.geocities.jp/gimproject2/download/gimp-download.html
からGIMPをダウンロードします。

インストール版とポータブル版があります。
ポータブル版はUSBメモリなどで持ち運びできるということですが、今回はインストール版をダウンロードしました。

ダウンロードした gimp-2.6.4-i686-setup.zip を解凍します。

解凍してできた gimp-2.6.4-i686-setup.exe でセットアップを開始します。

Nextで進めます。

最後まで行ったらFinishでGIMPが立ち上がります。

かなりPhotshopに似ています。
日本語環境もしっかりしていて迷うこともなさそうです。

それでは、しばらくの間このサイトで使う画像はこのGIMPを使ってみるということでレポートしていきたいと思います。

| → コメント (0) | ∇ GIMP |

今日のサカサつらら 2009/3/23

Ξ 2009/3/23 月曜日

冷蔵庫の中にできる不思議なつらら”サカサつらら”シリーズ

今日のサカサつららは3つです。
しばらく出来ず心配していたのですが、今日のWBCの日本チーム同様、快調なつららでした。

↓の評価ボタンを押してランキングをチェック！

| → コメント (0) | ∇ 今日のサカサつらら |

SeeSaaブログのデザインをカスタマイズする（タイトルのポイントなど）

Ξ 2009/3/23 月曜日

SeeSaaデザインも大体出来上がってきました。
遊びでタイトルのポイントと多少の修正を加えてデザインの完成とします。

まずポイントの画像を用意します。今回は 29×25px で作りました。
背景を透明で使うためGIFとします。

SeeSaaの ”記事投稿” → ”ファイルマネージャー” で画像をアップします。

CSSを変更します。

■h3の変更

h3 {

padding: 0px 0px 0px 15px;

font-size:12px;

font-weight:bolder;

background-image:url(http://blog.seesaa.jp/img/bg/lightgray_1/title.gif);

background-repeat:no-repeat;

font-family:Verdana;

}

padding を
padding: 0px 0px 10px 32px;
に変更します。

background-image のURLを
http://cat99.up.seesaa.net/image/title.gif

に変更します。

変更前



変更後

■.listCategoryArticleの変更

 
最新記事部のバックを白くします。

.listCategoryArticle{

margin-top:5px;

padding:5px;

border:solid 1px #FFE2E2;

}

background-color:#FFF;
を付け加えます。

■#footerの変更

#footer{

clear:left;

height:50px;

}

background-color:#F3FFCC;
を付け加えます。

変更前

 
変更後

■imgの追加

このままだと指定のない画像に枠線が付いてしまいますのでCSSの中に

img {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

}

を付け加えます。

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

最初からみると


が
 

こうなりました。

| → コメント (0) | ∇ Seesaa |

SeeSaaブログのデザインをカスタマイズする（記事部分を変更する）

Ξ 2009/3/22 日曜日

記事部分の区切りが分かりにくいのでバックに色を入れてみることにした。

CSSを変更します。

■.blogの変更

.blog {

padding:0px 5px 50px 5px;

text-align:left;

font-family:Verdana;

}

ＢＯＸの下が開きすぎているようなので

padding:0px 5px 50px 5px;
を
padding:0px 15px 5px 15px;
に変更

background-color:#F3FFCC;
margin-bottom:20px;

border-top:2px solid #89C319;
border-bottom:2px solid #89C319;
を付け加えます。

日付の上のボーダーが邪魔になったのでとります。

■.dataの変更

.date{

font-family:Verdana;

font-size:10px;

clear:left;

color:#AFAFAF;

margin-top:0px;

margin-bottom:0px;

padding:12px 0px 25px 0px;

border-top:1px solid #D3D3D3;

}

border-top:1px solid #D3D3D3;
をとります。

padding:12px 0px 25px 0px;
を
padding:12px 0px 0px 0px;
に変更します。

■.titleの変更

.title{

margin-top:0px;

margin-bottom:0px;

font-weight:bold;

}

margin-top:0px;
を
margin-top:10px;
に変更します。

文字も大きくしたいので
font-size:14px;
を足します。

これは日付がない場合TOPとタイトルがくっつきすぎてしまうためです。
そこで .date 側のbottomのpaddingを少なくし、 .title 側のTOPのmarginを多くしました。

変更前

変更後

 

こうなりました。
完成も間近です。

| → コメント (4) | ∇ Seesaa |

SeeSaaブログのデザインをカスタマイズする（サイドバーとリンク色の変更）

Ξ 2009/3/22 日曜日

header部が変更されだいぶイメージが変わったのでそれに合わせサイドバーなどを変更します。

CSSを変更します。
■まずはカレンダー部

.calendarhead {

padding:4px 0px;

font-weight:bold;

background-color:#F1F1F0;

text-align:center;

color:#5D5D5D;

font-size:12px;

font-family:Verdana;

width:100%;

}

の background-color:#F1F1F0;
を background-color:#89C319;

color:#5D5D5D;
を color:#FFF;

.calendarhead a{

color:#5D5D5D;

}

.calendarhead .calendarday{

color:#5D5D5D;

}

の color:#5D5D5D;
を color:#FFF;

にそれぞれ変更します。

■sideberタイトル部

.sidetitle {

padding:4px 10px 4px 10px;

font-weight:bold;

background-color:#ECECEB;

font-family:Verdana;

}

の background-color:#ECECEB;
を background-color:#89C319;

に変更し color:#FFF;
を追加します。

緑ばっかりになってしまったので、リンクのテキストをオレンジにします。

a{

color:#7C9907;

text-decoration:none;

}

のカラーを ＃FF6633 に変更します。

変更前

変更後

こんな風に変わりました。

デザインのコツとしては、同系色や反対色をうまく使うと少ない色でうまくまとまります。

| → コメント (0) | ∇ Seesaa |