ウェブリブログで写真を大きく表示する方法

BIGLOBEのウェブリブログは、
  広告等のブログパーツには比較的寛容で
  自由な貼付も可能ですが、
  肝心な記事での画像表示枠が、
  標準で横幅320ピクセルとなっていて
  写真を表示させるにはちょっと物足りない感じです。

自分事ですが
  昨年の9月にデジタル一眼レフカメラを買って
  ブログに写真を載せることが面白くなり
  他の方のブログを見学していて
  自分のも、もう少し写真を大きく表示できないかと試行錯誤しました

自分が日常使っているパソコンは
  ノート型で画面も10.1型と小さいので尚更です

そこで、既に、ブログの設定等に慣れた方には、
  今さら、あたりまえと思われる内容ですが
  同じように悩んでる方の
  何かの参考になればと思うので
  自分の経験を書き出してみました

あくまでもBIGLOBEのウェブリロブログでの設定ですし
  Windows XPでの操作です

失敗する可能性もありますので
  硬いことは言いたくないのですが
  くれぐれも応用の際は自己責任でお願いします
ブログが変になっても、
  おそらく自分には対応できないと思うので すみません


ブログの設定などについては、
  ウェブリ広場(BIGLOBE公式サークル)で検索すると
  答えやヒントも見つかると思いますので
  参考になります


それでは
  写真などの画像を大きくしたい場合

通常の画像貼付ですと、横幅が最大320ピクセルまでとなっています
(ブログの記事画面上の画像を右クリックしてプロパティをみると出ます)

ブログ記事の新規作成や編集で、「画像貼付」をした際

画像


などと表示されますが
  その文の「width="320"height="240"」の数字が表示されるサイズになります
(上記は3:4画面の設定ですが、height=の数値は、カメラの種類や元データの設定によって、いろいろあると思います)

一般的にブログのデザインは、サイドバーを横に設定されている方が多いので
(「ブログ」の「設定」「表示項目設定・ページレイアウト設定」が「左右」で設定)

片側だけのサイドバーなら「width="480"」位まではいけそうですが、
  限界を超えるとブログの枠が崩れたり、縦長の画像になってしまいます

「width="400"」位が無難なようです

この時、縦サイズも同じ比率で増やした数値に変えます

上記の例 「width="320"height="240"」なら
  480は1.5倍 「width="480"height="360"」
  400は1.25倍「width="400"height="300"」
 (小数点以下は四捨五入で処理)

もっと写真を大きく表示したい場合は、
  自分のブログのように、「ページレイアウト設定」で
  サイドバーの表示位置を「上下」に設定します

こうなるとサイドバーに設定した貼付物が上下にきますので
  ブログ全体のデザイン構成に影響する覚悟が必要です

横サイズは320の倍、640位までなら中心枠から、はみ出しません
  数値も2倍にするだけなので計算も楽です

「width="320"height="240"」は
「width="640"height="480"」になります

また、経験上、画像貼付の際、サイズを小さくするだけの選択より
  元々の画像サイズをカメラかソフトで640ピクセル近くに縮小したものを使用したほうが
  データーサイズの節約になるようです

自分の場合は、マイクロソフトの「ピクチャーマネージャー」を使うことが多いです
(Microsoft Office Picture Manager)
ペイントでも加工できますが、画像の劣化が大きいような気がします

結果的にブログを開いた時の反応の悪さ(重さ)への影響も少ないようです


【例】

w320xh240 標準(横型)
画像


w400xh300 横型
画像


w300xh400 縦型 縦撮り写真が多いなら、このサイズで統一すると
         画面上下の文書との収まりがいいかも知れません
画像


w480xh360 横型 横写真主体で、文書行数も必要なら
        一画面のバランスを意識するとこのサイズがいいような
画像



w640xh480 写真を前面に出すかたち 行数のある文書はスクロールが必要になります
画像


テンプレートによっては、さらに大きな画像も可能です



こんどは、時間があれば、元気玉の応用も書き込みたいと思います


画像
ランクアップにポチしてくれると嬉
人気ブログランキングへ


この記事へのコメント

2010年01月04日 16:53
明解なる御説明に感謝申し上げます。
2010年01月04日 17:26
凄いです。
色々と操作すると画像も大きくなるのですね。
アガキは音楽が好きだから、BGMにも興味が有ります。
って聞く方は迷惑かも知れませんが。好奇心旺盛です。
色々教えて下さい。<(_ _)>
2010年01月04日 20:27
こんばんは~♪

迫力あるし、鮮やかだし、いつもどうしてるんだろうと感服してたんですが、大変参考になりました、ドモです !
当方のブログはくだらない系なので大きさに拘りはないんですが、いざという時、是非とも使わせて頂きます !
2010年01月04日 21:06
気持だま 代わったんですね。 ナイスなオッサンは続投ですか?
かわいい記事内容じゃないけど ワンコの画像も見たかったので かわいい 押してみました。ついでにみんな見たかったので ガッツも押しました。
2010年01月04日 22:36
なるほど、これ面白いですねえ。今度やってみましょう。
ただ、文章との絡みがあるのでバランスが必要のようですね。
2010年01月04日 22:55
阿南龍子さん
何かの参考になれば幸いです

agakiさん
BGMのほうもいろいろ探りたいですね

ebi-suiさん
以前、熱帯魚を飼ってましたが
動画とかで面白いの作れたらと思ったりします
テラリウム・ブログみたいな・・・?

丸みさん
既に、いろいろと工夫されてますもんね
アニメGIFも自分で作れたらいいのですが
今は検索して探しています
2010年01月04日 23:39
明けましておめでとうございます。
今年も宜しくお願い致します。今日から会社だったのですが、休みが続いた後って仕事モードになかなかなれませんが、ただただ忙しい・・・1日でした。
とても明快な説明にもこの頭は付いて行けませんが、□地&○地さんは物事にとても丁寧に説明され研究熱心な方と言う事はわかちゃいました(笑)
出来ないけどブログ元気玉の説明も楽しみ~~

今年もこんな風ですが仲良くして下さいね^^

2010年01月05日 00:24
とっても参考になりました。
前に教えていただいたおかげで写真を大きくアップする
方法がわかってとっても重宝してます。
ありがとうございました。
ぽち。
2010年01月05日 10:42
サマンサさん
休み明けは特に仕事に行きたくないです
何歳になっても変わらないです

むーみんさん
あれだけのお弁当ですからね
毎回、見るのが楽しみです
2010年01月05日 19:29
親切&丁寧な説明をありがとうございました
私も写真の大きさは気になっていたんですよね~
今度、挑戦してみますね(^^)
2010年01月05日 22:12
kaworuさん どうもです
ブログの写真を拝見すると
元の大きさは 1283x866 あるようです
ブログで表示されている大きさは
画面をクリックして拡大しない限り
この4分の1の大きさですから
データー容量(サイズ)が無駄になってもいます
できるなら、カメラの設定かソフトの段階で
ブログ用の写真は大きさを圧縮できると
ブログを開いた時の読み込みの遅さを解決できるかも知れません
(今は最初の写真が表示されるまで、少し負荷がかかってます)
サイドバーも片側だけですから
1.25倍の「width="400"height="270"」なら問題なさそうです
2010年01月06日 14:26
うーなるほど。。。勉強になります
でも、ハムカツ理解できたような?
無いような(笑)
どんな事もできるのですね
2010年01月06日 15:06
たびたび、すみません
ご丁寧に私のデーターまで調べて、教えて頂きとっても嬉しいです♪
ピクセルを小さくする方法が分らなかったので
データーの容量を小さくしてやってみました(^^)
写真の大きさも、教えて頂いた内容を参考に早速変更してみましたよ~
写真が、大きくなって見やすくなりました
まだまだ勉強不足なので、これからも色々な事を教えて下さいね
今回は、どうもありがとうございました
2010年01月06日 17:05
ハムカツさん kaworuさん
ほんとうなら、せっかくのこういう情報は
運営会社のほうでもっと開示するほうが
ユーザーを増やして手放さないために
努力するべきと思います

自分の場合、画像のサイズ調整は
マイクロソフトの「ピクチャーマネージャー」を使うことが多いです
(Microsoft Office Picture Manager)
ペイントでも加工できますが、画像の劣化が大きいような気がします