Lynx でダメにならないページを作るには
Lynx Optimized Pages!
ところで Lynx って知ってます?(汗;)
20134 accesses since 2001/07/27.
2 accesses per day.

[ TOP ]


目次:

画像を表示するときは ALT をつける

よく見られる間違いの中に
<IMG SRC="CherryBlossom.jpg">
とだけ記されているページがあります。この表記は Lynx では [INLINE] や [LINK] [IMAGE] と表示されてしまい、絵の持つ意味がまったくわからなくなってしまいます。特に絵によって飛び先の ページの内容を表していたりすると、
[LINK] [LINK] [LINK] [LINK]

     [INLINE] [INLINE]

[LINK] [LINK] [LINK] [LINK]
のようにまったく内容がわからなくなってしまいます。このような書き方をされてしまうと、Lynx ユーザは、画面下方に表示されるリンク先 URL を見て内容を判断するしか方法がなくなってしまう のです。しかし、そうそう簡単に判断できるようなディレクトリ名・ファイル名になっているはずも ありません。

<IMG SRC="CherryBlossom.jpg" ALT="桜の写真"> とするだけで、 そのページの内容を把握しやすくなります。ALT は IMG を記述するときには必ずつ けるようにしましょう。画像が特に意味を持たない場合は ALT="" としておくの がいいでしょう。

この場合、決して

<IMG SRC="CherryBlossom.jpg" ALT="CherryBlossom.jpg">
などとしてはいけません。これでは ALT をつける意味がないのです。例えば IMG タグを囲む A タグ を使用した場合、

<a href="#new"><img src="gif/new1.gif" alt="gif/new1.gif" width="31" height="12"></a>
と書くと、画像を表示できるクライアントを使っているユーザには
gif/new1.gif
のように見えますが、Lynx の場合は
gif/new1.gif
としか見えません(リンク先 URL の情報はある程度見えますが)。これでは情報が正しく伝わりません。
<a href="#new"><img src="gif/new1.gif" alt="新着情報" width="31" height="12"></a>
と書いておけば、過不足なく情報を伝えることができます。

ALT を書けばいいというものではないということがおわかりいただけたでしょうか。


meta http-equiv="Refresh" を使いたいときは

あるブラウザは独自拡張を施して、指定時間後に内容を更新できるようになりました。 クライアント・プル(client pull)という方法です。 <META HTTP-EQUIV="Refresh" CONTENT="time; url=URL"> でおなじみです。CONTENT は time で指定した時間が経過すると URL に飛ぶ、 という指定です。URL を省略すると、現在の URL を pull するものがほとんどのようです。 この指定は META タグなので、<head></head> 内に記述するのが正しい記法です。

実は Lynx も 96/08/02 に Refresh に対応しました。auto pull を行うわけではありませんが、 pull すべき URL を表示してくれます。しかし、この機能が使えないブラウザ(怠惰なプロバイダでは Lynx の対応バージョンがインストールされていない場合もある)では永久に新しい URL にたどりつくことはできません。Client pull を使う場合は新しいページへ飛べるように HREF アンカータグを入れておくべきです。


JavaScript を使うときは

Lynx には JavaScript は装備されていないので、リンクをする場合に JavaScript に依存する書き方を すると Lynx では悲しいことになります。たとえば

<form name="jump" action="index.html">
 <select name="file" onChange="load();">
  <option value="../index.html">戻る
  <option value="1.html">説明 1
  <option value="2.html">説明 2
  <option value="3.html">説明 3
  <option value="4.html">説明 4
  <option value="5.html">説明 5
  <option value="6.html">説明 6
 </select>
</form>

このような form で飛び先を指定できるように JavaScript で load() 関数を記述すると、Lynx では submit のない form が出てくるだけなので選択することしかできません。

また、1998年08月26日ごろまで奈良先端科学技術大学院大学のページは、このように記述されていました。

<SCRIPT LANGUAGE="JavaScript">
   var m=1,n=3,r;
   r=Math.floor(n*Math.random()+m);
   if (r<2){
      location="indexr.htm";
      }
      else
      if (r<3){
         location="indexg.htm";
         }
         else{
         location="indexb.htm";
         }
</SCRIPT>

BODY の中身がこれだけです。JavaScript を解しない web browser ではなにも表示されません。

決してこれらのページの真似をせず、かならず目的のページを見てもらえるように通常のアンカータグも どこかに入れておくべきです。


ISMAP を使う時は

クリッカブルマップはビジュアルに訴えることができるので GUI な環境では便利ですが、Lynx ではある手段を使わなければ クリッカブルマップを実現できません。そもそもビジュアル的な要素を HTML で実現しようという ことに無理があったのです。

やはり ALT="" を入れる方法や、USEMAP を使う、という手もあります。

<A HREF="image.map">
<IMG SRC="map.gif" ALT="" USEMAP="#map" ISMAP>
</A>
<MAP NAME="map">
<AREA SHAPE="RECT" COORDS="20,40,80,90" HREF="1.html">
<AREA SHAPE="RECT" COORDS="210,60,320,120" HREF="2.html">
<AREA SHAPE="RECT" COORDS="15,160,110,250" HREF="3.html">
<AREA SHAPE="RECT" COORDS="155,145,235,215" HREF="4.html">
<AREA SHAPE="RECT" COORDS="384,110,455,185" HREF="5.html">
<AREA SHAPE="RECT" COORDS="255,270,355,330" HREF="6.html">
<AREA SHAPE="RECT" COORDS="400,205,465,260" HREF="7.html">
<AREA SHAPE="RECT" COORDS="145,240,235,285" HREF="8.html">
<AREA SHAPE="RECT" COORDS="120,265,175,330" HREF="9.html">
</MAP>
USEMAP を使用してもクリッカブルマップを使わなくても目的のページへ飛べるように、別に HREF アンカータグを用意するべきです。

jweblint を使ってみる

Neil Bowersさんが作った weblint石川雅康さんが日本語対応したものが jweblint です。 ページを作成する人にはぜひ導入してもらいたいツールです。

たとえば

<html>
<head>
<title>test</title>
</head>
<body>

<img src="dame.gif">

</body>
</html>
といったページに jweblint をかけると
dame.html(4): HEAD の中に <LINK REV=MADE HREF="mailto..."> が見つかりませんでした.
dame.html(7): IMG に ALT テキストが定義されていません.
dame.html(7): IMG タグに WIDTH 及び HEIGHT 属性を設定することで, 幾つかのブラウザでの見栄えを向
上させることができます.
という警告を出してくれます。非常に便利です

現在のバージョンは jweblint 97 v0.12 です。わたしの設定でデフォルトから変更したのは

extension Netscape
enable mailto-link
enable img-size
くらいです。この設定だと、世の中のほとんどのページが warning をくらいます。enable mailto-link のためなのですが、Lynx では <LINK REV=MADE HREF="mailto..."> があるとワンキーで そのページの作者へコメントができるのです。非常に便利なので、他のブラウザにも装備して もらいたいものです。

最終手段

Lynx で見てみる。結果的にこれが一番でしょう。Lynx をインストールできない場合は「あなたの HTML は Lynx でどう見えるか?」や「Lynx ではこう見える」を利用するのが吉。

最後に

いつから HTML はレイアウト言語になったのでしょうか。CSS はブラウザに依存しないのでいいですね。

筆者は Lynx で見ても情報がじゅうぶんに伝わるページに非常に好感を持ちます。それだけです。


勝手にお仲間のページ:
改定履歴:
©1996-99 Kazuya 'Sharl' Masuda <sharl @ hauN.org>

$Id: LynxDeDame.html,v 1.17 1999/03/31 15:46:39 sharl Exp sharl $