動くバナー(1)

『動くバナー(1)』

「動くバナー」というタイトルをつけましたが、 「アニメーションGIF形式のバナー」 のことです。バナー広告でよく使われてますよね。画像がチカチカ変わるので目立ちます。

ところで「GIF形式」って何のことかご存知ですか?
画像形式のことなんですけど、「形式」って日本語がそもそもピーンと来ないのは私だけ??? 「形式」を辞典で調べると、「様式・型」だって!なにそれ。
この「画像形式」というのは、画像編集ソフトで何かの画像を加工した後、WEB上で表示できるように保存する際、目にする言葉です。デジカメの写真をPCに取り込んで、HP用に縮小したり文字を入れたりしますよね? それをネット上にアップするためには「GIF形式」か「JPEG形式」かを選んで保存しなければなりません。

現在インターネットで使用されている画像の多くが「GIF形式」か「JPEG形式」です。他にも色々あるのですが、ポピュラーなのはこの2つ、それぞれ特徴があるのです♪

GIF形式
色の数を減らすことで圧縮する。元々色数の少ない画像に適している。例えばイラスト、ロゴマーク、平面的な絵に向いている。

JPEG形式
画質そのものを劣化させて圧縮する。元々色数の多い写真やグラデーションがかかっている画像に適している。

ただし、この2つはケースバイケースですけどね♪ 何か画像を保存する際は、どちらの形式がよりきれいに見えるのか比べてみてください。画像の重さも関わってきますしね。重い画像(大抵はバカデカイ写真)は全部読み込むのに時間がかかり、見ている側はイライラしま~す。どうしても高画質で見て欲しい写真は別ですが、挿絵っぽくアクセントで置く写真なら、あまり大きくしないほうが、アマグリーノは良いと思います♪♪♪

画像の話になったのでついでに 「ALT」 のことに触れちゃいます。
完成しました!
左の画像にマウスをあてて、ちょっとだけ待ってください♪
白い吹き出しに「完成しました!」って出ますよね。これが「ALT」です。

楽天HPなら「画像の名前」で入力できます。
HTMLソースだと
<IMG src="--(画像のファイル名)--" ALT="--(画像の代わりの文章)--"
となります。「ALT」はもちろん日本語でも英語でもOKです。

「ALT」は必ず記入しないといけないそうです。アクセスしてくる人の中には画像の表示をオフにしている人もいるし、中には目の見えない方もいるので、その画像が何であるのか、前後の文脈から考えてわかるようにしておくのが、そのサイトを作る人間の責任かもしれませんね。

かなり話がそれました!「動くバナー」でしたよね。「アニメーションGIF形式」とはつまり、アニメみたいにチカチカ動く、GIF形式の画像のことです♪

今回は「Photoshop」と「ImageReady」を使って作ってみます。「ImageReady」や「Fureworks」などのソフトを使うと簡単にGIFアニメーションを作ることが出来ます。



© Rakuten Group, Inc.
Create a Mobile Website
スマートフォン版を閲覧 | PC版を閲覧
Share by: