Validating HTML

[brandofamily]

I clicked on the "TIDY" icon to see html code errors and warnings and I'm seeing 6 errors... should I be working on removing these? I assume yes, but since I don't know code so well this may be tough..
for instance, in the code below... I get a warning for mssing </form> then an error for an unexpected </form> a few lines later...???

<!-- Site Keyword Search -->
<div align="center">
<div id="KWS">

<table width="848" border="0">
<tr>
<td>
<form name="suggest" action="/keyword/jump.mg">
<table width="310" border="0">
<tr>
<td valign=middle>
<div align="center">
<div id="KWSi">
<input autocomplete="off" maxLength=256 size=25 name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')" />
</td>
<td valign=middle>
<input type=submit value="" name="submitButton" class="buttons" />
</td>
</tr>
</table>
<***script src="/include/js/keywordsuggest.js"><***/script***>
</div>
</div>
</td>
</tr>
</table>
</form>
</div>
</div>
<!-- End Site Keyword Search -->
Any help would be appreciated...

By the way... some of the errors and warnings are being generated by SM's code... I think...

[Mike Lane]

I clicked on the "TIDY" icon to see html code errors and warnings and I'm seeing 6 errors... should I be working on removing these? I assume yes, but since I don't know code so well this may be tough..
for instance, in the code below... I get a warning for mssing </form> then an error for an unexpected </form> a few lines later...???Make sure everything is nested properly. Don't close your form before your table if you opened the form in the table. Things like that. You've got an awful lot of nesting (way more than necessary IMHO) so you need to be very careful that you have things nested properly.

But it would be muh easier to see if you would link to the problem page so we could run it through some validation ourselves to see if there are other errors that we find.

By the way... some of the errors and warnings are being generated by SM's code... I think...That's a topic that has been covered at some length on dgrin. You can do a search but the basic idea is that validation is cool and stuff but it's not a requirement by any means. Most of the validation errors are because the validators get hooked up on ampersands and stuff in the javascript code anyhow.

[brandofamily]

Make sure everything is nested properly. Don't close your form before your table if you opened the form in the table. Things like that. You've got an awful lot of nesting (way more than necessary IMHO) so you need to be very careful that you have things nested properly.

But it would be muh easier to see if you would link to the problem page so we could run it through some validation ourselves to see if there are other errors that we find.

That's a topic that has been covered at some length on dgrin. You can do a search but the basic idea is that validation is cool and stuff but it's not a requirement by any means. Most of the validation errors are because the validators get hooked up on ampersands and stuff in the javascript code anyhow.
Thanks for looking...
Here's the page that the above code comes from...
http://www.brandolinoimaging.com/keyword/

[brandofamily]

Make sure everything is nested properly. Don't close your form before your table if you opened the form in the table. Things like that. You've got an awful lot of nesting (way more than necessary IMHO) so you need to be very careful that you have things nested properly.

But it would be muh easier to see if you would link to the problem page so we could run it through some validation ourselves to see if there are other errors that we find.

That's a topic that has been covered at some length on dgrin. You can do a search but the basic idea is that validation is cool and stuff but it's not a requirement by any means. Most of the validation errors are because the validators get hooked up on ampersands and stuff in the javascript code anyhow.
I think my nesting is correctly organized at this point. Everything is closed in reverse order from when it is opened...
If you had the time I'd like to hear more about why I have too much nested and any thoughts on how I could "correct" the issue w/o causing issues to my page... (I'm really more concerned w/ the errors than the warnings asI'm hoping not to have issues w/ the IE version 7) I know that's alot to ask though...

[ivar]

I clicked on the "TIDY" icon to see html code errors and warnings and I'm seeing 6 errors... should I be working on removing these? I assume yes, but since I don't know code so well this may be tough..
for instance, in the code below... I get a warning for mssing </form> then an error for an unexpected </form> a few lines later...???

<!-- Site Keyword Search -->
<div align="center">
<div id="KWS">

<table width="848" border="0">
<tr>
<td>
<form name="suggest" action="/keyword/jump.mg">
<table width="310" border="0">
<tr>
<td valign=middle>
<div align="center">
<div id="KWSi">
<input autocomplete="off" maxLength=256 size=25 name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')" />
</td>
<td valign=middle>
<input type=submit value="" name="submitButton" class="buttons" />
</td>
</tr>
</table>
<***script src="/include/js/keywordsuggest.js"><***/script***>
</div>
</div>
</td>
</tr>
</table>
</form>
</div>
</div>
<!-- End Site Keyword Search -->
Any help would be appreciated...

By the way... some of the errors and warnings are being generated by SM's code... I think...Sometimes it helps to visualize these things

[Allen]

Right there in the lower middle did he close table before 2 div's that
were opened before table? Don't know much about this but looks
weird.
AL

edit: form too.

[ivar]

Right there in the lower middle did he close table before 2 div's that were opened before table? Don't know much about this but looks
weird.
Every new tag starts an X amount of space more to the right.
Then, start in the middle, and work your way back.
The open tag, and close tag should be on the same vertical line.
You see the green is correct. The orange has a mixed tag-order.
I left the input and script alone, because they were closed on the same line.
Doesn't always mean it's a problem, but usually is.


<!-- Site Keyword Search -->
<div align="center">
<div id="KWS">

<table width="848" border="0">
<tr>
<td>
<form name="suggest" action="/keyword/jump.mg">
<table width="310" border="0">
<tr>
<td valign=middle>
<div align="center">
|<div id="KWSi">
| <input autocomplete="off" maxLength=256 size=25 name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')" />
</td> |
| |<td valign=middle>
| | <input type=submit value="" name="submitButton" class="buttons" />
| |</td>
</tr> |
</table> |
| <***script src="/include/js/keywordsuggest.js"><***/script***>
|</div>
</div>
</td>
</tr>
</table>
</form>
</div>
</div>
<!-- End Site Keyword Search -->

[Allen]

Don't you have to close each group, like divs and forms before
table is closed? The 2 divs and form were started inside a table
and closed after the table is closed.
Al

<form name="suggest" action="/keyword/jump.mg">
<table width="310" border="0">
<tr>
<td valign=middle>
<div align="center">
|<div id="KWSi">
| <input autocomplete="off" maxLength=256 size=25 name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')" />
</td> |
| |<td valign=middle>
| | <input type=submit value="" name="submitButton" class="buttons" />
| |</td>
</tr> |
</table> |
| <***script src="/include/js/keywordsuggest.js"><***/script***>
|</div>
</div>
</td>
</tr>
</table>
</form>

[Mike Lane]

I think my nesting is correctly organized at this point. Everything is closed in reverse order from when it is opened...
If you had the time I'd like to hear more about why I have too much nested and any thoughts on how I could "correct" the issue w/o causing issues to my page... (I'm really more concerned w/ the errors than the warnings asI'm hoping not to have issues w/ the IE version 7) I know that's alot to ask though...I'll elaborate about the nesting if you want but just look at what Ivar posted for you. You've got a div that contains a div that contains a table that contains form that contains a table that contains a div and so on. All that just to display one simple little search box?!?!?! You simply don't need all that stuff. For starters get rid of the <div align="center"> and it's corresponding </div> You don't need it, it just adds to your confusion. Then you can go here (http://smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/) to start to learn how to style forms without using tables among other things.

Here, try this html see if it works like you want.


<!-- Site Keyword Search -->
<div id="KWS">

<form name="suggest" action="/keyword/jump.mg">

<input autocomplete="off" maxlength="256" size="25" name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')">

<input value="" name="submitButton" class="buttons" type="submit">

******** src="/include/js/keywordsuggest.js"></********

</form>

</div>
<!-- End Site Keyword Search -->

See how much simpler that is? I for one have found that simpler code (both CSS and HTML) have lead to an easier time in making my pages work in all browsers. Hacks should be used as sparingly as possible.

[brandofamily]

thanks for everyones help... all those extra little div's were my lame attempt at aligning a bunch of little pieces inside the table...

[brandofamily]

is the nesting correct now??? It has now created 5 errors in "TIDY" :scratch
<!-- Site Keyword Search -->
<div align="center">
<div id="KWS">
<table width="848" border="0">
<tr>
<td>
<form name="suggest" action="/keyword/jump.mg">
<table width="310" border="0">
<tr>
<td valign=middle>
<div align="center">
<div id="KWSi">
<input autocomplete="off" maxLength=256 size=25 name="Keyword" value="Search" onfocus="InstallAC(document.suggest,document.suggest.Keywor d,document.suggest.submitButton,'suggestRPC.mg','e n')" />
<td valign=middle>
<input type=submit value="" name="submitButton" class="buttons" />
******** src="/include/js/keywordsuggest.js"></********
</td>
</div>
</div>
</td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</div>
</div>
<!-- End Site Keyword Search -->

[brandofamily]

Thanks Mike... much more eligant... and zero errors... I'm gongi to do a bit of testing to see that it all works the same... I'm sure it will...
Now... if you would have only had the time to show me that months ago...just kidding... thanks again...