HTML is voor Internet wat Chinees is voor de Chinezen. Maar in tegenstelling tot Chinees is HTML gemakkelijk. Hieronder vind je enkele bruikbare tips die je toelaten je artikel een visuele meerwaarde te geven. Je zal meteen merken dat je het principe van HTML in enkele minuten onder de knie hebt.
[Weergave van tekst]
[Structureren van tekst]
[Hyperlinks]
[Afbeeldingen]
[Hulp en vragen]
Via enkele korte statements kan je delen in je tekst zelf lay-outen. Bekijk het volgende statement eens:
Het voorbeeld geeft eerst de HTML-code weer, na de dubbele punt gevolgd door wat je te zien krijgt in je internetbrowser.
de structuur "<b> ... </b>" noemt men een element. Het eerste deel ervan (<b>) laat een computer weten dat hetgeen volgt in het vet moet komen te staan. Je browser zal alles in het vet weergeven tot ie het tweede deel van je statement tegenkomt (</b>). Eenvoudig, niet?
Je gaat natuurlijk niet enkel tekst in het vet willen zetten. Hieronder volgt een lijst met handige en gebruiksklare elementen:
| <i>cursief</i> : | cursief |
| <u>onderstreept</u> : | onderstreept |
| <b>vet</b> : | vet |
| <big>groot</big> : | groot |
| <small>klein</small> : | klein |
| <sub>subscript</sub> : | subscript |
| <sup>superscript</sup> : | superscript |
Leuk wordt het pas als we elementen gaan combineren:
let op!
Zorg ervoor dat je steeds een element afsluit met het tweede deel van je element (</b>). Zoniet zal je browser alles wat hij tegenkomt na <b> in het vet weergeven, wat niet de bedoeling kan zijn.
Lettertypes, -grootte en -kleuren kan je bepalen met het <font> element. We leggen de juiste syntaxis uit aan de hand van het volgende voorbeeld:
We maken hier bij het element <font> gebruik van een attribuut, namelijk "size". Een attribuut is naast een element een vitale bouwsteen van HTML. Het geeft eigenlijk weer welke specifieke eigenschappen je element moet hebben. Vergelijk het met een nieuwe jas die je koopt. Je element is dan een jas, terwijl de kleur, grootte en waterdichtheid van de jas attributen (of eigenschappen) zijn.
Het attribuut wordt telkens in het eerste deel van een element opgenomen en heeft een standaardweergave <font attribuut="attribuutwaarde">...</font>.
Bij het element <font> kan je de volgende attributen opnemen, al is dat niet verplicht:
| <font size="X" >...</font> : | X geeft de lettergrootte weer, dewelke varieert van 1 tot 7. |
| <font color="X" >...</font> : | X kan zowel een RGB-waarde zijn als een Engelstalige kleurennaam. |
complexere attributen voor het <font> element vind je hier.
Bij het schrijven in HTML moet je eigenlijk in de huid van een computer kruipen. Dat vraagt wat aanpassing. HTML-taal herkent bijvoorbeeld geen harde returns (een nieuwe regel beginnen door op de "enter"-toets te drukken), en herwerkt twee opeenvolgende spaties tot slechts eentje. Je kan dus wel even schrikken als je het uiteindelijke resultaat van je onderneming ziet.
Om je tekst overzichtelijk te structureren kan je verschillende statements en tekens gebruiken. Een paragraaf omsluit je met het element <p>...</p>,hetwelk een witregel voor en na de tekst laat. Wanneer je dus een artikel in HTML publiceert, dan bestaat dat grof uitgedrukt uit blokken tekst die telkens voorafgegaan worden door <p> en afgesloten door </p>.
Een nieuwe regel beginnen doe je met <br>.
let op!
Het <br> element is een vreemde eend. Er bestaat namelijk niet zoiets als </br>. Dat is logisch, want je kan je de vraag stellen wat er dan wel zou staan tussen <br> en </br>. Het <br> element bestaat dus slecht uit een deel.
Dit is een eerste regel<br>Dit is een tweede regel : |
Dit is een eerste regel |
Bij het <p> element kan je het align-attribuut opnemen, waarmee je de uitlijning van de alinea in kwestie vastlegt:
| <p align="center">...</p> : | hiermee wordt de tekst gecentreerd. Andere attribuutwaarden zijn: left, right en justify (uitvulling aan weerszijden) |
Mocht je om bepaalde redenen twee opeenvolgende spaties willen opnemen in je uiteindelijke tekst, dan moet je dat expliciet aan de computer laten weten. Dat doe je met het "no-breaking space" teken. Dergelijke speciale tekens zijn hier in het een lijst verzameld.
Koppen maak je met het <hX>...</hX> element, waarbij je X vervangt door een getal van 1 tot 6, naargelang de grote die je kop moet krijgen. Ook hierin kan je desgewenst werken met een align-attribuut, om bijvoorbeeld je kop te centreren:
| <h4>Dit is kop H4</h4> : | Dit is kop H4 |
Een link in je tekst aanmaken doe je met het <a> element:
Het HREF-attribuut gebruik je om het adres op te geven waarnaar de link gelegd moet worden. De tekst tussen het eerste en tweede deel van het <a> element is de tekst die de lezer te zien krijgt en dewelke hij/zij kan aanklikken om de link te volgen. Een goede raad: maak deze tekst niet te lang.
Je kan ook in je artikel zelf met links werken. Deze cursus maakt er handig gebruik van, zoals je kan merken in de inhoudstafel. Als je daar bijvoorbeeld "3. Hyperlinks" aanklikt, volgt de browser een link die je naar dit onderdeel van de cursus brengt. Een link binnen eenzelfde pagina wordt een interne link genoemd, en maak je op de volgende wijze:
De plek waarnaar je wil verwijzen moet worden aangeduid met een NAME-attribuut: <a name="begin" >...</a>. De waarde die dit attribuut krijgt kan je zelf bepalen. Wij kozen voor "begin", omdat we zo meteen naar het begin van deze snelcursus HTML willen verwijzen. Het is dus de bedoeling dat je in je HTML-code het <a> element met NAME-attribuut op die plaats zet waar je de lezer naartoe wil brengen als hij/zij de link volgt. Wij nemen <a name="begin" >...</a> dus op in het begin van onze cursus.
De link zelf leg je op de volgende manier:
Een gouden regel die voor HTML in het algemeen en afbeeldingen in het bijzonder geldt is: geniet, maar link met mate. Je gebruikt HTML in de eerste plaats om praktische en esthetische redenen, niet om je lezers hoofdpijn te bezorgen.
Meer informatie over interne en externe hyperlinks vind je http://www.dto.tudelft.nl/mirhtml/html/hyperlinks/hyperlinks01.html">hier.
Ook met afbeeldingen ben je beter zuinig als je een aantrekkelijk artikel wilt publiceren op Indymedia.
Voor afbeeldingen voorziet Indymedia een vereenvoudigde code, die je opmerkt als je een artikel publiceert. Je kan je afbeeldingen uploaden, waarna ze de namen #file_1#, #file_2#, #file_3#, etc. krijgen. In je tekst kan je op de plek waar je de afbeelding wilt invoegen gewoon "#file_1#" schrijven.
Je kan bij het uploaden van je afbeeldingen ook de uitlijning van de afbeelding specificeren: links of rechts.
Dat heeft nog maar weinig met het zelf schrijven van HTML te maken, maar is wel een stuk eenvoudiger. Voor meer informatie over afbeeldingen in HTML verwijzen we opnieuw naar elders.
Voor vragen omtrent HTML kan je steeds bij de medewerkers van Indymedia-Vlaanderen terecht op het volgende adres: imc-vl@piexie.net. We helpen je met veel plezier verder, dus aarzel niet ons te contacteren.
Heb je de smaak van HTML te pakken? Dan verwijzen we je naar de uitstekende en uitgebreide online HTML-cursus van de Technische Universiteit Delft.
Een handige HTML-editor vind je overal op het internet: bijvoobeeld bij Tucows.