zondag 17 augustus 2008

Websites maken: het begin (HTML)

Iedereen droomt er wel eens van een website te maken die dan door de hele wereld bekeken kan worden. Het eenvoudigste is een reeds volledig voorbereidde website te gebruiken waarbij jullie alleen nog maar moeten ingeven welke tekst de bezoekers mogen zien. Programma's om dergelijke websites te maken zijn al zeer ver geƫvolueerd en tegenwoordig kunnen jullie zelfs met enkele muisklikken een volledige structuur veranderen. Willen jullie daarentegen het maken van een website zelf beter in handen hebben, dan is de uitleg in dit artikel zeer geschikt. Ik waarschuw jullie wel dat jullie een nieuwe 'taal' te leren krijgen en hier geldt de gouden regel: "Oefening baart kunst". Geef dus niet op bij de eerste mislukking, vragen staat vrij, stuur al jullie vragen naar wardlenaerts@gmail.com en ik help jullie zo snel mogelijk uit de nood.

De voorbereiding:
Het is handig dat je al een onderwerp hebt, zodat wij heel de website rond een bepaald thema kunnen bouwen. Dit maakt het kiezen van de structuur en de kleuren al een stuk gemakkelijker. Om onze taal op te stellen, gebruiken we het programma 'kladblok' (in Windows bij Start --> Alle Programma's --> Bureau-accessoires --> Kladblok).

De eerste uitleg:
De 'taal' HTML (HyperText Markup Language) bestaat uit zogenaamde tags. Dit is code die de browser (zoals internet explorer, firefox, opera, safari,...) vertellen wat deze moeten laten zien. Voor alle tags die er bestaan verwijs ik jullie naar http://www.W3.org , de website waar jullie alle standaarden kunnen terugvinden.

De eerste code:
ELKE webpagina bevat onderstaande code. Kopieer dus altijd voor jullie beginnen met 'programmeren' onderstaande blok in elke pagina.










De tag html opent het hele bestand.
In het onderdeel head komt alle informatie die niet zichtbaar is wanneer jullie je webpagina openen, maar waar bijvoorbeeld zoekrobots (google, yahoo, etc...) informatie uit halen. De enige tag die wel zichtbaar is, is de title tag. Datgene jullie in de title tag zetten komt te voorschijn helemaal bovenaan in de balk van je webbrowser. Merk ook op dat we alle tags ook afsluiten met een endtag (hierin komt een slash (/) voor).
In de tag body komen de zichtbare onderdelen: teksten, plaatjes, links, enz...

De eerste webpagina:
Om bovenstaande code nu geschikt te maken voor het internet, slaan we onze tekstfile op als html-file (In Windows kladblok --> Bestand --> Opslaan als --> Bij de naam veranderen jullie .txt in .html). Wanneer jullie nu dubbelklikken op deze file, opent zich jouw eerste webpagina in jullie default webbrowser. PROFICIAT!


Dit artikel is onderdeel van het Webdesigner worden : Stappenplan

Geen opmerkingen: