home
information

for contents

how-to HTML files

default layout

browsers

pictures

table

frame
upload
tags

form
bbs

HP Guide for Beginners(タイトルロゴ)

  (※ PC・タブレットでブラウザーの横幅が大体960px以上の時;
    テキスト中のリンク(下線(一本線)付きのテキストは全てリンクします)が有効になり、
    画面左下に"タグ解説ページ"が"別窓で並行表示"されます)



["jpeg or gif?"]

---もちろん、テキストのみでHPを作ってもかまわないわけですが、"美しいレイアウト"のページを作るには、やはりイメージ(画像)は不可欠でしょう。
---イメージをブラウズさせるには、当然、(HTMLファイル以外に)イメージファイルが必要ですが、HPで使えるファイル形式は"jpeg(ジェイペグ)"、"gif(ジフ、またはギフ)"、および"png"だけ、つまり、"ペイント"で扱っているBMPファイルや、Macで使われているPICTファイルは使えません。
(pngは新しい画像形式で、多くの利点を持っていますが、NC, IEとも、最新のバージョンでも表示を完全にはサポートしていません。
(くわしくは、こちらのサイトを参考にして下さい))

---そこで、最低限、ファイルコンバータ(形式変換)ソフトが必要なわけですが(フリーウエアやシェアウエアであります)、できれば、jpegとgifを扱えるグラフィックソフトを手に入れた方がいいでしょう(リッチでアートは大の得意という方は"Photo Shop"、リーズナブルなものなら"Paint Shop Pro"などが一般的です。---また、こちらも、フリーウエアやシェアウエアがいろいろあるようなので、探してみて下さい)。---あるいは、デジカメを持っている方なら、接続キットにファイルコンバータの機能が付いているはずですので、そちらを使うことも可能です。


〔jpegファイルとgifファイルの特徴〕

この二つのファイル形式は、元々、インターネットやパソコン通信で効率良くイメージデータを転送するために考え出されたものなので、ファイルの容量が(BMPファイルなどより)小さい反面、いろいろ欠点(というか"制約")があります。
---それぞれのファイル形式の特徴を挙げると、

 (jpeg)
  ・色数はフルカラー(1600万色)
  ・圧縮率が高い(品質が低い)ほどファイルの容量が小さい
  ・輪郭のはっきりした"イラストらしいイラスト(?)"だと、輪郭がにじんで汚く
   見えることがある

 (gif)
  ・色数は最大256色
  ・色数が少ないほどファイルの容量が小さい
  ・色数が(特に)多い写真の場合、似た色で置き換わるため、汚く見える
  ・輪郭ははっきりしている

(---ちなみに、jpegとgifのファイル容量の関係は(イメージによっても変わってきますが、写真の場合だと)、

  gif256色 = jpeg品質約98.5%("平均"で)

となります)

---以上から、jpegは写真、gifはロゴやイラスト(グラフィックソフトにもよるのでしょうが、最初から256色で描くより、フルカラーで作ったイメージを減色した方が"きれい"にできるようです。各自試してみて下さい)に向いていそうだと推測できると思います。

---gifの場合、これくらい減色するとどんな見え方になるだろうか、とだいだい予測できるし、また、当たるのですが、jpegの場合は、"品質が50%だから、ファイルの容量は半分、'見栄え'も半分"とはなりません。
---写真によってかなりバラツキがありますが、中には、70%くらいにしても見た目はほとんど変わらないものもあります(ファイルの容量は100%の(同じ)画像の1/5~1/7くらい)。---でも、印刷すると一目瞭然なので、、"ぜひ印刷してもらいたい"という人は、サムネイルにして品質100%の写真を使って下さい。

  NYの夕景の写真(jpeg品質100%(34.3K))NYの夕景の写真(jpeg品質75%(7.73K))
     jpeg品質100%(34.3K)jpeg品質75%(7.73K)
***
 NYの夕景の写真(jpeg品質50%(5.05K))NYの夕景の写真(gifファイル(20.2K)
jpeg品質50%(5.05K)       gif256色(20.2K)
NYの夕景の写真(jpeg品質100%(34.3K))
 jpeg品質100%(34.3K)

NYの夕景の写真(jpeg品質75%(7.73K))
 jpeg品質75%(7.73K)

NYの夕景の写真(jpeg品質50%(5.05K))
 jpeg品質50%(5.05K)

NYの夕景の写真(gifファイル(20.2K)
 gif256色(20.2K)


〔jpeg & gifの"オプション"〕

(プログレッシブjpeg)
ネットスケープでは、ふつう、イメージは上から表示されていきますが、このオプションでjpegファイルを保存すると、最初にモザイクがかったようなイメージがブラウズされた後、次第に鮮明になってくるので、見に来てくれている人のイライラを軽減することができます。
(NN6とIEでは、データが全部読み込まれるまで全く画像が表示されないようです)

(インタレースgif)
プログレッシブjpegの"gif版"です(こちらは、NN, IE共有効)

(透過gif)
このオプションで保存すると、ブラウザ上で背景が透けて見えます。(例えば、タイトルロゴとか、四角形以外のリンクボタンなどによく使われます)

(アニメーションgif)
文字通り"動くイメージ"ですが、うまく描くには"絵心と努力"が必要です(---私は挫折しました)。
グラフィックソフトのいくつかはこの機能をサポートしています。



→Next 

Copyright 1998-2018 (C) "Opal" All Rights Reserved.