小さな画像

画像は文字と同じ扱い

そもそも画像は文字と同じ扱いですから、単に行の中に<IMG src="URL" alt="代替文字列">と書き込むことにより、文章の中に並べることができます。このようなものを行内要素と呼ぶことがあります。

←このように段落の最初に画像を置くのもいいですし、途中にも入れることができます。

途中<img src="images/ninjin0.gif" alt="にんじんの絵">にも
入れることができます。

このような画像は文字の大きさに合わせて作りますが、文字の大きさは見る人の側のブラウザで変えることができますから、厳密に大きさを合わせようと考えない方がいいでしょう。作る側で大きさとレイアウトをガチガチに固めて崩せないようにするやりかたもないわけではありませんが、その場合はきちんと考えないと相手に不便をかけることになります。

htmlの元々の思想は、ウインドウの大きさは見る人の都合で変えられるようにするということです。ワープロとは違います。でも企業の広告ページや買い物をさせるようなページの場合は幅を固定して、小さなウィンドウの場合はスクロールしてもらうというやり方も増えています。

小さな画像をつくる

ここに使われているピンやニンジンは16×16ピクセル程度の大きさです。小さすぎて、PaintShopProで作るときも、ブラシの太さは1で、拡大して1点1点を考えながら塗りつぶすような作業になります。

例えばピンとニンジンを拡大すると次のようになります。

 

一応、影がついて立体になっていますが、小さいのでかなりいい加減でもそれなりに見えるはずです。特にピンでは十字の白い部分と床の薄い影がポイントです。


聖愛高等学校
http://www.seiai.ed.jp/