投稿者 スレッド: 知っているようで知らないGIF、JPG、PNGの違いについて  (参照数 468 回)

admin

  • Administrator
  • Hero Member
  • *****
  • 投稿: 58823
    • プロフィールを見る
知っているようで知らないGIF、JPG、PNGの違いについて
« 投稿日:: 1月 10, 2016, 07:51:17 pm »
1.複数行置換
http://pasopia.velvet.jp/sub/soft/mlrep/index.html
複数行置換のレビュー
http://www.vector.co.jp/soft/review/win95/util/se407023.html

ホームページを作成していると、サイト構成の変更などでリンクするページを変更したい場合がある。それも作成済みのページが大量(複数ページ)にそんな時に、htmlファイルを変更することになるが、一枚一枚変更するのは面倒、そして間違えも起こす。(こんな定例的な作業は人間がやるものではない。コンピューターの得意なところ)そんなときに便利な文字、文章を置換してくれるソフトです。秀丸などのエディタは同一文書内であれば置換は簡単ですが、他の文書まで一括で置換するのは難しい。

ここに紹介する「複数行置換」は一括置換。それも複数行に渡る文章、単語でも可能です。

2.画像GIF、JPG、PNGの違い
知っているようで知らないGIF、JPG、PNGの違いについて

・GIF(Graphics Interchange Format) 拡張子.GIF
GIFは最大8ビット(256色)までの色を扱うことのできる圧縮画像形式です。256色以上は必要ないロゴ、リンクボタン、アイコン、アニメ調のイラストなどに向いています。また背景を透明化することも出来ます。アニメーションGIFも作成出来ます。

・JPEG (Joint Photograph Experts Group)    拡張子.jpg
JPEGは24ビット(1670万色)まで扱うことができる圧縮画像形式です。 このため、多くの色数を必要とする写真などに向いています。 また、グラデーションのように色調が連続して変化する画像に向いています。ロゴやアイコンなど平坦なイラストをJPEGで保存すると滲んだように汚くなります。
JPEGは不可逆圧縮と言って、圧縮を繰り返すと段々画質が劣化します。したがってオリジナルからの圧縮は少ない回数にした方が良い。逆にGIF、PNGは可逆圧縮と言います。圧縮を繰り返しも画質が劣化しない。

・PNG(Portable Network Graphic)    拡張子.PNG
PNGは「ピング」と読みます。PNGには、「フルカラーにも8bitカラーにもすることができる」 「圧縮率が高く同じ内容のGIF画像より10%~30%程度ファイルサイズが小さくなる」 「複数の透過色を指定できる」APNG画像としてアニメーションも作成出来ます。PNGはW3C(World Wide Web Consortium)が推奨する画像フォーマットです。 最近のWebブラウザで最新バージョンであれば問題なく表示出来る標準のフォーマットになっています。

3.Picture Cutout Guide Lite(画像切り抜きソフト)
http://pasopia.velvet.jp/nota2/nota/?20160108092630

写真の中の人物、花、車などを切り取りたい場合があります。以前紹介した「PhotoFiltre画像処理ソフト」も優れた切り抜き用ソフトですが、マウス操作も慎重にする必要があります。「Picture Cutout Guide Lite」はそれに比べてマウス操作もある程度適当に輪郭(内側と外側)を書く、そして背景部分を塗りつぶす。それだけで輪郭を自動で検出して切り抜ける。ソフトです。jpg、gif、pngで保存可能。透明化はJtrimを使って行います。

写真の中の人物などの輪郭切り取りはこのソフトにお任せ!
http://blog.goo.ne.jp/takafumifujiwara/e/efd09568b82c820e88f729492c45645a
複雑な輪郭でも簡単に切り抜くことができる「Picture Cutout Guide Lite」
http://blog.layer8.sh/ja/2011/10/29/picture-cutout-guide-lite/

ダウンロードは下記のURLから「Picture Cutout Guide Lite」Download Lite versionをクリックしてください。日本語OSを使っている人は日本語でインストール出来ます。
Free Photo Editing Programs
http://tintguide.com/freeware.html

「Picture Cutout Guide」 - オブジェクトの輪郭をマウスでドラッグするだけ。簡単操作のトリミングソフト
ここに紹介してあるのはPicture Cutout Guideで有償版の試用版的なもので、切り抜いた画像の保存はこのソフト特有の拡張子でしか出来ません。(使い方はこのURLで説明しています)
http://www.vector.co.jp/magazine/softnews/160108/n1601081.html?ref=top

4.平安京オーバレイマップ(立命館大学)
http://www.arc.ritsumei.ac.jp/archive01/theater/html/heian/
京都市明細図オーバーレイマップ(立命館大学)
http://www.geo.lt.ritsumei.ac.jp/meisaizu/googlemaps.html

上記の平安京オーバレイマップは京都の現在地図に過去の遺跡の地図を重ね合わせて見られるようにしたオーバーレイマップです。平安京時代の御所、大極殿の位置、御土居(洛中、洛外の区別)の位置、信長が謀反で亡くなった本能寺の位置など興味ある対象を色々見ることが出来ます。京都市明細図オーバーレイマップは現在地図に戦前、戦後の地図を重ね合わせて見られるようにしてあります。また遺跡の地図の透明度を変えることも出来ます。

オーバーレイマップは Google Maps JavaScript API V3を使用して作ることが出来るようです。都筑区も石器時代、縄文時代の遺跡などが一杯ありますが、こんなオーバーレイマップにすると都筑区の魅力がアップするのではないでしょうか?Google Maps JavaScript API V3を使う技術は何とかなりそうですが、遺跡の位置などの場所を特定した地図を作ることが難しそうです。いつかチャレンジしてみたい。

Google Map オーバーレイマップ
http://hkuma.com/rail/gmaplayer.html
Google Maps API Version3 日本語ドキュメント(非公式)
https://sites.google.com/site/gmapsapi3/