Jump to content

Eerste HTML-script


Recommended Posts

Geplaatst:

Is standaard Dreamweaver (beste editor voor webpagina's :puh:)

Sommige dingen in de wereld zijn subjectief, sommige heel erg subjectief. Jouw uitspraak valt onder de laatste ;) .

Die verbeterde code klopt inderdaad bijna, de laatste puntjes voor html transitional zijn zover ik kan zien deze:

- er staat tekst direct in de <ol>, mag niet

- het color-attribuut bestaat eigenlijk niet

- er wordt (achter american idiot) een font gesloten die niet open is

- nog een paar hoofdletters

- blok-elementen mogen niet in line-elementen (center in font, ol in i)

<!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">
<head>
<title>Mijn eerste HTML-code</title>
</head>
<body style="background-image: url(Lol.jpg);">
<h1><font style="color: green;"> Greenday Rocks!</font></h1>
<font style="color: green;">Do you love greenday? Then join our community!</font>
<p></p>
<p></p>
<center><h3><font style="color: red;"><u>Some songs of Greenday</u></font></h3></center>
<center>
Boulevard of Broken dreams<br />
<ol style="font-style:italic;">
<li>21 Guns</li>
<li>Holiday</li>
<li>Know your enemy</li>
<li>American Idiot</li></ol>
and much more! </center><br /><br /><br /><br />
<b>Thanks to megadreams for helping with HTML, and also gtaforum for the good times!</b><br />
<a href="http://www.gtaforum.nl/index">GTAFORUM</a><br />
<a href="http://egph-productions.eu/taal.php?p=/">EGHP-productions</a>
</body>
</html>

Dat zou valid xhtml transitional zijn. Of het ook precies hetzelfde resultaat oplevert als de begin-code is een andere vraag. Wat heb je aan (x)html valid schrijven? Je pagina ziet er in alle browsers meestal (!) hetzelfde uit. Met invalide code probeert de browser maar wat in elkaar te zetten, wat meestal in een grote hoop troep uitdraait :puh: .

Trouwens, ik moet er nog bij zeggen dat <font> vanaf html 5 volgens mij deprecated is, en <center> en <u> misschien ook.

Ik zou zeggen: kijk eens op w3schools.com, hier kun je heel veel leren en er staat een complete documentatie van onder andere html en css. Op die website ben ik ook ooit begonnen :puh: .

Geplaatst:

Trouwens, ik moet er nog bij zeggen dat <font> vanaf html 5 volgens mij deprecated is, en <center> en <u> misschien ook.

Inderdaad, evenals <s> (<strike>), <applet>, <basefont>, <dir> en <menu>. Opmaak moet je altijd proberen via CSS te doen in een CSS-bestand, zodat je het makkelijk kaan aanpassen en bovendien ook niet snel vergeet als je iets groots maakt.

Nog een tip trouwens: maak gebruik van inspringingen (tabs), want dan wordt je code overzichtelijker en kan je bij veel editors ook de code tussen bijvoorbeeld <ol> en </ol> inklappen (verbergen). Ook het gebruik van commentaar (<!-- commentaar -->) is handig, ook bij HTML, maar dat hangt ook een beetje van de grootte van je code af.

Geplaatst:

Inspringen mat <TAB> laat het er inderdaad heel professioneel uit zien, ook al ben je dat niet. :puh:

Verder zag ik ergens dat iemand zei dat <p> moet worden afgesloten, en dat is natuurlijk niet zo... Je kunt ook zonder problemen een paar <p>'tjes achter elkaar zetten zonder sluit-tag, behalve de laatste geloof ik.

Ikzelf doe overigens mèt, anders wordt het minder overzichtelijk.

Geplaatst:

Inspringen mat <TAB> laat het er inderdaad heel professioneel uit zien, ook al ben je dat niet. :puh:

Ik had het niet over iets als <tab>, dat bestaat volgens W3C niet eens, maar over iets als dit:

<center>
Boulevard of Broken dreams
<br />
<ol style="font-style:italic;">
	<li>21 Guns</li>
	<li>Holiday</li>
	<li>Know your enemy</li>
	<li>American Idiot</li>
</ol>
and much more!
</center>

Verder zag ik ergens dat iemand zei dat <p> moet worden afgesloten, en dat is natuurlijk niet zo... Je kunt ook zonder problemen een paar <p>'tjes achter elkaar zetten zonder sluit-tag, behalve de laatste geloof ik.

Nee, het hoeft niet, maar dan moet je niet gaan zeuren als je plotseling verkeerd wordt weergegeven in de browser. :puh: Sluit alles gewoon af, gebruik aanhalingstekens voor waarden van variabelen en alles werkt perfect. :)

Geplaatst: (bewerkt)

met afsluiten wordt bedoeld dat alle <p>'s aan het einde uiteindelijk in de goede volgorde zijn afgesloten. Het betekend dus niet dat het alleen zo mag:

<p>1</p><p>2</p><p>3</p><p>4</p>

Want met mag gerust zo:

<p>1<p>2<p>3<p>444</p></p></p></p>

Wat dan weer NIET mag:

<p>1<p>2<p>3<p>444</p>

dus: 4x openen -> 4x sluiten.

Ook moet het in de goede volgorde, het volgende mag NIET:

<i><u>hoi</i></u>

Maar dit wel:

<i><u>hoi</u></i>

Bovenstaande voorbeelden worden duidelijker als je de elementen zoals hierboven aangegeven laat inspringen.

Overigens, eigenlijk was het idee dat invalide pagina's helemaal niet weergegeven mochten worden. Op een of andere manier zijn browsers het wel zijn accepteren, waardoor nu overal invalide pagina's voorkomen. Eigenlijk wilden 'ze' dat je bij fouten gewoon een foutmelding kreeg, net als bij javascript en php, en deels css, maar ook C en C++, etc.. Om het error-idee terug te krijgen, hebben ze XHTML geïntroduceerd, maar nog niet veel browsers ondersteunen dit, waaronder IE (die parst het gewoon als HTML).

EDIT:

Ik heb de begin-code even door de html validator gehaald, en de opgeschoonde code ziet er dan zo uit:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
   <head>
       <title>
           Mijn eerste HTML-code
       </title>
       <style type="text/css">
body {
       background-image: url(Lol.jpg);
       }
       div.c6 {text-align: center}
       li.c5 {list-style: none}
       h3.c4 {color: green}
       span.c3 {color: red}
       span.c2 {color: green}
       h1.c1 {color: green}
       </style>
   </head>
   <body>
       <h1 class="c1">
           Greenday Rocks!
       </h1><span class="c2"><span class="c2">Do you love greenday? Then join our community!</span></span>

       <div class="c6">
           <h3 class="c4">
               <span class="c3"><u>Some songs of Greenday</u></span>
           </h3>
           <ol>
               <li class="c5">
                   <span class="c2"><span class="c3"><u><i>Boulevard of Broken dreams<br></i></u></span></span>
               </li>

               <li>
                   <span class="c2"><span class="c3"><u><i>21 Guns</i></u></span></span>
               </li>
               <li>
                   <span class="c2"><span class="c3"><u><i>Holiday</i></u></span></span>
               </li>
               <li>
                   <span class="c2"><span class="c3"><u><i>Know your enemy</i></u></span></span><span class="c2"><span class="c3"><u>and much more!</u></span></span>

               </li>
               <li>
                   <span class="c2"><span class="c3"><u><i>American Idiot</i></u></span></span>
               </li>
           </ol>
       </div><span class="c2"><span class="c3"><u><br>
       <br>
       <br>

       <br>
       <b>Thanks to megadreams for helping with HTML, and also gtaforum for the good times!<br>
       <a href="http://www.gtaforum.nl/index">GTAFORUM</a><br>
       <a href="http://egph-productions.eu/taal.php?p=/">EGHP-productions</a></b></u></span></span>
   </body>
</html>

Bewerkt: door marcootje
Geplaatst:

Het afsluiten van <p> mag, maar hoeft niet. Dat voorbeeld wat "niet werkt" werkt gewoon, enkel heb je besloten om hem bij de laatste wel te sluiten, ik durf voor 100 euro te wedden dat dit ook gewoon zal werken. ^^

Geplaatst: (bewerkt)

geef eens een voorbeeld van wat jij denkt wat werkt waarvan jij denkt dat ik denk dat het niet werkt, volledig met html, head en body-elementen :) .

Bewerkt: door marcootje
Geplaatst:

Tuuurlijk werkt dat ook! BIj de tutorial zeiden ze dat het niet moest, dus ja... Overigens ondervond ik geen enkel probleem met m'n script, alles werkte perfect. Ik gebruik HTML-kit.

Geplaatst:

Tuuurlijk werkt dat ook! BIj de tutorial zeiden ze dat het niet moest, dus ja... Overigens ondervond ik geen enkel probleem met m'n script, alles werkte perfect. Ik gebruik HTML-kit.

Dus omdat een tutorial het zegt klopt alles direct? Nee! Als ik een tutorial zou maken over PHP zonder te weten hoe PHP werkt dan klopt alles toch ook niet wat erin staat? Maar zoals jij zegt wel, want het is een tutorial. Je moet niet alles geloven, het zijn ook maar mensen, mensen maken fouten, er zijn maar enkele tags die je niet hoeft te sluiten, dit zijn <hr/> en <br/>, meer weet ik zo niet, maar over het algemeen heeft bijna elke tag een opening en een sluiting van de tag.
Geplaatst: (bewerkt)
er zijn maar enkele tags die je niet hoeft te sluiten, dit zijn <hr/> en <br/>, meer weet ik zo niet, maar over het algemeen heeft bijna elke tag een opening en een sluiting van de tag.

Een lijstje van elementen die geen afsluit-tag hebben:

<area />

<base />

<basefont /> (deprecated)

<br />

<col />

<frame />

<hr />

<img />

<input />

<link />

<meta />

<param />

Zie w3schools.com voor een compleet overzicht van elementen.

En inderdaad, niet alles wat in een tutorial staat moet je geloven. Ik heb zat tutorials gezien waar iets niet helemaal klopte. Ik heb ook een paar tutorials geschreven, en er zal vast wel iets in staan wat niet helemaal klopt, of wat eigenlijk niet 'mag'. Maar dat geeft niet, want dan heeft degene die hem volgt weer wat te doen :puh: .

De beste kennis komt overigens van zelf proberen, niet van tutorials volgen...

Bewerkt: door marcootje
Geplaatst:

Tuuurlijk werkt dat ook! BIj de tutorial zeiden ze dat het niet moest, dus ja... Overigens ondervond ik geen enkel probleem met m'n script, alles werkte perfect. Ik gebruik HTML-kit.

Dus omdat een tutorial het zegt klopt alles direct? Nee! Als ik een tutorial zou maken over PHP zonder te weten hoe PHP werkt dan klopt alles toch ook niet wat erin staat? Maar zoals jij zegt wel, want het is een tutorial. Je moet niet alles geloven, het zijn ook maar mensen, mensen maken fouten, er zijn maar enkele tags die je niet hoeft te sluiten, dit zijn <hr/> en <br/>, meer weet ik zo niet, maar over het algemeen heeft bijna elke tag een opening en een sluiting van de tag.

Dat bedoel ik niet. Ik bedoel dat ik het zo gedaan had omdat de tutorial het zei. Niet dat jullie/de tutorial juist is.

  • 2 weken later...
Geplaatst: (bewerkt)
er zijn maar enkele tags die je niet hoeft te sluiten, dit zijn <hr/> en <br/>, meer weet ik zo niet, maar over het algemeen heeft bijna elke tag een opening en een sluiting van de tag.

Een lijstje van elementen die geen afsluit-tag hebben:

ELKE tag moet afgesloten worden in xhtml, en afsluiten doe je met een /, die codes die jij geeft worden dus OOK afgesloten, namelijk door de / achteraan (bijv. <br />)

Het afsluiten van <p> mag, maar hoeft niet. Dat voorbeeld wat "niet werkt" werkt gewoon, enkel heb je besloten om hem bij de laatste wel te sluiten, ik durf voor 100 euro te wedden dat dit ook gewoon zal werken. ^^

Werken en kloppen is wat anders hè: Als ik heir zo zitten typen je kun dit wrshijcliajank lezen ook, maar koplt van geen ene *** van. Luister dus maar naar het W3C, en script netjes, dus door alle tags af te sluiten ^_^

Bewerkt: door RoL0
Geplaatst:
er zijn maar enkele tags die je niet hoeft te sluiten, dit zijn <hr/> en <br/>, meer weet ik zo niet, maar over het algemeen heeft bijna elke tag een opening en een sluiting van de tag.

Een lijstje van elementen die geen afsluit-tag hebben:

ELKE tag moet afgesloten worden in xhtml, en afsluiten doe je met een /, die codes die jij geeft worden dus OOK afgesloten, namelijk door de / achteraan (bijv. <br />)

Ervan uitgaande dat deze reactie werd geplaatst omdat de betreffende schrijver vindt dat ik iets zeg dat fout is, onderstaande reactie :puh: :

Inderdaad, ben het helemaal met je eens.

Daarbij moet ik zeggen dat het om 2 heel andere dingen gaat, en dat we allebei gelijk hebben. Ik zeg niet dat ze niet afgesloten hoeven worden. De elementen in het lijstje dat ik gaf, hebben zoals ik zei ook in xhtml geen afsluit-tag. Ze hebben een interne afsluiting (/), dus er is geen aparte afsluit-tag nodig. Zo was mijn bericht ook eigenlijk bedoeld, als zijnde 'ze hebben geen afsluit-tag, maar een interne afsluiting'.

Goed dat je het nog ff opmerkte :) .

Geplaatst:

Ervan uitgaande dat deze reactie werd geplaatst omdat de betreffende schrijver vindt dat ik iets zeg dat fout is, onderstaande reactie :puh: :

Ik wilde je bijna perfecte uitleg even helemaal perfect maken :clown: (aangezien een van dé verschillen van html en xhtml is dat alle tags afgesloten moeten worden)

Post was ook vooral op het onderste gericht, op Ghosty, die vind dat het afsluiten niet hoeft.

Een reactie plaatsen

Je kan nu een reactie plaatsen en pas achteraf registreren. Als je al lid bent, log eerst in om met je eigen account een reactie te plaatsen.

Gast
Op dit onderwerp reageren...

×   Je hebt text geplaatst met opmaak.   Opmaak verwijderen

  Only 75 emoji are allowed.

×   Je link is automatisch ingevoegd.   In plaats daarvan weergeven als link

×   Je vorige bewerkingen zijn hersteld.   Alles verwijderen

×   You cannot paste images directly. Upload or insert images from URL.

  • Recent actief   0 leden

    • Er zijn hier geen geregistreerde gebruikers aanwezig.
×
×
  • Create New...