Hi,

When I use validator.w3.org to validate the html of my site, the following code throws the following error.

Code
<a name="top" id="navigation-top"></a>

Error

#  Error  Line 62, Column 35: document type does not allow element "a" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag.

  <a name="top" id="navigation-top"></a>

✉

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

All the html looks correct to me, so I'm not sure why an error is being thrown. Removing this line eliminates the erorr! Any help/suggestions is appreciated.

--
Cheers,

Jon Antoine
www.antoinesolutions.com
Open Source Development Tutorials & Documentation

CommentFileSizeAuthor
#13 zen_327455.patch1.35 KBgrendzy

Comments

Rowanw’s picture

I'm trying to figure out why it's an a and why it has a name, and why it's empty. In fact why is it there in the first place?

kmonty’s picture

@AntoineSolutions Starting with a fresh copy of the 6.x branch, the page validates. So, it could be something you added to the theme (granted, I didn't test this with 5.x)

@Rowanw - it's for screen readers. The name attribute is an anchor so people with screen readers can navigate the site easily.

jantoine’s picture

@kmonty - I am using the 5.x version ;)

Rowanw’s picture

Is there any info on how it helps with screen readers?

kmonty’s picture

Category: bug » support
Status: Active » Postponed (maintainer needs more info)

A quick google search turns up this page: http://www.dhhs.gov/web/policies/skipnavigation.html

In short: it is polite, standard, and often a legal requirement to allow people with screen-readers to quickly navigate around the site.

This does not appear to be an issue with Zen... moving to a support request.

kmonty’s picture

@AntoineSolutions I moved this to a support request. I would recommend providing all relevant urls so someone can investigate the source of your issue.

jantoine’s picture

@kmonty - The website that is throwing the error is www.mossbargerphoto.com. It is the first error when validating with validator.w3.org. After looking at other websites I have the use zen 5.x, I do not believe this to be a zen error. I believe some other error in the code is causing it. Feel free to have a look and tell me if you see anything wrong in the code ;).

Rowanw’s picture

The link above doesn't explain what the purpose of these lines are for:

<a name="top" id="navigation-top"></a>

and

<a name="navigation" id="navigation"></a>

They seem unnecessary to me. Why not use the actual navigation as the anchor?

kempoller’s picture

Hi,

I've just started using the Zen theme and have noticed this exact same problem when creating a new sub-theme using the STARTERKIT. I'm using Drupal 6.6 and Zen 6.x-1.0-beta3.
The code causing validation errors is the same as above:
<a name="top" id="navigation-top"></a>

It seems to be coming from zen/zen/page.tpl.php line 92 for me.
I have not modified the theme installation in anyway beyond making a new sub-theme.
The validation error is present in the Zen base theme and Zen Themer's Starter Kit theme and the new sub-theme.
Cheers

erifneerg’s picture

This really should be fix or atleast explain why name and id don't match.
examples from the firefox htmltidy and http://www.htmlpedia.org/wiki/Tidy_60
Define the name=id or just id.

Bad	<a name="abcdef" id="ghijklm"> (currently in zen)
Good	<a name="abcdefgh" id="abcdefgh">
Good	<a id="abcdefgh"> (bad for screen readers apparently)

Solution:
Remove one of the both attribute or make the 2 values of ID and NAME equal

Note:
maybe this is just a problem with the extension. I just copied the rendered page into w3c and it's fine.

ball.in.th’s picture

Hi,

I just ran into this problem. < a name="top" id="navigation-top" >< /a > seems to be invalid according to http://www.w3.org/TR/REC-html40/struct/links.html#h-12.2.3 which says "When both attributes are used on a single element, their values must be identical". Is there a particular reason why id is not just "top"?

ball.in.th’s picture

Status: Postponed (maintainer needs more info) » Active
grendzy’s picture

Version: 5.x-1.1 » 6.x-1.0
Category: support » bug
Status: Active » Needs review
StatusFileSize
new1.35 KB

This isn't a "skip navigation" anchor. It appears to be an anchor that could be used for those little "top" links that some folks like to sprinkle on long pages. Personally, I prefer the "Home" key on my keyboard, or a flick of the scroll wheel.

Anyway, changing the name attribute in this anchor is always the first thing I do when creating a sub-theme. Actually it looks like it could just be deleted too.

thepanz’s picture

Status: Needs review » Reviewed & tested by the community

Patch works fine on latest 6.x-1.x-dev

johnalbin’s picture

Title: <a name="top" id="navigation-top"></a> causing validation error » name and id mismatch in named anchor causing validation error
Component: Code » CSS/HTML Markup
Status: Reviewed & tested by the community » Fixed

Thanks for the patch, guys! Keep 'em coming!

Applied to 6.x-1.x-dev and 5.x-1.x-dev.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.