Jump to content

Eerste HTML-script

Dakendak

Door Dakendak
in Computer Talk

 Share

Recommended Posts

marcootje FBI infiltrant

marcootje

Geplaatst:
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: .

Link to comment
Delen op andere websites
Thundercover Forum Legend

Thundercover

Geplaatst:
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.

Link to comment
Delen op andere websites
Ghosty Postless Person

Ghosty

Geplaatst:
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.

Link to comment
Delen op andere websites
Thundercover Forum Legend

Thundercover

Geplaatst:
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. :)

Link to comment
Delen op andere websites
marcootje FBI infiltrant

marcootje

Geplaatst:
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
Link to comment
Delen op andere websites
NickyHendriks Legendary Godfather

NickyHendriks

Geplaatst:
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.
Link to comment
Delen op andere websites
marcootje FBI infiltrant

marcootje

Geplaatst:
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
Link to comment
Delen op andere websites
Dakendak Postless Person

Dakendak

Geplaatst:
  • Auteur
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.

Link to comment
Delen op andere websites
  • 2 weken later...
RoL0 Maffia baas

RoL0

Geplaatst:
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
Link to comment
Delen op andere websites
marcootje FBI infiltrant

marcootje

Geplaatst:
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 :) .

Link to comment
Delen op andere websites
RoL0 Maffia baas

RoL0

Geplaatst:
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.

Link to comment
Delen op andere websites

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.

×
 Share
Naar onderwerpenlijst

  • Recent actief   0 leden

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