Site Navigation

• Home
• Standards Articles
• HTML Articles
• CSS Articles
• Tutorials

alt

---

Example [Basic (Applet)]:

[This is not an actual Applet. They don't exist. And, if it was—Blacky's eyes would be spinning like hypnotizing pinwheels.]

Code [HTML]:

<applet code="Menehune.class" id="Psychotropical" width="172" height="288" alt="Small black cat »
with spinning green and black pinwheel eyes in hypnotizing trance">
<param name="image" value="very-small-scaredy-cat.jpg">
<param name="overlay" value="french-burlesque_hour.png">
<param name="href" value="http://www.flying-monkeys-in-the-observatory.com">
</applet>

---

Example [Basic (Area)]:

[Note: Titles have been included for mystery removal.]

Code [HTML]:

<p>
<img src="/images/tutorials/vague-Navigation_blocks.jpg" alt="Sites that should »
be viewed - Selected Navigation" width="264" height="575" usemap="#vague_Navigation_blocks_Map">
</p>
<map name="vague_Navigation_blocks_Map" id="vague_Navigation_blocks_Map">
<area shape="rect" alt="456 Berea Street" coords="64,503,91,529" »
href="http://www.456bereastreet.com/" title="456 Berea Street">
<area shape="rect" alt="A List Apart" coords="99,463,126,477" »
href="http://www.alistapart.com/" title="A List Apart">
<area shape="rect" alt="Snook.ca" coords="64,428,104,456" »
href="http://snook.ca/" title="Snook.ca">
<area shape="rect" alt="Box of Chocolates" coords="67,394,94,410" »
href="http://boxofchocolates.ca/" title="Box of Chocolates">
<area shape="rect" alt="adactio" coords="121,358,149,375" »
href="http://adactio.com/journal/" title="adactio">
<area shape="rect" alt="Jason Santa Maria" coords="55,334,97,380" »
href="http://jasonsantamaria.com/" title="Jason Santa Maria">
<area shape="rect" alt="Mezzoblue" coords="114,319,146,345" »
href="http://mezzoblue.com/" title="Mezzoblue">
<area shape="rect" alt="The Man in Blue" coords="68,303,88,323" »
href="http://www.themaninblue.com/" title="The Man in Blue">
<area shape="rect" alt="Jens Meiert" coords="67,278,85,302" »
href="http://meiert.com/en/" title="Jens Meiert">
<area shape="rect" alt="Robert's talk" coords="114,265,153,305" »
href="http://robertnyman.com/" title="Robert's talk">
<area shape="rect" alt="Juicy Studio" coords="68,256,82,274" »
href="http://juicystudio.com/" title="Juicy Studio">
<area shape="rect" alt="CSS Beauty" coords="64,226,84,247" »
href="http://www.cssbeauty.com/" title="CSS Beauty">
<area shape="rect" alt="Line25" coords="55,176,91,211" »
href="http://line25.com/" title="Line25">
<area shape="rect" alt="Smashing Magazine" coords="125,146,155,171" »
href="http://www.smashingmagazine.com/" title="Smashing Magazine">
<area shape="rect" alt="24 Ways" coords="70,145,88,158" »
href="http://24ways.org/" title="24 Ways">
<area shape="rect" alt="I Love Typography" coords="67,126,86,139" »
href="http://ilovetypography.com/" title="Quote Element Tutorial">
<area shape="rect" alt="The Typelog" coords="94,110,129,131" »
href="http://blog.theleagueofmoveabletype.com/" title="Small Element Tutorial">
<area shape="rect" alt="Simon Collison" coords="70,79,94,106" »
href="http://colly.com/" title="Simon Collison">
<area shape="rect" alt="SimpleBits" coords="59,50,92,75" »
href="http://simplebits.com/" title="SimpleBits">
<area shape="rect" alt="Site Point" coords="62,27,95,37" »
href="http://www.sitepoint.com/" title="Site Point">
</map>

---

Example [Basic (Image)]:

Code [HTML]:

<p><img src="/images/tutorials/observatory-hour-burlesque.jpg" alt="1950's burlesque poster with Griffith Park Observatory photograph imposed."></p>

---

Example [Illustrative (Attribute only)]:

Code [HTML]:

<p><img alt="This is an IMG element lacking the SRC attribute which means you are reading the ALT attribute's text."></p>

---

Example [Important (Link Image Missing)]:

Code [HTML]:

<p><a href="#"><img src="/" alt="This is an IMG element with the SRC attribute used as an A HREF but the SRC is faulty which means you are reading the ALT attribute's text. If one uses an IMG button, it is imperative to include a value in the ALT attribute!"></a></p>

---

Example [Basic (Input)]:

Observatory Hour (Preferred):

Code [HTML]:

<form action="#" method="post">
<p>
<label for="observatoryHour_pref" role="aria-labelledby">Observatory Hour (Preferred)</label>: »
<input type="text" id="observatoryHour_pref" name="observatoryHour_pref" alt="The preferred » 
time for observance of the observatory hour"> »
<input type="reset" id="reset" name="reset" value="Nonsense" role="button">
</p>
</form>

---