In dit nummer:

- Quick Tip: .nl domeinnamen nu voor iedereen!
- Vraag van de week: Hoe maak je de lettergroote onafhankelijk van instellingen bezoekers?
- Webdesign: Zo maak je je site super snel en bespaar je een hoop op je traffic!
- Cursus HTML deel 9: Werken met frames.
- Promotie: Makkelijk uit te voeren tips die er voor zorgen dat bezoekers langer op je site blijven en die veel beter lezen. Deel 4: Win het vertrouwen van je bezoekers.

.nl domeinnamen nu voor iedereen!

Wist je dat vanaf 29 januari 2003 .nl domeinnamen ook door particulieren geregistreerd mogen worden? Een inschrijving van de Kamer van Koophandel is niet meer nodig! Klik hier om te kijken of je domeinnaam nog vrij is.

Veel plezier met het eerste magazine van 2003!

Chris Vermeulen

Hoe maak ik de lettergrootte op mijn site zo dat deze niet afhankelijk is van de instellingen van de bezoekers?

Dat is de vraag die Michel van Nederveen uit Vlaardingen aan ons stelde. Gefeliciteerd Michel, je bent de eerste die in deze rubriek een vraag stelt.

Ik leg het probleem nog iets beter uit, want dit is iets wat ons allemaal aan gaat. In je Internet browser kun je bij "beeld" ("view") op "tekengrootte" ("text size") klikken. Daar kun je instellen hoe groot je de letters op je scherm wilt hebben. Probeer het maar eens. Ga maar eens naar deze webpagina. Klik even op de menuknop "de kunstenaar". Verander een paar keer de grootte van de tekens zoals hierboven beschreven. De hele opmaak van je site kan behoorlijk in de war geschopt worden als de lettergrootte verandert. Daarom wil je een vaste grootte.

Er zijn natuurlijk mensen die liever een groot lettertype hebben omdat ze bijvoorbeeld hun bril niet bij hebben ofzo. Ik ga nu niet verder in op de vraag of je de grootte wel of niet vast moet leggen, maar alleen hoe je dat doet.

Het antwoord:

Om de lettergroote op je website een vaste waarde mee te geven en zo ongevoelig te maken voor de instellingen van je bezoekers moet je werken met Style Sheets. Style Sheets bepalen voor een hele pagina of voor een hele site de grootte van de teksttekens. Hierdoor wordt de tekst ongevoelig voor de instellingen van de bezoekers.

Er zijn verschillende software pakketten waarmee je een pagina kunt ontwerpen, zoals Frontpage en Dreamweaver. Daar moet je de tekst soort dan op "default" of "standaard" zetten en de grootte op "none" of "geen".

Een voorbeeld van een site waarvan de tekst ongevoelig is gemaakt voor de instellingen van de bezoekers is de site van Alphamega. Ga maar eens naar hun site om daar uit te proberen of je de lettergrootte kunt aanpassen zoals hierboven besproken.

Tja, hoe werkt dat dan met die Style Sheets? Goeie vraag. Daar kan ik niet in een paar zinnen op antwoorden. Ik adviseer je om de CSS (Cascading Style Sheets) cursus van mijnhomepage.nl te raadplegen voor een exacte uitleg. Ga daarvoor naar: http://www.mijnhomepage.nl/csscursus

Dat was het voor deze keer. Ik hoop dat je hier iets van geleerd hebt en dat je site er beter van wordt. Zo kunnen we van elkaar leren. Heb je ook een vraag? Stuur je vraag dan per email naar: vragen@websuccesmagazine.com

Het maakt niet uit waar je een vraag over hebt. Het mag een technische vraag zijn, een marketing vraag, een management vraag.

Zo maak je je site super snel en bespaar je een hoop op je traffic!

Heb je foto's of plaatjes op je site? Het is heel belangrijk dat je deze optimaliseert voor gebruik op het Internet. Neem bijvoorbeeld deze foto:

Gaaf ventje hè? Das mijn zoon...Tommy. Deze foto heb ik gemaakt met mijn digitale camera. Hij staat op mijn harde schijf en is 584kb groot. Als ik die foto zomaar op een site zo zetten gebeuren er twee dingen. De foto wordt lomp groot, zodat je moet scrollen om de hele foto te bekijken. En de foto is zoveel kb dat deze zo traag laadt dat je site heel traag wordt en je heel veel traffic verbruikt.

Wat moet je doen? Ongetwijfeld heb je een programma waar je foto's mee kunt bewerken. Enkele voorbeelden zijn Fireworks, en Photoshop. Met zo'n programma kun je dan het formaat van de foto bepalen en je kunt de resolutie bepalen. Ik hoor sommigen denken: "dat is toch hetzelfde?". Niet helemaal.

Eerst maar eens wat meer over de resolutie. Deze wordt uitgedrukt in dpi - dots per inch. Een inch is ongeveer 2,5 cm. Het gaat dus om hoeveel puntjes (dots) er op 2,5 cm staan. Welnu, als je op je monitor een scherp beeld wilt moet je werken met 72 dpi. Dat is maximaal scherp. De gewenste resolutie voor printen is 150 dpi en voor kraak helder drukwerk is het 300 dpi.

Met formaat bedoel ik de grootte hoe de foto op je beeldscherm komt. De foto staat op mijn hardeschijf en is 1280 x 960 dpi. Als ik de foto wil laten afdrukken met een kwaliteit van 300 dpi. dan is die maximaal 4,25 x 3,2 inch (1280/300 x 960/300). In centimeters is de afgedrukte foto dan 10,5 x 8 cm. Dat is dus de maat bij 300 dpi. Maar op je monitor werk je met 72 dpi. Dan wordt de foto dus 45 x 33 cm. Het hele beeld dus.

Met zo'n fotobewerkingsprogramma kun je dus zowel het formaat als de dpi instellen. Je kunt dus een foto resizen naar bijvoorbeeld 267 x 200 (is het formaat van de foto hierboven). Vervolgens kun je kiezen hoeveel dpi de foto moet zijn. Van 10 tot 300 dpi en zelfs nog meer. Maar dat heeft helemaal geen zin. Je moet de dpi gewoon op 72 zetten. Dat is maximaal scherp op je monitor. Maak je de foto bijvoorbeeld 150 dpi dan zie je op je scherm totaal geen verschil met 72 dpi maar de foto wordt wel zwaarder, als bestand zijnde. Daardoor laadt de foto trager en verbruikt die meer traffic.

Dus: stel het formaat in zoals je het graag op je scherm wilt zien en zet de dpi op 72. Resultaat: de foto is geen 584kb maar 13,7kb (!) Als je het zo aanpakt, ook met plaatjes e.d. dan past je hele site op een diskette! Dat is dus kleiner dan 1,5 mb! Je hele site!

Veel succes met het versnellen van je site!

Deel 9: Werken met Frames

Frames worden vooral gebruikt om de navigatie binnen een site te verbeteren. Dit onderwerp behoort net als het werken met tabellen tot de moeilijkere gebieden van HTML. Hier zal ik je de basisbeginselen van het werken met frames uit te leggen.

Voordat ik begin, zou ik je willen aanraden frames niet te gebruiken, tenzij het echt niet anders kan.

Er kleeft namelijk een aantal belangrijke nadelen aan het gebruiken van frames. Zo worden frames niet door oude browsers ondersteund (pas vanaf Netscape 2.0 en IE 3.0), ook hebben zoekmachines vaak moeite met het indexeren van frames- paginas, waardoor je bezoekers kunt mislopen.
Tenslotte kan het bookmarken van een framespagina problemen opleveren.

Veel dingen waarvoor men frames gebruikt, zijn ook te maken met tabellen, waarmee je deze nadelen niet hebt. Toch zijn frames nu eenmaal onmisbaar wanneer je een pagina wilt maken met verschillende, onafhankelijk van elkaar werkende secties.

Hoe Functioneren Frames?

Zoals al gezegd, dienen frames vooral voor de navigatie op een site.
Dit gebeurt, doordat de frames het scherm splitsen in verschillende secties. Hoe die splitsing plaatsvindt, staat in de hoofdpagina van de website, meestal de index.html file. Bij de links binnen de frames moet worden aangegeven waar de paginas geladen worden of dat ze zonder de frames weergegeven worden.

De <FRAMESET> tag

Deze tag komt dus op de hoofdpagina van je site (meestal index.html).
De tag vervangt de <BODY> tag van de hoofdpagina. Met de FRAMESET tag geef je aan hoe, en waar de pagina gesplitst wordt. Als je de pagina wilt splitsen in kolommen en rijen, heb je twee FRAMESET tags nodig, voor ieder één.

Om de grootte van de frames aan te geven, moet je de volgende attributen gebruiken:

rows: hiermee bepaal je de horizontale splitsing van de pagina.
De waarde die je invult is, of in pixels, of in een percentage. Je kunt het beste percentages gebruiken, dan ben je het minst afhankelijk van de browserinstellingen van je bezoekers.

Een voorbeeld van een pagina die in drie horizontale delen gesplitst is:

<HTML>
<HEAD>
<TITLE>Framesvoorbeeld met rijen</TITLE>
</HEAD>
<FRAMESET rows="30%,50%,20%">
 <FRAME src="document1.html">
 <FRAME src="document2.html">
 <FRAME src="document3.html">
</FRAMESET>
</HTML>

Klik hier om het resultaat te zien!

Je ziet, de pagina is nu horizontaal verdeeld in drie frames d.m.v. het attribuut: rows.

cols: Hetzelfde als bij de rows. Alleen wordt nu de pagina verticaal gesplitst.

Een voorbeeld van een pagina die in drie verticale delen gesplitst is:

<HTML>
<HEAD>
<TITLE>Framesvoorbeeld met kolommen</TITLE>
</HEAD>
<FRAMESET cols="30%,50%,20%">
 <FRAME src="document4.html">
 <FRAME src="document5.html">
 <FRAME src="document6.html">
</FRAMESET>
</HTML>

Klik hier om het resultaat hiervan te zien!

Nu zie je dat de pagina nu verdeeld is in drie verticale frames door het cols attribuut.

De <FRAME> tag

In de bovenstaande voorbeelden zag je deze tag al staan. Deze tag staat in de FRAMESET tag. De functie van de <FRAME> tag is, aan te geven welke paginas in de verschillende frames moeten worden geladen.

De <FRAME> tag kan de volgende attributen hebben:

src: dit staat voor "source" en dit attribuut geeft het adres aan waar de te laden pagina staat. Dit is een verplicht attribuut.

name: Als je vanuit het ene frame een pagina in een ander frame wilt laden, moet je de frames een unieke naam geven. Deze naam heeft niets te maken met het adres van het frame. Deze naam geef je met het attribuut name.

Zo dus:

<FRAME src="hetadres" name="framenaam">

Als je nu een pagina wilt laten verschijnen in het frame, dan moet je in de link (de <A> tag) naar die pagina het attribuut target toevoegen, met daarin als waarde de naam van het frame.

Op deze manier:

<A href="adres" target="framenaam">

marginwidth: bepaalt de dikte van de linker- en rechtermarge in aantallen pixels.

marginheight: bepaalt de hoogte van de "top" en "bottom" marge van het frame in aantallen pixels.

scrolling: hiermee kun je instellen of je scrollen in het frame mogelijk wilt maken. Mogelijke waarden zijn: yes, no en auto. Standaard is auto (dus als je scrolling niet instelt). Bij auto wordt scrollen automatisch mogelijk als het nodig mocht zijn.

noresize: de grootte van de frame kan nu niet aangepast worden door de bezoeker. Je hoeft geen waarde in te vullen. Zet gewoon noresize in de FRAME tag.

frameborder: hiermee kun je een rand tussen de frames instellen. Standaard staat hij al op "yes". Mogelijke waarden zijn: yes en no.

framespacing: stelt een ruimte in tussen de verschillende frames in aantallen pixels.

De <NOFRAMES> tag

In deze tag kan je een URL opnemen waar bezoekers, met een browser die geen frames aankunnen, heengestuurd worden.

Een voorbeeld:

<NOFRAMES>http://www.mijnhomepage.nl/
index.php</NOFRAMES>

Einde Les Acht en Einde HTML Cursus

In deze les vond je de beginselen van frames. Natuurlijk is het hier, net als bij tabellen, zaak om veel te oefenen en experimenteren. Kijk ook naar andere sites om te kijken hoe zij met frames werken.

Dit is ook het einde van de HTML cursus. Ik ga er van uit dat je er wat aan gehad hebt en dat je er ook wat mee doet. Het is nl. erg handig om zelf je site aan te kunnen passen.

Inmiddels is er trouwens een opvolger van HTML en dat is XHTML. XHTML is een strengere en schonere code dan HTML en het zal in de toekomst steeds vaker gebruikt gaan worden. Je kunt XHTML vrij gemakkelijk leren, want er zijn maar een paar grote verschillen met HTML. Leer dus ook XHTML via onze XHTML Cursus!

Met dat wat je in de voorgaande lessen geleerd hebt, moet je in staat zijn een aardige website te bouwen. Ik wens je daar veel plezier en succes mee!

Je kunt dit artikel altijd opzoeken op onze website. Ken je iemand die ook geholpen zou zijn met deze cursus? Mail gewoon dit exemplaar van Web Succes Magazine naar die persoon en vertel hem dat hij ook lid kan worden! Ze zullen het zeer waarderen!

Deze cursus HTML valt onder copyright van mijnhomepage.nl. Dit artikel mag niet worden overgenomen zonder uitdrukkelijke toestemming van de webmaster van mijnhomepage.nl.

Makkelijk uit te voeren tips die er voor zorgen dat je bezoekers langer op je website blijven en die veel beter lezen. Deel 4.

Om je te helpen bij het grijpen van de aandacht van de bezoeker en deze vast te houden heb ik de volgende vijf super simpele tips voor je uitgewerkt. Doe er één of twee en zult al verschil gaan zien. Doe ze allemaal en je site wordt een groot succes!

We hebben voorheen behandeld deel 1, What's in it for me? Kruip in de huid van je bezoeker en vraag je telkens af: "Wat heb ik hier aan?" En deel 2: Leid je bezoeker door je site. Eigenlijk moet je de bezoekers een rondleiding geven door je site. Net als in een museum of een supermarkt. Daar wordt de bezoeker langs alle belangrijke items geleid op een heel natuurlijke manier. En deel 3: "Het K.I.S.S. systeem" Keep it Stupid Simple. Houd het eenvoudig en duidelijk. Vermijd moeilijke woorden en houd de tekst overzichtelijk.

Vandaag gaan we verder met deel 4:

Win het vertrouwen van je bezoekers.

Alles heeft met elkaar te maken. Het geheel is meer dan de som der delen. Alle communicatie draagt bij aan het winnen van het vertrouwen van je bezoekers. En dat is belangrijk als je wilt dat ze iets van kopen, bestellen of naar je winkel komen.

Je bezoekers kunnen je niet zien. Ze kunnen niet met je praten en kunnen je dus niet (direct) vertellen wat ze willen. Daaom is het juist op het Internet zo belangrijk om bij alles wat je doet, het belang van de cliënt / bezoeker voor ogen te houden. (What's in it for them?)

Als je die houding aanneemt dan wasem je dat uit in alle communicatie. Je kunt het niet faken (niet net doen alsof). Dat - en dat alleen - geeft je bezoekers het gevoel dat ze je kunnen vertrouwen.

Verder zijn er een paar hele krachtige, eenvoudige manieren om dat vertrouwen te ondersteunen. Ik zet ze voor je op een rij:

- Naam, adres, telefoonnummer. Liefst op de homepage van je site. Dan is het duidelijk, open en eerlijk wie je bent en waar ze je kunnen vinden. Dit ondersteunt het vertrouwen.

- Contactformulier. Zorg voor een contactpagina op je site die direct te bereiken is vanaf je homepage. Zet daar je volledige gegevens neer en tevens een contactformulier. Maak het mensen makkelijk om contact met je op te nemen. Speel geen verstoppertje. Meer hier over op onze website.

- Getuigenissen. Dit is wel de meest krachtige vorm van het bouwen van geloofwaardigheid. Vraag aan je cliënten (of website bezoekers/gebruikers) of ze eerlijk willen vertellen wat ze van je site, product, dienst vinden. Vraag dan netjes of je hun testamonial mag gebruiken op je site. Klik hier voor een voorbeeld.

Hoe pas je dit nou toe op je eigen site? Kijk eerst eens hoe makkelijk het is voor een bezoeker om contact met je te zoeken. Heb je een menuknop "contact" op je homepage met daarachter een contactpagina? Dan is dat natuurlijk geweldig. Misschien kun je helemaal onderaan elke pagina in kleine letters je naam, adres en telefoonnummer plaatsen. En ten slotte zou je aan je bestaande relaties om een persoonlijk getuigenis kunnen vragen en die dan op je site plaatsen.

Voor een voorbeeld van alles wat we tot nu toe besproken hebben kun je eens een kijkje nemen op de site van Alphamega.

Veel succes!

Deze tips hebben natuurlijk alleen zin als je er ook wat mee doet. Daarom doen we één tip per magazine. Je hebt dan telkens twee weken de tijd om een tip te implementeren. Je zult de resultaten direct merken!

Volgende keer behandelen we de laatste tip (5): Check, check and check again!

Tot slot

Dat was het voor deze keer. Hopelijk ben je weer wat wijzer geworden.
Rond 22 januari 2003 verschijnt het volgende nummer. Zegt het voort!

Met vriendelijke groet,
Chris Vermeulen & Robert Heessels

Meer informatie?

Elke uitgave van het Web Succes Magazine wordt bewust niet te lang gemaakt om information overload te voorkomen.

Voorgaande nummers van dit magazine kun je vinden op www.websuccesmagazine.com.

Voor meer informatie kun je altijd terecht op onze websites:
Web Succes Magazine, mijnhomepage.nl en Alphamega Web Hosting.