HTML Validator

Status
Niet open voor verdere reacties.
G

ginojo

Gebruiker
Lid geworden
7 sep 2010
Berichten
912
Hallo allemaal,

Ik wil mijn website een beetje bijwerken aan de html validator. Tot mijn schrik kreeg ik HEEL veel errors. Ik heb er al het merendeel uitgehaald maar ik krijg de overgebleven errors niet uit. Weet iemand hoe deze er wel uit moeten? De resultaten kun je hier vinden...

alvast bedankt,
Ginojo
 
Als je alle opmaak codes nu is in een css bestand zet en de html atributen achterwegen laat dan denk ik dat de helft al weg is.

bijv.
Code: 
<img src="" alt="" width="" height="" />
kan worden:
<img src="" alt="" class="thumb" />
en dan in de css
img.thumb { width: 100px; height: 100px; }

Snap je ?
 
ja. dat snap ik. maar nu geeft ie aan dat de " allemaal verkeerd zijn.... ook bji thub. Dus ik weet niet wat dar mis mee is... :S
 
als de validator de " onderstreep / rood maakt bedoelt hij dat het atribuut / de waarde van het atribuut niet goed is, niet de " zelf

misschien is het beter om een strict doctype te gebruiken in plaats van transitional als je toch bezig bent.

mvg, Ecross
 
maak van dingen als IMG en HEIGHT gewoon eens img en height.


:thumb:
 
Eerste hulpmiddel om fouten te kunnen herstellen lijkt me: zien wat je doet!
Nu zit alles in één hele-hele-hele-hele-lange regel code, waar niet in te zien is waar wat begint of eindigt:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><meta name="google-site-verification" content="c6GVG5mNIi4WP9GkQw87_9sD_1AWzZEAraCsdpkBJlw" /><title>Welcome - The Digit Company</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="title" content="The Digit Company Homepage" /><meta name="keywords" content="The Digit Company; the digit company; digit company; the digit; Digit company; digit Company; free software; free music; free; music; software; hacks; newsletter; free newsletter; The Digit Company; THE DIGIT COMPANY; tdc; TDC; T Digit Company; TD Company; The DC; T D C; T Digit C; The Digital Company; digitcompany.zxq.net; http://digitcompany.zxq.net; zxq; qr code; qr barcode; The Digit Company; member; members; system; membersystem;" /><meta name="language" content="en" /><meta name="subject" content="The Digit Company, http://digitcompany.zxq.net/" /><meta name="robots" content="All" /><meta name="copyright" content="The Digit Company 2011, written by The Digit Company" /><meta name="abstract" content="Download cool stuff to stay up-to-date in the digital world." /><meta name="pageContent" content="The Digit Company" /><meta name="MSSmartTagsPreventParsing" content="true" /><link id="theme" rel="stylesheet" type="text/css" href="style.css" title="theme" /><link rel="shortcut icon" href="siteprog/image/favicon.ico" type="image/x-icon" /><script type="text/javascript"> var _gaq = _gaq || [];  _gaq.push(['_setAccount', 'UA-18794760-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })();</script> <script type="text/javascript" src="siteprog/light/js/prototype.js"></script><script type="text/javascript" src="siteprog/light/js/scriptaculous.js?load=effects,builder"></script><script type="text/javascript" src="siteprog/light/js/lightbox.js"></script><link rel="stylesheet" href="siteprog/light/css/lightbox.css" type="text/css" media="screen" /><script type="text/javascript" src="siteprog/maximenu/jquery.min.js"></script><script type="text/javascript" src="siteprog/maximenu/maximenu.js"></script><script type="text/javascript">mijnMenu.maakMenu("anker1", "maximenu1", "mouseover")</script> </head><body><div id="wrapper"><div id="bg"><div id="header"></div><div id="page"><div id="container"><!-- horizontal navigation --><div id="nav1"><ul><li id="current" style="border: medium none ;"><a href="index.html" shape="rect">Home</a></li><li><a href="downloads.html" shape="rect">Downloads</a></li><li><a href="members.html" shape="rect">Member</a></li><li><a href="news.html" shape="rect">News</a></li><li><a href="contactus.html" shape="rect">Contact</a></li></ul></div><div id="content"><div id="center"><div id="welcome"><h3 style="font-style: italic;"><big><big><big>Home...</big></big></big></h3><IMG SRC="siteprog/image/home.png" class="thumb" ALT="Home Icon" ALIGN="right" HSPACE="10" /><p style="color: rgb(96, 96, 96);">Welcome to The Digit Company. Here you can get free downloads to stay up-to-date in the digital world. You can also sign up for The Digit Company newsletter. For all your questions you can contact us using <a href="contactus.html" shape="rect" style="text-decoration: none">the contact form.</a> Have fun!!!</p><br /><a href="siteprog/image/78.png" rel="lightbox" title="QR Code" style="text-decoration: none"><h3 style="font-style: italic;"><big><big><big>QR Code...</big></big></big></h3><IMG SRC="siteprog/image/Imagepic.png" class="thumb" ALT="Contact Icon" ALIGN="left" HSPACE="10" /><p style="color: rgb(96, 96, 96);">QR Codes are the new way to reach websites trough your mobile phone. The Digit Company also has it's own QR code. Click here and scan it with your QR supported mobile phone.</p><br /></a><br /><a href="/page/download/music.html" shape="rect" style="text-decoration: none"><h3 style="font-style: italic;"><big><big><big>Music Database...</big></big></big></h3><IMG SRC="siteprog/image/music.png" class="thumb" ALT="Music Icon" ALIGN="right" HSPACE="10" /><p style="color: rgb(96, 96, 96);">The Digit Company music database is finished. Now you can listen to new songs for free. No ads or banners. </p></a><br /><a href="downloads.html" shape="rect" style="text-decoration: none"><h3 style="font-style: italic;"><big><big><big>Download...</big></big></big></h3><IMG SRC="siteprog/image/down.png"  class="thumb" ALT="Down Icon" ALIGN="left" HSPACE="5" /><p style="color: rgb(96, 96, 96);">We are constantly looking for new downloads to publish on The Digit Company. Every day we publish new downloads in the download pages. If you want to be first to know when new downloads are published, you can register for The Digit Company newsletter.</p><br /></a><h3 style="font-style: italic;"><big><big><big>Newsletter...</big></big></big></h3><IMG SRC="siteprog/image/mail.png" class="thumb" ALT="Mail Icon" ALIGN="right" HSPACE="5" /><p style="color: rgb(96, 96, 96);">Why should you subscribe to The Digit Company newsletter?<br />• You will be informed about any news about The Digit Company.<br />• We inform you know when new downloads are published.<br />• Only you can take advantage of special offers from The Digit Company.<br /><br />So register now for The Digit Company newsletter!</p><div>  </div></div></div><div id="right"><div id="sidebar"><h3 style="font-style: italic;">Newsletter...</h3><br />Sign up for our newsletter!!!<br /><br /><form name="form1" method="post" action="siteprog/db/mailnews.php">Name: <br /><input name="Name" value="" type="text" /><br /><br />Email: <br /><input name="Email" value="" type="text" /><input name="Onderwerp" value="The Digit Company Newsletter" type="hidden" /><input name="id" value="news" type="hidden" /><br /><br /><input name="verzend" value="Send" type="submit" /></form><br /><tr><td><p style="color: rgb(96, 96, 96);"><h3 style="font-style: italic;">Member area...</h3><br />You are not logged in. Log in here or register on the <a href="members.html" shape="rect" style="text-decoration: none">memberspage.</a><br /><br /><form name="login" action="page/member/loggedin.php" method="post">Username:<br /><input type="text" name="username" id="username" /><br /><br />Password:<br /><input type="password" name="password" id="password" /><br /><br /><input type="submit" name="submit" value="login" /></form></p></td></tr><br /><br /><IMG SRC="siteprog/image/google.jpg" WIDTH="140" HEIGHT="140" ALT="Google" /><form method="get" action="http://www.google.com/search"><input type="text"   name="q" size="25" maxlength="255" value="" /><input type="submit" value="Google Search" /></form><div style="font-weight: bold; margin-top: 20px;"></div><div style="margin: 20px 0pt; text-align: center;"> </div></div></div><div class="clear" style="height: 40px;"></div></div></div></div><div id="footerWrapper"><div id="footer"></div></div></div></div></body></html>
De html-validator kan nu ook niet zeggen: "Fout aangetroffen in regel 84", zodat je even kan kijken wat daar staat. Het enige dat de validator nu kan zeggen is: "Fout aangetroffen in regel 1, kolom 6742". En de volgende fout: "Fout aangetroffen in regel 1, kolom 6748". Enz.: alles zit in regel 1!
En ik ben veel te lui om dat te gaan zitten uittellen! ;)

Dus als je een ongecomprimeerde code hebt, met regels die je kunt lezen en nette inspringende <div>'s enzo, dan zou ik die door de html-validator laten nakijken.
Mocht je die niet (meer) hebben, dan kan je eens kijken wat er gebeurt als je de code door HTML-Tidy (in Firefox) laat opschonen. Die zet alles meteen leesbaar onder elkaar.

Met vriendelijke groet,
CSShunter
___________
PS: de download-tijdwinst die je boekt door een html-bestand tot 1 regel te comprimeren, zal bij de omvang van jouw pagina waarschijnlijk in de milliseconden zitten. Daarvoor hoef je het dus niet te doen!
 
Laatst bewerkt:
Ja. Maar k had hem ook eerst met enters. Maar online heb k hem op 1 regel. Maar btw. Je hebt in kladblok toch een optie op de kolom te zoeken, :D
Maar bedankt
Ginojo
 
Als je em persé op 1 regel wilt om ruimte uit te sparen, bewaar dan een goeie versie ergens om te editen en een script om alle enters weg te halen ;)

Anyway, grote editors als Eclipse hebben een functie om automatisch formatting toe te passen, als je em daar doorheen haalt dan heb je gelijk weer een nette versie terug.
 
Anyway, grote editors als Eclipse ...
Klik om te vergroten...
En het genoemde kleintje (HTML-Tidy plugin voor Firefox) kan het ook. :)

html-tidy-opschonen-detail.gif


Détail screenshot HTML-Tidy (volledige screenshot: hier)​

Zoals te zien is, wordt niet alleen het inspringen mooi opgeschoond, maar doet HTML-Tidy ook een poging om de fouten te herstellen. Hier:
  • De verboden <center> tag (oeps!) is vervangen door een css-class (met style-voorschriften in de <head>).
  • Het ontbrekende verplichte attribuut type="text/javascript" is toegevoegd.
  • Om het script heen wordt keurig de ontbrekende //<![CDATA[ ... //]]> bijgeplaatst.
Toegegeven, HTML-Tidy doet het niet altijd helemaal goed bij het automatisch corrigeren van de opmaak (of soms: helemaal niet goed), maar je hebt hiermee in elk geval aangrijpingspunten en vergelijkingsmateriaal.
Zolang je de Tidy-opgeschoonde versie maar opslaat met een andere naam. :p

Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan