|
Posted by Spartanicus on 03/17/06 23:50
Martin Clark <martin@spl.at> wrote:
>>Use a Strict doctype, Transitional is for legacy documents who's code
>>can otherwise not be updated, and what you have now triggers quirks
>>mode.
>
>I have changed it to Strict. This has not produced a solution to the
>problem I had.
You may currently only be able to see one problem, more experienced
people can see more problems. Listen if you want to learn how to spot
these problems yourself.
>Instead, it has created a new problem - there is a small
>gap between the header and the navigation bar in Firefox (and an even
>smaller gap in Opera). It doesn't seem to appear in IE6. What could be
>causing that?
Leave it for the moment, take on the other advice given and in the event
that it's still there at the end of the track we'll deal with it then.
>>Remove the presentational markup.
>
>If you mean the italics
And the spacer images, the <br>s (address ones excepted), the s
and the ]['s.
>, this is likely to be the only page with any
>italics at all, so it hardly seems worth creating a class for it.
This is a case where semantic <em> or <strong> markup is appropriate.
>>Two navbars are a nuisance, one suffices.
>
>Why a nuisance?
Navigating to the top or the bottom of a document is trivial, hence
there is no benefit to repeating a navbar, repetition is a nuisance for
situations where the document is rendered linearly.
>>Nav links should be marked up as an unordered list, not as paragraphs.
>
>They're not - except the links on the left which will draw attention to
>specific features of the site. How can I use an unordered list to create
>the blue backgrounds for headings and white backgrounds for the
>descriptions? <p> seems to be ideal for this purpose.
I mistook them for navigation links due to other mistakes you've made: 2
consecutive links to the same target with different and poorly chosen
link text. Hyperlinked text should preferably be the same as the header
content of the page section that the link points to.
An example of how to structure side bar content assuming that the target
header is "74 Club":
<h2>News</h2>
<p><b>The 74 Club</b></p>
<p>Find out whether you can join the exclusive <a href="74club.htm">74
Club</a>!</p>
<p><b>Standedge Tunnel</b></p>
....
etc.
>>Remove the spacer gifs, use CSS instead.
>
>The white line between the header and the nav bar does not work unless I
>put a spacer gif there (it ends up too thick).
Markup the navbar as an unordered list, use CSS to specify a bottom
border on the masthead or a top border on the navbar.
>>Fix your header structure, add one <h1> with "Huddersfield Canal
>>Society" as it's content.
>
>I have reserved <h1> for the titles of each page within the site. This
>is the home page and doesn't have one. I want Google to give greater
>priority to picking up the subject of each page rather than picking up
>the name of the society.
The subject of the home/index page *is* the name of the society.
>>Remove the <hr> and , use CSS instead.
>
>Done.
Canal Society</a> still there.
>But what is wrong with <hr>?
It's used in a presentational manner.
>>Fix your alt text, the logo is merely decorative, use alt="".
>
>Surely a matter of personal preference?
No, disable graphics and the "Huddersfield Canal Society" title of the
page is repeated twice.
>It does not affect the problem I
>was asking about.
I am getting tired of seeing you repeating that.
>>You've used far to many classes.
>
>Am I? I didn't realise there was a maximum permitted.
Quality coding includes using the minimal amount of code needed to do
the job, no more.
>>Don't use <br> to create spacings, use CSS.
>
>I have not used <br> anywhere on this page to create spacings.
All the <br>s except those used for the address are used to create
spacing.
>>Don't use characters ( ][ )to separate links, specify a border with CSS.
>
>Why not?
A screen reader will read "Left square bracket Top of page Right square
bracket Left square bracket Home Right square bracket Left square
bracket The Society ..." a bloody nuisance.
>>Don't use absolute positioning for the header, there is no need to do so
>>and it results in the problem you are seeing.
>>
>Ah, at last! The problem I was asking about. The reason why I am asking
>the question is because I am still learning how to use CSS for layout
>and am still struggling with some aspects. Can you please explain what I
>should be doing instead?
No positioning, just leave the element in the flow.
--
Spartanicus
[Back to original message]
|