HTML Forum

**justin t** · 03-16-2007, 02:04 PM

Hi all

I stopped using Dreamweaver MX about 1/2 years ago and started hand coding but recently I have realised that my webpages dont' validate.
I used:
http://validator.w3.org/check?verbos...reylizard.net/

Not sure if my Character Encoding is wrong right from the start,
bit confused, used to let Dreamweaver do it for me, using this
one at the moment:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Can anyone give me some tips as I'm not quite sure what I need.

My site is at: http://www.greylizard.net/

Regards

Justin

**travelagent** · 03-16-2007, 02:17 PM

Justin - all of the DOCTYPE Declarations are shown here

**LadynRed** · 03-16-2007, 02:20 PM

It's not your DOCTYPE - it's your coding:

Quote:

line 19 column 109 - Warning: discarding unexpected </img>
line 27 column 94 - Warning: discarding unexpected </img>
line 30 column 64 - Warning: discarding unexpected </input>
line 31 column 64 - Warning: discarding unexpected </input>
line 32 column 47 - Warning: discarding unexpected </input>
line 40 column 66 - Warning: discarding unexpected </input>
line 44 column 66 - Warning: discarding unexpected </input>
line 49 column 65 - Warning: discarding unexpected </input>
line 50 column 45 - Warning: discarding unexpected </input>
line 51 column 56 - Warning: discarding unexpected </input>
line 52 column 51 - Warning: discarding unexpected </input>
line 53 column 51 - Warning: discarding unexpected </input>
line 54 column 47 - Warning: discarding unexpected </input>
line 55 column 58 - Warning: discarding unexpected </input>
line 56 column 178 - Warning: discarding unexpected </input>
line 57 column 43 - Warning: discarding unexpected </input>
line 64 column 1 - Warning: missing <li>
line 125 column 72 - Warning: unescaped & or unknown entity "&cat"
line 125 column 81 - Warning: unescaped & or unknown entity "&ID"
line 17 column 1 - Warning: <table> lacks "summary" attribute
line 24 column 1 - Warning: <table> lacks "summary" attribute
line 37 column 1 - Warning: <table> lacks "summary" attribute
line 73 column 1 - Warning: <table> lacks "summary" attribute
line 76 column 1 - Warning: <table> lacks "summary" attribute
line 88 column 1 - Warning: <table> lacks "summary" attribute
line 98 column 1 - Warning: <table> lacks "summary" attribute
line 109 column 1 - Warning: <table> lacks "summary" attribute
line 131 column 1 - Warning: <div> anchor "topbox" already defined
line 133 column 1 - Warning: <table> lacks "summary" attribute
line 171 column 1 - Warning: <table> proprietary attribute "bordercolor"
line 171 column 1 - Warning: <table> lacks "summary" attribute
line 172 column 5 - Warning: <table> lacks "summary" attribute
line 69 column 12 - Warning: trimming empty <address>
line 86 column 1 - Warning: trimming empty <p>
line 87 column 1 - Warning: trimming empty <p>
line 96 column 1 - Warning: trimming empty <p>
line 97 column 1 - Warning: trimming empty <p>

0 errors / 37 warnings

The error messages seem pretty clear
- if you're going to define an unordered list, then you must have list items inside the <ul>
<ul>
<li>item1</li>
<li>item2</li>
</ul>

ID's MUST be UNIQUE

It appears you're missing a closing <div> tag.

Scrap the deprecated <font> tags and use CSS properly for styling text.
Scrap the tables and use divs and CSS to lay out your page

**justin t** · 03-16-2007, 02:31 PM

Quote:

Originally Posted by LadynRed

Scrap the deprecated <font> tags and use CSS properly for styling text.
Scrap the tables and use divs and CSS to lay out your page

I am using CSS for layout but having trouble using CSS for text formatting as it always seems to force a pagebreak in, like:
<h1>Hello</h1>
<h2>bye</h2>

Will make:

"Hello

bye"

suppose I need some training or something, but what is that point for a silly homesite.

Justin

**LadynRed** · 03-16-2007, 02:42 PM

Well, Hx tags are meant to be HEADINGS, they are BLOCK LEVEL elements, so they extend across the entire width of the container and have default spacing above and below.

In your CSS, you can zero out the default margin and padding for everything, including HX tags:

h1, h2, h3, h4{
margin: 0;
padding: 0;
}

You should also always zero out the margin and padding on the body too.

Then when you use an H1 tag, you add back margin and padding as needed, as well as changing color, font size, etc.

As long as you are using tables for structure, you are not properly using divs and CSS.

Quote:

but what is that point for a silly homesite.

Would you deliberately build yourself a shack to live in if you were building a HOME ? No, so your own personal site should be built to be the best you can make it. Why settle for a hovel when you can build a mansion ??? You have to start learning somewhere.

**justin t** · 03-16-2007, 02:58 PM

Quote:

Originally Posted by LadynRed

- if you're going to define an unordered list, then you must have list items inside the <ul>
<ul>
<li>item1</li>
<li>item2</li>
</ul>

I messed up my <li> tags because when I checked the cashe page on google the items went one after the other like this:

1

2

3

4

5

and not 1 2 3 4 5

I could not convince myself this would not have a negative impact on my search engine results (I thought google looks at items at the top of the page as most important.

Justin

**LadynRed** · 03-16-2007, 04:36 PM

Not necessarily. You might want to look at Google's Webmaster Central.

If you want a horizontal list rather than vertical, you need to do it this way :

menu li{
display: inline;
}
http://css.maxdesign.com.au/listutorial/index.htm

**justin t** · 04:46 PM

I have changed one row of my top menu (on the inner site www.greylizard.net/justinssquat.php) to be inline horizontal.

Ok I don't want to make this a 'tell justin how to do css' thread but I had one thing to ask which I can't find the answer to anywhere on the net

if I want 2 sizes of <ul> how would I do that?
ie my top menu has two rows:

The first nav row
the second nav row

I was also looking at how to have more text formatting strings rather than just <h1,2,3etc>

Justin

**LadynRed** · 03-16-2007, 06:38 PM

Create 2 classes, (or ids), 1 for each UL.
Specify the sizing, color, etc. for each class.

.navRow{
font-size: 150%;
color: blue;
list-style: none;
margin: 2px 5px 3px 5px;
padding: 0;
}

.secondNav{
font-size: 80%;
color: green;
margin: 6px 2px 3px 2px;
padding: 2px;
}

Then in your HTML you use
<ul class="navRow">
<li><li>
</ul>
<ul class="secondNav">
<li>items</li>
</ul>

You can format any text you want using any styling. You can style whole paragraphs, or style just parts of a paragraph or word using the <span> tag. The point is to use SEMANTIC markup - make a heading a HEADING, make a list a LIST, etc.

**travelagent** · 03-16-2007, 07:29 PM

Dang -- we're still messing with this all day today, after the original question was about the correct DOCTYPE Declaration?

Maybe it's time to punt and start over...

**justin t** · 03-16-2007, 07:52 PM

Maybe its time I went to css school

**travelagent** · 03-16-2007, 07:55 PM

LOL -- I tried to send you to W3C school this moring...

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!