Member Avatar for schrope

I can not get any of my links to work. the tabs should go to the correct page and the links at the bottom should go to the correct page.

help

<html>

<head>

<!--
   New Perspectives on HTML and XHTML 5th Edition
   Tutorial 2
   Review Assignment

   CAMshots Photo Contest
   Author: 
   Date:   

   Filename:         contest.htm
   Supporting files: contest0.jpg, thumb1.jpg - thumb9.jpg
-->

   <title>CAMshots Photo Contest</title>
</head>

<body>
   <div><img src="assets/contest0.jpg" alt="Photo contest" usemap="#contestmap" style="border-width: 0"/>
	<map id="contestmap" name="contestmap">
	<area shape="ploy" coords="(457,84),(474,63),(549,63),(566,84)," href="pages/child.htm" alt="Child Photos"/>
	<area shape="ploy" coords="(455,84),(571,63),(646,63),(663,84)," href="pages/flower.htm" alt="Flowers Photos"/>
	<area shape="ploy" coords="(651,84),(668,63),(743,63),(760,84)," href="pages/scenic.htm" alt="Scenic Photos"/>
	<area shape="circle" coords="82,82, 78" href="contest.htm" alt="contest Results"/>
</map>
 
   </div>

   <h1 style="color: blue">Contest Winners</h1>
   <p>Here are the results for this month's contest for best photos
      in the categories of <i>Child Photos</i>, <i>Flower Photos</i>, and
      <i>Scenic Photos</i>. I received hundreds of entries and it was 
      difficult to narrow the entries down to three in each category. Thanks to everyone
      who participated this month.</p>
   <p>Below are thumbnail images of the winning photos. You can click the
      photos to view larger images of each. These photos are distributed
      for non-commercial use. If you wish to obtain copies for commercial
      use, please contact the photographer.</p>
   <p>Next month's contest categories:</p>
   <ul>
      <li>Animal Photos</li>
      <li>Nighttime Photos</li>
      <li>Sports Photos</li>
   </ul>
   <p>Please submit your entries to
      <a href="mailto:ghayward@camshots.com?subject=photo%20contest"> Gerry Hayward.</a> </p>
   <p>
      Include your name, the photo category, and the photo settings. JPEG photos only.
      Please keep the file size &lt; 100k. My mail server will reject photos larger
      than 100k. One entry per person please.
   </p>
   
   <p><b>Attention</b>: Our friends at BetterPhoto.com
      are having their annual photo contest. Please take this opportunity
      to submit your work to their editors.</p>

   <p>&mdash; Gerry</p>

   <hr />

   <dl>
   <dt><a href="pages/child.htm"> Child Photos </a></dt>
	 
   <dd>
      <img src="assets/thumb1.jpg" alt="child1" />
      <img src="assets/thumb2.jpg" alt="child2" />
      <img src="assets/thumb3.jpg" alt="child3" />
   </dd>
   <dt><a href="pages/flower.htm"> Flower Photos </a></dt>
   <dd>
      <img src="assets/thumb4.jpg" alt="flower1" />
      <img src="assets/thumb5.jpg" alt="flower2" />
      <img src="assets/thumb6.jpg" alt="flower3" />
   </dd>
   <dt><a href="pages/scenic.htm"> Scenic Photos </a></dt>
   <dd>
      <img src="assets/thumb7.jpg" alt="scenic1" />
      <img src="assets/thumb8.jpg" alt="scenic2" />
      <img src="assets/thumb9.jpg" alt="scenic3" />
   </dd>
   </dl>

   <hr />
   <address>
      CAMshots ››› Tips and News from the World of Digital Photography
   </address>

</body>

</html>
Edited by Ezzaral because: Added code tags. Please use them to format any code that you post.
  • 5 Contributors
  • 4 Replies
  • 451 Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by floatingDivs

Recommended Answers

All 4 Replies

Member Avatar for fpsasm

First of all, you don't need " /> " at the end of your image, area code so:

<area shape="ploy" coords="(457,84),(474,63),(549,63),(566,84)," href="pages/child.htm" alt="Child Photos">


<img src="assets/thumb9.jpg" alt="scenic3">

..should work fine.

Second, if "assets" is a folder in the same directory as your .html file, you should put

"./assets/thumb9.jpg"

The ./ denotes "the current directory", i find that that the pages are more reliable with it, then without it.

Thirdly, you don't have to keep closing and opening your <p></p> for each section.
You can use <br> to add spaces.

Personally, I would always put stuff inside a <div>, i find it's just better to manage. i.e:

<div>
   <h1 style="color: blue">Contest Winners</h1>
   <p>Here are the results for this month's contest for best photos
      in the categories of <i>Child Photos</i>, <i>Flower Photos</i>, and
      ....
      ....
      ...</p>


</div>
Member Avatar for scrappedcola

Your image map area shape "poly" is misspelt everywhere you use it. Try "poly" or "polygon" rather than "ploy". Also your coordiantes don't use ().

<area shape="ploy" coords="(457,84),(474,63),(549,63),(566,84)," href="pages/child.htm" alt="Child Photos"/>

should be

<area shape="polygon" coords="457,84,474,63,549,63,566,84," href="pages/child.htm" alt="Child Photos"/>

. Read this tutorial on Image Maps

Edited by scrappedcola because: n/a
Member Avatar for teedoff

Thirdly, you don't have to keep closing and opening your <p></p> for each section.
You can use <br> to add spaces

Actually, you should use the p tag to start and end paragraphs. The <br> tag has its purpose, but not for "creating" the illusion of the start of a new paragraph.
You can read more about that here: http://www.w3.org/TR/html401/struct/text.html#h-9.3

btw: WOW! does everyone use this same book?..lol It's the text book I used in college!

Edited by teedoff because: n/a
Member Avatar for floatingDivs

@teedoff

Completely agree with you regarding paragraph tags being used instead of break tags. To be honest, is there ever a real need for break tags? For instance, while they can be used as "presentational" markers, what about the blind users who have to listen to Jaws or other visual-aid software speak "to the end of the monthbreakthis is how the weekly schedule..."

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.