<   2012年 09月 ( 19 )   > この月の画像一覧

岩屋堂散歩道ーコスモスからヒガンバナへー

ページへページへページへページへページへページへ

岩屋堂散歩道
稲刈りも終わり秋本番です。
コスモスは全盛を過ぎ、ヒガンバナ(曼珠沙華)が今盛りです。
d0181824_1459355.jpg
d0181824_14295597.jpg
d0181824_14482192.jpg

コスモス
d0181824_14291080.jpg
d0181824_14312065.jpg
d0181824_14325473.jpg
d0181824_14334419.jpg
d0181824_14341788.jpg
d0181824_14344171.jpg
d0181824_143594.jpg
d0181824_14355848.jpg
d0181824_14362139.jpg
d0181824_14371868.jpg
d0181824_14374211.jpg
d0181824_1438585.jpg
d0181824_14383150.jpg
d0181824_1439079.jpg
d0181824_14392461.jpg
d0181824_14395959.jpg
d0181824_14402423.jpg
d0181824_14413989.jpg
d0181824_14421835.jpg
d0181824_14425177.jpg

ヒガンバナ(曼珠沙華)
d0181824_14482192.jpg
d0181824_14485221.jpg
d0181824_14491365.jpg

天高く・・・・・
d0181824_8231130.jpg

以上です。
次回のテーマ投稿は10月1日の予定です。

by PC-otasukeman | 2012-09-28 08:30 | Comments(3)

スキン変更

ページへページへページへページへページへページへ

【ご相談内容】
エキサイトブログの標準スキン「HTMLベーシック」を使っています。
エキサイトブログの左端にあるタイトルをセンターに変更したいのですが、
簡単な方法があれば教えてください。
【回答】
下の画像はご相談者と同じ「HTMLベーシック」のブログ画面です。
左端にあるタイトル「お助けマン資料室」をセンターに変更する手順を説明します。
d0181824_11533076.jpgd0181824_11552980.jpg


ブログ画面を開き、マイブログにログインして、[設定]をクリックします。
d0181824_11533076.jpg

設定画面が出ます。
[スキン変更(PC)]をクリックします。
d0181824_11533547.jpg

スキン変更(PC版)の画面が出ます。
現在使用中のスキン「HTMLベーシック」の[編集]をクリックします。
d0181824_1154193.jpg

スキン編集の画面が出ます。
ここでTML基本スキンの編集が出来ます。
タイトルの位置の変更はCSS編集で行いますので、下の方が見えるようにスクロールします。
d0181824_115457.jpg

CSS編集の枠全体が見えるようにします。
この枠内の中で「DIV#TOP」を探します。「TEXT-ALIGN : LEFT」がタイトル文字の位置を指定するものです。今は「LEFT」(左端合わせ)となっていますので、これを「CENTER」(中央)に書き換えれば良いのです。
d0181824_11542887.jpg

CENTERに書き換え、枠下のボタンと文章が見えるようにします。(「CENTER」は半角です。centerと小文字でもOKです)
  そして[プレビュー]をクリックします。
注意:CSS編集、HTML編集に追記したり、変更したりするときは慎重に行ってください。
必ずプレビューで確認してから「保存」するようにしてください。
d0181824_11543637.jpg

プレビュー画面が出ますので、タイトルが中央に移っていることを確認して、プレビュー画面を閉じます。
d0181824_11545974.jpg

確認してOKであれば[保存]をクリックします。
注意:「保存をクリックすると同時にマイブログに反映されます」の前にチェックボックスがある場合はチェックを入れてください。
d0181824_1155363.jpg

保存された旨の画面が出ますので[元のページへ]をクリックします。
d0181824_11552482.jpg

マイブログに反映され、これで完了です。
d0181824_11552980.jpg


【ご注意】
「HTMLベーシック」の場合はタイトルの位置を「DIV#TOP・・・・・・・TEXT-ALIGN : LEFT」で指定していますが、この方法が全てではありません。スキンによって違いますのでご注意ください。

HTML CSSを極めるとマイブログのデザインは自由自在です。
しかし、残念ながら、お助けマンはこの道は初心者です。極めるには歳をとりすぎです。

by PC-otasukeman | 2012-09-27 14:00 | Comments(3)

画像の表示サイズ(完)

ページへページへページへページへページへページへ

下の画像はJPEGファイルで保存したものをアップロードしたものです。
【原画(手書) 32×32ピクセル⇒128×128ピクセル(拡大)】
d0181824_1324399.jpgd0181824_13252935.jpgd0181824_13261114.jpg

【原画(写真) 128×128ピクセル⇒32×32ピクセル(縮小)】
d0181824_13285337.jpgd0181824_13292048.jpgd0181824_13294950.jpg

縮小した画像はピンボケ画面になってしまいます。
画素数(ピクセル)が少なくなるので当然ですよね。

手書きの画像で縮小の秘密をもう少し調べてみましょう。
128×128ピクセルのサイズに描いたものです。(原画です)
d0181824_13392272.jpg

ペイントソフトで800%表示にして、1マス、1マス 黒色で描いたものです。
1マスが1ピクセルです。(絵柄部のみ表示してあります)
d0181824_13521896.jpg

【原画を 2分の1(64×64ピクセル)に縮小すると】
d0181824_1340231.jpg

800%表示
1マスが1ピクセルです。(絵柄部のみ表示してあります)
左上隅の2×2ピクセルは黒の四角になっています。原画は4×4ピクセルの黒の四角ですから納得ですね。
また一部のマスが灰色に変わっています。
四角のサイズと位置により1マスごとに黒ー灰色ー白になるということが分かります。
少ないマスで如何に原画のイメージを表現するかという技術なのです。
d0181824_13525973.jpg

【原画を 4分の1(32×32ピクセル)に縮小すると】
d0181824_13443423.jpg

800%表示
1マスが1ピクセルです。(絵柄部のみ表示してあります)
さすがにマスが少ないと難しいですね。ピンボケの理由も理解できたと思います。
d0181824_13533028.jpg


【まとめ】
以上で難解中の難解のテーマ投稿を終了します。
頭の片隅に残り、表示トラブルに遭遇したときにお役に立てば幸いです。

今回のテーマ投稿で気が付いたことです。
(1)画像は大きいサイズを用意しましょう。
大きいサイズの画像は縮小できますが、小さいサイズの画像は拡大できない場合が多いです。
画像加工ソフトで画像を開くと、拡大/縮小表示機能により大きい画像は縮小されて表示されますが、
小さい画像はそのまま表示されます。
アイコン表示を「大アイコン」に設定してもアイコンが大きくならないのは原画のサイズが小さいからです。
d0181824_16471987.jpg


(2)ブログ用の原画は大きいサイズをアップロードしましょう。
但し、アップロードする画像サイズの制限に注意しましょう。
エキサイトの場合は最大500KB(絵柄にも依りますが約1000×1000ピクセル)を超えるとブログの最大値に縮小されてしまいます。
相談室の場合、最大値は横幅520ピクセルです。

(3) 表示の拡大/縮小(拡大メガネ、ズーム、拡大レベルの変更等)の機能は画像サイズを変えるものではありません。32×32ピクセルの画像サイズが800%に拡大表示しても画像サイズは32×32ピクセルです。

(4)ディスプレイ 一杯に画像を表示するには、画面の解像度以上の画像が必要です。
  例えば解像度1366×766ピクセルのディスプレイであれば、横幅1366ピクセル、縦766以上の画像が必要ということです。

(5)画面の文字や画像は画面の解像度が低いほど大きく見えます。

      

by PC-otasukeman | 2012-09-26 16:50 | Comments(7)

画像の表示サイズ(3)

ページへページへページへページへページへページへ

前回は小さな画像を大きなサイズに拡大しました。
今回は反対に大きなサイズの画像を小さなサイズに縮小してみましょう。
下の画像は今朝撮影してきた彼岸花です。
トリミングで512×512ピクセルの画像に加工し、
左上隅に1辺が16ピクセル、8ピクセル、4ピクセル、2ピクセル、1ピクセルの黄色の四角を描き足して、デスクトップに保存。
保存した画像をアップロードしたものです。(2ピクセルと1ピクセルは見えないかもしれません)
この画像を4分の1(128×128ピクセル)、8分の1(64×64ピクセル)、16分の1(32×32ピクセル)の大きさに縮小してみます。
(トリミングについては別の機会に説明します。)
(私のブログの画像は横幅が最大520ピクセルですから、アップロードした画像は原寸で表示されています。)
左上隅の黄色の四角の見え方(大きさと色)に注目してください。
d0181824_13142471.jpg

お絵かきソフト「ペイント」を起動します。
デスクトップに保存した512×512ピクセルの彼岸花の画像を開きます。
  左上のボタンをクリックし、出てきたリストの[開く]をクリックします。
d0181824_10281279.jpg
開く画像を指定する画面が出て来ます。
  保存してある場所[デスクトップ]をクリックし、保存した画像[512ピクセル]をクリックします。
  選択された画像が右側に表示されますから、確認して[開く]をクリックします。
  (画像が表示されない場合は右上の表示切換えボタンをクリックしてください)
d0181824_1173492.jpg
512×512ピクセルの画像が画面に表示されます。
  画像の大きさは実寸です。ペイント画面の横方向が1366ピクセルですから、分かりますね。
d0181824_146155.jpg
次に表示を800%に拡大して見てみましょう。
 [表示]タブをクリックして開き、[グリッド線]にチェックを入れ、[拡大]メガネを何度かクリックして800%に拡大します。  1マスが1ピクセル
表示は左上隅の一部しか見ることができません。黄色の四角に注目してください。
d0181824_13414780.jpg
次にこの画像を4分の1(128×128ピクセル)のサイズに縮小します。
  表示を100%に戻して[ホーム]タブをクリックして開きます。
そして[サイズの変更]をクリックします。
d0181824_13551723.jpg
サイズ変更の画面が出ますので、単位を[ピクセル]にして、水平方向の数字を512から128に描き直し、[OK]をクリックします。
d0181824_14048.jpg
画像サイズが4分の1(128×128ピクセル)になります。
d0181824_1413714.jpg
表示を800%に拡大して見てみましょう。
1マスが1ピクセル  黄色の四角も4分の1になっていませね。
d0181824_14161636.jpg
同様にして8分の1(64×64ピクセル)に縮小したものです。
100%表示
d0181824_14284917.jpg

800%表示
d0181824_14301575.jpg

同様にして16分の1(64×64ピクセル)に縮小したものです。
100%表示
d0181824_1434246.jpg

800%表示
d0181824_14361265.jpg


今日はここまで。
画素、ピクセル、画像サイズ、画像サイズの変更、拡大/縮小表示・・・・
具体例を見ると理解できると思います。
次回はまとめてみましょう。

by PC-otasukeman | 2012-09-25 15:17 | Comments(3)

画像の表示サイズ(2)

ページへページへページへページへページへページへ

前回、32×32ピクセルの図案を描き、JPEGファイルでデスクトップに保存しました。
この画像を2倍(64×64ピクセル)、4倍(128×128ピクセル)の大きさに拡大してみましょう。
お絵かきソフト「ペイント」を起動します。
デスクトップに保存した32ピクセルの画像を開きます。
  左上のボタンをクリックし、出てきたリストの[開く]をクリックします。
  (最近使った画像をクリックしてもよいのですが、ここでは無視します。)
d0181824_10281279.jpg

開く画像を指定する画面が出て来ます。
  保存してある場所[デスクトップ]をクリックし、保存した画像[ロゴマーク32ピクセル]をクリックします。
  選択された画像が右側に表示されますから、確認して[開く]をクリックします。
  (画像が表示されない場合は右上の表示切換えボタンをクリックしてください)
d0181824_10284136.jpg

32ピクセルの画像が画面に表示されます。
  画像の大きさは実寸です。ペイント画面の横方向が1366ピクセルですから、本当に小さいですね。
  次にこの画像を2倍の大きさに拡大します。
  [ホーム]タブをクリックし、[サイズの変更]をクリックします。
d0181824_10285364.jpg

サイズの変更画面がでます。
単位の[ピクセル]にチェックを入れ、水平方向の数字を64に書き換えます。
[縦横比を維持する]にチェックが入っていますので垂直方向も64になります。
最後に[OK]をクリックします。
d0181824_10291171.jpg

2倍(64×64ピクセル)の大きさの画像になりました。  
d0181824_10292489.jpg

表示を800%に拡大してみましょう。
  [表示]タブをクリックし、[拡大]メガネを何度かクリックすると800%の表示になります。
  [グリッド線]にチェックを入れると画像の大きさが分かります。
d0181824_10294018.jpg

[ホーム]タブを開きます。
  グリッド線の1マスが1ピクセルです。 更に絵を描き足すことができますが、ひとまずこの画像をデスクトップに名前を付けて保存します。(保存手順は省略)
d0181824_10295639.jpg

デスクトップに「2倍(64×64ピクセル).jpg」が保存されました。
デスクトップに表示されているものはアイコンであり、実際の画像サイズとは関係ありません。
d0181824_10304590.jpg


同じようにして4倍(128×128ピクセル)の画像を作成してみました。
表示を800%に拡大してあります。
グリッド線の1マスが1ピクセルです。4倍になっていることが分かると思います。
d0181824_11392481.jpg

4倍(128×128ピクセル).jpgの名前でデスクトップに保存しました。
d0181824_1140041.jpg

アイコンの大きさに注目してください。表示は中アイコン表示です。
アイコンの寸法は小アイコン、中アイコン、大アイコン毎に決められています。
1倍の画像はアイコンの寸法に満たないため小さく表示されていますが、
2倍と4倍の画像は決められた大きさで表示されています。

次に、3つのサイズの画像をブログにアップロードしてみましょう。
画面の拡大レベルを100%に設定して見ると、
画面の解像度と1対1の関係で見ることができます。
私のパソコンは1366×768ピクセルに設定されていますので、4倍(128×128ピクセル)の画像の横幅は画面の横幅の約10分の1の長さに見えます。
32×32ピクセル
d0181824_1262621.jpg

2倍(64×64ピクセル)
d0181824_1264925.jpg

4倍(128×128ピクセル)
d0181824_1271491.jpg


今日はここまで。
次回は大きな画像を縮小してみましょう。

by PC-otasukeman | 2012-09-24 13:02 | Comments(0)

画像の表示サイズ(1)

ページへページへページへページへページへページへ

難しくて
なかなか理解できません。
【涙】

元気ばばさんからのコメントです。

ピクセル、画像サイズ、解像度・・・・難解中の難解のテーマです。
元気ばばさんのお気持ちは良く分かります。

少し趣向を変えて、
お絵かきソフト「ペイント」でその秘密に迫ってみましょう。
ピクセル、画像サイズ、解像度を理解して頂けると思います。
もう少し、我慢してお付き合いください。

[スタート]-[すべてのプログラム]-[アクセサリ]と開き[ペイント]をクリックします。
d0181824_15472893.jpg

ペイントソフトが起動します。
ある画像サイズが用意されています。
画像サイズを変更するために[サイズ変更]をクリックします。
d0181824_1548358.jpg

画像サイズの設定画面が出ます。
単位に[ピクセル]を選択し、[縦横比を維持する]のチェックを外し、水平方向、垂直方向ともの[32]と入力し、最後に[OK]をクリックします。
d0181824_15482046.jpg

画像サイズが小さくなります。このサイズが32×32ピクセルです。
画面全体の横幅が1366ピクセルです。中アイコンの大きさの画像を描こうということです。
d0181824_15483919.jpg

[表示]タブをクリックして開きます。
[グリッド線]にチェックを入れ、[拡大]を何度かクリックして最大の800%に拡大します。
グリッド線で仕切られたマスの数は横、縦とも32個になります。
1マスが1ピクセルということになります。
d0181824_1549449.jpg

[ホーム]タブに戻し、 [鉛筆]を持ちロゴマークを描きます。
鉛筆で書いても細い線にはなりません。1マスすなはち1ピクセルが1番細い線だからです。
1マス、1マス、色を付けていきます。
d0181824_15492935.jpg

描き終わったら[表示]タブをクリックし、[グリッド線]を消し、100%表示に戻します。
実物大のロゴマーク画像の表示に戻ります。
d0181824_15494978.jpg

この画像を[名前を付けて保存]保存します。[JPEG 画像]をクリックします。
d0181824_1550876.jpg

保存場所を[デスクトップ]にし、ファイル名を[ロゴマーク32ピクセル]にして、[保存]をクリックします。
d0181824_1635489.jpg

デスクトップにロゴマーク画像が保存されています。
  これは中アイコン表示です。
d0181824_1650949.jpg

[ロゴマーク32ピクセル]をダブルクリックして開いたものです。
  画像のサイズは32×32ピクセルになっていますね。
d0181824_16504157.jpg


今日はここまで、
まだまだ続きますが、明日はゴルフです。
続きは9月24日です。お待ちください。

by PC-otasukeman | 2012-09-20 17:10 | Comments(6)

解像度の設定

ページへページへページへページへページへページへ

解像度の設定
まずは解像度の設定を実行してみましょう。
Windows 7パソコンのケースで説明します。
(Windows XPはMoreをご覧ください)
デスクトップの画面でアイコンの無いところを右クリックします。
リストが出てきますので[画面の解像度]をクリックします。
d0181824_16443133.jpg

設定画面が出ます。
今の設定値が表示されています。
元に戻す時の為に必ず記録してください。
私のパソコンは1366×768 ピクセルに設定されています。これを記録します。
そして表示欄の右の[▼]をクリックします。
d0181824_16452263.jpg

解像度の設定目盛が出て来ます。
  ツマミをドラッグするか指定したい位置をクリックすると解像度の選択ができます。
  ここでは最小値の800×600ピクセルをクリックして見ます。
d0181824_16454886.jpg

ツマミが移り、800×600に変わったのを確認して、
何もないところをクリックしてから[適用]をクリックします。
d0181824_16461121.jpg

一瞬画面が黒くなりますが、心配はありません。
画面は800×600 ピクセルの表示に変わります。
  [変更を維持する]をクリックします。
d0181824_1646364.jpg

画面を確認して{OK}をクリックします。
d0181824_16471523.jpg

デスクトップの画面に戻ります。
表示画面の寸法も当然4対3の比率になっています。縦方向は600ピクセルです。
(ディスプレイは横長の画面です。画面の左右は黒くなっています)
d0181824_16473748.jpg

戻す時は①~⑦の手順で元の解像度を指定して戻します。

私の7パソコンの場合、次の解像度を選択できるようになっています。
① 1366×768 ピクセル(最大) 16対9
② 1280×768 ピクセル
③ 1280×720 ピクセル 16対9
④ 1280×600 ピクセル 
⑤ 1024×768 ピクセル 4対3
⑥  800×600 ピクセル(最小)

では、画面の見え方を比較してみましょう。
①、⑤、⑥の解像度に設定した時のデスクトップと「ミルク姫の部屋」の画面です。
 左 ① 1366×768 (16対9)       中 ⑤ 1024×768 (4対3)    右 ⑥ 800×600 (4対3)
d0181824_10321264.jpgd0181824_10332285.jpgd0181824_10341743.jpg
d0181824_1141271.jpgd0181824_11412759.jpgd0181824_11415097.jpg

文字の大きさ、アイコンや画像の大きさ、見える範囲の変化に注目してください。
横長の画面でも解像度を変えることにより、いろいろな表示が出来ることが分かったと思います。
今日はここまで、
次回はアイコンや写真画像等のサイズと表示に迫って見ましょう。

More Windows XPの 解像度の設定手順

by PC-otasukeman | 2012-09-19 14:00 | Comments(1)

画面の解像度(2)

ページへページへページへページへページへページへ

私のWindows 7パソコンのディスプレイの仕様を見ると、
15.5型ワイド(16:9)
TFTカラー液晶
1,366×768 ドット

とあります。
これは横13.5インチに1366 ドット(点)、縦7.6インチに768ドット(点)の表示素子が並んでいるディスプレイであることを示しています。
ドットの数は変えることはできません。ハードウエアの世界です。

一方、画面に表示される画像は画素(ピクセル)を横・縦に並べてドット上に表示します。
ピクセルの方はいかようにも変えることができると考えてください。
ソフトの世界ですからね。

ちょっと難しくなりましたが、ドットはハード、ピクセルはソフトと覚えてください。

【画面の解像度】
解像度とは画像の分解能力のことです。
解像度が高いと細部までよく見える画像になり、低いとぼやけた画像になりますね。
一般の解像度は1インチ当たり何ドット(何ピクセル)あるかという単位「ドット・パー・インチ(dpi)」で表されます。
しかし、ディスプレイの解像度は横×縦の画素数(ピクセル数)で表すことになっています。
1366×768ドットのディスプレイの最大解像度は1366×768 ピクセルです。
それ以下であればどんな解像度でも理屈上は設定できると考えてください。
下の画面はWindows 7パソコンの「画面の解像度」を設定する画面です。
d0181824_1516122.jpg

今の解像度は1366×768 ピクセルに設定されています。
最小を見ると800×600 ピクセルになっています。

今日はここまでにしましょう。
明日は解像度の設定手順を詳しく説明します。
アイコンの大きさの秘密が理解できると思います。

by PC-otasukeman | 2012-09-18 16:19 | Comments(0)

画面の解像度(1)

ページへページへページへページへページへページへ

【画面サイズ】
私の2台のノートパソコンの画面イメージです。
どちらも一般家庭用の標準モデルのパソコンで、
画面サイズは約15インチです。
(パソコンもテレビと同様に画面の対角線の長さでサイズを表します)
d0181824_13231028.jpg

【秘密1】
画面の横と縦の比率に注目してください。
16対9
新しいパソコン(Windows Vista、7)は横16に対して縦9の比率が主です。
この比率は地デジ化後のテレビと同じです。
4対3
古いパソコン(Windows XP以前)は横4に対して縦3の比率が主です。
この比率は古いテレビと同じです。
古い映画を新しいテレビで見ると画像が小さくなりますが、小さくなった画像は4対3です。

パソコンでテレビを見る機会が多いですから、この秘密は納得ですね。
皆さんのパソコンやテレビの画面を計って確認してみてください。

【秘密2】
この2つの画面でブログ「ミルク姫の部屋」を見ると次のようになります。
(寸法イメージが同じになるように調整してあります)
16;9                           4:3
d0181824_14245335.jpgd0181824_14251740.jpg

画像や文字の大きさに注目してください。
縦方向の見える範囲は同じです。
Windows 7の方が文字もミルクの写真も小さくなっています。


画像の見え方は画面サイズと解像度の設定によって決まります。

今日はここまで、
次回は「解像度の設定」です。

続く

by PC-otasukeman | 2012-09-17 16:00 | Comments(2)

秘密探しの答え

ページへページへページへページへページへページへ

次回のテーマ投稿は9月17日です。
「画面の解像度」の秘密に迫ります。


秘密探しの答えです。
① アイコンの設定を変えるとアイコンのサイズは変わりますが、
  アイコンの下のファイル名のサイズは変わっていません。

② 中アイコンから大アイコンにした場合、いくつかのアイコンは中アイコンのままです。

③ カレンダや時計の大きさはアイコン設定では変わらない。

④ しかし、画面の解像度を変えるとアイコンもファイル名もカレンダも時計もすべてのサイズが変わってしまいます。

これらの秘密を解明すると表示のからくりが分かるようになります。
それには解像度、画像の大きさ、画面サイズの理解が必要です。
時間をかけて少しづつ勉強していきたいと思います。
今週は時間がとれません、続きは9月17日までお待ちください。

by PC-otasukeman | 2012-09-12 15:48 | Comments(2)