備蓄艦隊 ～艦これ航海日誌～

今日は（も？）最初に断っておきますが、艦これの話題はありません。連日艦これ要素が薄くて大丈夫かな…。話題が無いから仕方ないよね（精一杯の言い訳）
この記事は提督向けというよりブログ管理人、もしくはブログを始めようとしている人向けの内容です。本当は他の提督仲間の用にサブブログででも書くようなことなのでしょうがここしか無いので…。



昨今様々なSNSが作られ、一時期に比べ下火となりつつありますが未だにブログという存在はまだまだ多く残っています。手軽さや機動性を考えればツイッターにはまるで及ばないブログも書きようによっては引けをとらないものでしょう。

例えば攻略記事。画像と文字情報が入り乱れる記事はTLが流れ続けるツイッターで書いても意味が無いでしょう。重要なところを大きくしたり色を変えたりするのもブログ優勢。
ネタ記事も同様です。どちらも単発での情報量とTLに流れていかないというのが強み。

ブログがなかった時代、ネットにあったのはHPでした。当時、やはりゲームネタでHPを立ち上げようとしたことがありましたが知識がなくて断念したことがありました。今でもよく分かっていませんがHTMLタグを理解しないといけないんですよね？
HPビルダーなんかも持っていなかったので敷居は高かったです。
ブログはある程度決まった状態で書き始めるのでかなり手軽に始められます。自作で色々作ろうと思うとやはり大変ではありますが大体のものはすでに作られた後であると思います。便利ですね。



このブログであるfc2をベースに書きますが、他のブログサービスでも似たようなものでしょう。
ある程度決まっているとは言っても初期状態で始めるのはやはり個性が弱い。まず始めるのはテンプレートの決定からでしょうか。大まかなサイトデザイン。サイドバーはあるのか？　あるなら左か右か、両方か。色合いは？
そういったものを決めるわけですが、有志の方が作ったものが公開されているので選んでお借りするだけなので知識も何もいりません。感性に任せて選びます。

テンプレートが決まれば後は埋めるだけ。画像をいれたり、カウンターを付けてみたり、カテゴリ別に分けてみたり…。画像はこのブログだとTOPにあるタイトルが置かれている金剛とか。
他にも面白いパーツは多いので色々いれてみたり。ゴチャゴチャし過ぎないのがいいですよね。うち？　思いつくものバンバン入れているのでゴチャゴチャです！

基本を作れば後は内容を書くだけ。面白い記事、ためになる記事を量産するだけでアクセスうなぎ登りでお仲間じゃんじゃん、リンクのお誘いでモテモテです。簡単ですね！　で、どういう風に書けばそうなるのか誰か教えて下さい！

その辺は2年半やってまるでわからないので飛ばして次が本題。



長い前置きになりましたがやりたかったのはこの話。前から友軍提督のブログを見ていて「勿体無い」と思うことがありました。それは画像の上げ方。
アスペクト比が崩れていたり、元ファイルが小さすぎて拡大しても見えなかったり…。一手間入れるだけでだいぶ変わるのです。

私のやり方はこうです。これはこれで間違っているかもしれませんが…。
まずはこちらの画像



戦艦三笠です。普通の写真に見えますがちょっと問題があります。
ブログにかぎらずネットに上げるファイルは常にその大きさに注意せねばなりません。fc2ブログだと1ファイル辺り2MBまで（有料会員なら5MB）
この写真は4.7MBあり、有料会員でもギリギリの容量です。4928*3264という巨大な大きさ。見た目上は小さくしてありますがブログに上げるにはややオーバーですね。開くにも重いですし。


次にこちら



小さくしてからアップすればいいじゃん、というのは一応正解。うちのブログだと横幅が500程度が限界ラインなのでそのくらいまで縮小してみました。
しかし今度は拡大してみても細部は分かりません。拡大しても右側の建物の前にある看板の文字なんて潰れて読めませんしね。看板とかならまだいいですが攻略情報とかのExcelとかの文字が潰れてしまったらその画像の意味がなくなってしまいますしね。




じゃぁその中間にすればいい、ということで1200*794というサイズに落として上げました。ただここで「見た目上」のサイズをいじってあげないとテンプレートをぶちぬいて写真が居座ったり、あるいは一部しか見えなかったりします。
ではどうやるか？

ブログはHTMLタグを理解していなくてもいいとは言いましたが、多少いじれると便利に使えます。
この写真のHTMLタグは
＜a href="http://stockfleet.jp/img/1193.jpg/" target="_blank"＞＜img src="http://blog-imgs-94.fc2.com/s/t/o/stockfleet/1193.jpg" alt="1193.jpg" border="0" width="500" height="331" /＞＜/a＞となっています（機能させなくするために一部全角へと変えてありますが）

重要な部分は width="500" height="331 これ。これが見た目上の大きさになります。元ファイルは1200*794だけどブログ上は500*331で表示しますよ、としているわけです。
ここで画像をクリックして拡大すると元ファイルが表示されるため看板の文字がかろうじて見えるはずです。実際にはこの設定のままだと1200までは表示できないようですが…。


もう一つはアスペクト比の調整。
1200*794を500*331に変えたのはアスペクト比、縦横比を変えないように計算して直しました。これを適当に500*200とかにすると…



三笠先輩がデブった！ということに。これでも画像をクリックすれば正規の物が表示されるので問題はないといえばないのですが、やはりパッと見も重要ですよね。単純な比率計算ですのでこれもすぐに出せるはずです。


さて、まとめると画像・写真を上げるには以下を注意するだけ

・画像自体の容量を小さく、でもほどほどに
・見た目上はwidth= height= をいじってブログの幅に合わせて
・小さくするときはアスペクト比を崩さない

これだけで見やすい記事になるはずです。
色々と偉そうなことを書きましたが参考になれば幸いです。

関連記事

• やれやれだぜ
• 手軽さと一手間
• 食欲の秋

category: 雑記

thread: 艦隊これくしょん～艦これ～ - janre: オンラインゲーム

なるほど！　面倒くさがりだったので、オンラインで適当に全画像を7割圧縮してボン！と載せただけだったので、ありがたいです！
あそこを弄ればよかったんですね……ということでこの前のコメント返信と同時に弄りなおしてきます(｀･ω･´)ゞ

Re: タイトルなし

>abcさん

お役に立てて光栄です。この辺ブログのマニュアルにもあまり書いてない感じなので慣れないと難しいですよね。
この前の記事拝見しました。物凄く見やすくなりましたねぇ。また佐世保へ行きたくなる想いが強くなりました。

こんにちは～(*'▽'*)

今まで、画像の処理なんて考えたことなかった(;ﾟдﾟ)
目から鱗です(o゜▽゜)o
次からは少しは考えよう(´▽｀)

Re: タイトルなし

>ちっぴーさん

こんばんは～。

画像を上げるからには見てもらいたいですからねぇ。見やすい・目を引くサイズにした方が見せる側も見る側も満足のwin-winですね。
赤城、楽しみにしてます。

ついでといってはなんですが、FC2の場合普通に画像をあげただけだと、クリックしても原寸サイズ表示をしてくれないので…

<a href="http://newbeeshipmodel.blog.fc2.com/img/000550_2000.jpg/" target="_blank"><img src="http://blog-imgs-93.fc2.com/n/e/w/newbeeshipmodel/000550_2000.jpg" alt="瑞鶴改二甲 航空甲板" border="0" width="400" height="266" /></a>

上側のタグの画像アドレスを、下側のアドレスと同じに書き換えいてやると、クリックした際に原寸表示されます。

私の場合、デジイチで撮ったそのままだと6016x4000なので、長辺2000にリサイズしてます。
ブログのテンプレは多少改造して幅800まで表示できるので、基本400ｘ266表示で横2枚、大きくしたいものは800ｘ532表示にしてます。

Re: タイトルなし

>ハリさん

なるほど。そういう処理をしてやれば原寸表示可能でしたか。精密な写真とかは使ってみたいですね。
こういうところをマメに工夫すると見やすいレイアウトになるから侮れませんねぇ。