Stap 3 Wat kunnen we met de inhoud?

Transcriptie

1 Stap 3 Wat kunnen we met de inhoud? We gaan in deze stap eens bestuderen wat we zoal voor mogelijkheden hebben om tekst op te maken en links in te voegen. Kompozer heeft voor de meest voorkomende zaken heel handige knopjes gemaakt die exact doen wat jij wilt en dat automatisch in HTML vertalen. En jij hoeft daar nog steeds geen enkele HTML-kennis voor te hebben. Eigenlijk komt het er een beetje op neer dat jij aangeeft welke tekst je wilt aanpassen door die te selecteren. En dat heb je waarschijnlijk al vaker gedaan in tekstverwerkers. We laten je nu weer aan de hand van onze homepage index.html zien hoe dat selecteren op verschillende manieren mogelijk is. En als jou dat helemaal duidelijk is gaan we één voor één de belangrijkste opmaak-gereedschappen bekijken. Zit je er goed voor, dan beginnen we Open Kompozer, en open dan uit de map starterspakket op je bureaublad de pagina index.html. Dat moet je doen door op bestand links bovenin te klikken en dan op bestand openen. Hier zoek je op de locatie bureaublad naar de map starterspakket. En in deze map haal je de gevraagde pagina op. Daar heb je al ervaring mee. Je werkgebied is nu gevuld met de homepage van jouw eerste website. Laten we eerst opnoemen hoe je tekst kunt selecteren. Alles wat je aan tekst selecteert komt in een blauwe achtergrond te staan. Ga met de cursor boven het woord staan dat je wilt selecteren en dubbelklik, het woord zal nu in zijn geheel geselecteerd zijn. selecteer één woord 19

2 Ga met de cursor ergens in een regel staan een klik snel achter elkaar drie keer, de hele regel is nu geselecteerd. selecteer één regel Ga met de cursor aan het eind van een tekstdeel staan dat je wilt selecteren en klik, houdt de linkermuisknop ingedrukt. Laat niet los en sleep nu terug naar het punt waar jouw tekstdeel begint. Als je exact op het beginpunt in het tekstdeel bent laat je de muisknop los en zie je dat het hele stuk tekst geselecteerd is. selecteer een tekstdeel Nou, dat is dus niet zo ingewikkeld, dat herken je vanuit Word of welke andere willekeurige tekstverwerker. Welke gereedschapjes gaan we in dit starterspakket bespreken? Ook hier geven we even een opsomming van. 1) Het onderscheiden van koppen, titels en dergelijke door vaste opmaken. Iedere kop boven een alinea krijgt daarmee bijvoorbeeld eenzelfde uiterlijk. 2) Keuze van het lettertype. 3) De lettergrootte. 4) Dik gedrukt, schuin, onderstreept. 5) Inspringen van tekst. 6) Benadrukken van woorden. 7) Een bulletpoint lijstje maken, je weet wel met van die bolletjes ervoor. 8) Een link aan een woord of tekstdeel koppelen, dat is echt héél handig. Daar komt ons vertrouwde koppelingseigenschappen -schermpje weer naar voren. 9) De achtergrondkleur van een woord of tekstdeel. 10) Het uitlijnen van een hele lap tekst, links, rechts en centreren. Er zijn nog wel wat mogelijkheden, maar als je deze beheerst ben je al heel hard op weg je eigen wensen gemakkelijk in te kunnen vullen. Waarschijnlijk zal alles je heel erg bekend voorkomen, het is echt niets anders dan werken met een tekstverwerker. Daar gaan we, met een lijstje van tien onderwerpen voor de boeg waarmee je weer een stap dichterbij de status webmaster komt. 20

3 1) - Verschillen in opmaak Voor vaker voorkomende onderdelen zoals titels, citaten, hele teksten en dergelijke wil je steeds een zelfde opmaak hanteren. vaste opmaakmogelijkheden Je ziet links bovenin het knopje nieuw dat je gebruikt hebt om een nieuwe, schone pagina te openen. Daaronder staat een venster dat je kunt uitklappen door middel van het pijltje aan de rechterkant. Dan zie je diverse mogelijkheden, Kop1, kop2, kop3, alinea, tekst en nog een paar. Selecteer maar eens een woord en kies dan in dit menu één voor één wat van de mogelijkheden. Je ziet dat er veel meer tekst verandert dan gewenst. Alleen als je tekst selecteert in dat keuzevenster heb je de mogelijkheid om met de andere gereedschappen per woord de opmaak te regelen. De andere keuzes zijn veelal voor hele regels oftewel titels en alinea s. Je moet hier maar gewoon wat mee experimenteren. Eigenlijk zijn het voorinstellingen. En als je een tekst opmaakt moet je voor vaste onderdelen ook vaste opmaak gebruiken. Daardoor blijft het voor de lezer rustig! 2) - De keuze van het lettertype Dat is iets waar veel beginnende webmasters de fout ingaan. Het is namelijk niet zo dat jij bepaalt welk lettertype de bezoeker van je website te zien krijgt. Dat wordt bepaalt door het aantal lettertypes dat op de PC van de bezoeker aanwezig is. Als jij een heel apart lettertype gebruikt dat bijna niemand heeft, zal de browser van de bezoeker dat vervangen door een type dat voorhanden is en er veel op lijkt. Om dat te voorkomen moet je eigenlijk een veelgebruikt en overal geaccepteerd lettertype gebruiken zoals Arial of Verdana. Die zijn rustig en heel geschikt voor beeldscherm. Er zijn wel middeltjes om een vreemd lettertype toch bij een bezoeker op het beeldscherm te krijgen, maar dat gaat voor hier wat ver. In het venster onder datgene wat we net gezien hebben staat waarschijnlijk variabele breedte, klik ernaast op het omlaaggerichte pijltje om alle mogelijkheden te kunnen zien. Daar verschijnen nu alle lettertypes die jij op jouw PC ter beschikking hebt. 21

4 3) - De lettergrootte als je tekst selecteert kun je hiermee het lettertype wijzigen Dat is precies zo in te stellen zoals jij wilt. Maar ook hier is de uiteindelijke vorm afhankelijk van bijvoorbeeld het beeldscherm en de gebruikte resolutie van de bezoeker. Zelfs de verschillende internet-browsers (de programma s die je gebruikt om te surfen zoals Explorer of Firefox) geven verschillende resultaten. Daarom is het ook hier verstandig om niet teveel van het gemiddelde af te wijken. Je begint weer met het selecteren van de gewenste tekst. met deze knopjes kun je het formaat van de letters trapsgewijs instellen Je ziet links bovenin het werkgebied van Kompozer naast die vensters een kleine en een grote A, één met een pijltje omlaag en de grootste met een pijltje omhoog. Je snapt het waarschijnlijk al. Met de kleine A maak je tekst kleiner, en met de grote A maak je hem groter. Speel hier maar eens mee, het zal je verder geen problemen opleveren. 22

5 4) - Het accent op tekstdelen leggen Het dik gedrukt en schuin gedrukt maken en onderstrepen van tekst is een vanzelfsprekend iets. Je begint zoals steeds weer met het selecteren van tekst, regel, alinea of zelfs één enkele letter. Hierna kies je in het vlakje naast die twee A s uit 3) de B voor dikgedrukt, de I voor schuingedrukt of de U voor onderstreept! Kan het nog eenvoudiger? En jij maar denken dat websites maken ingewikkeld is! 5) - Inspringen hier staan de drie mogelijkheden, vet, schuin en onderstreept bij elkaar Om een stuk tekst een aparte uitstraling te geven is het wel handig als je hem kunt laten inspringen ten opzichte van de andere tekst. Dat doen we met de twee icoontjes boven in het midden van Kompozer. Dat zijn er twee waarvan er één actief is bij de start, de linkse. Die heeft ook een klein groen pijltje dat naar rechts wijst. Als je een stuk tekst selecteert en je klikt hierop, dan zal dat stuk een beetje naar rechts verspringen. Met het knopje rechts ervan kunnen we weer terugspringen. 6) - Snel accentueren de twee icoontjes waarmee we tekst laten inspringen Om woorden overal op gelijke wijze te accentueren kun je natuurlijk gewoon zoals onder punt 4 besproken, met de opmaak aan de slag. Maar er zijn ook twee knopjes die dat automatisch op de meest gebruikte manier doen. Dat zijn die uitroeptekens. De enkele maakt een woord dat geselecteerd is dikgedrukt.en de dubbel maakt dik- en schuingedrukt! de snelknoppen om accenten te leggen 23

6 7) - Opsommingen Vaak wil je dingen opsommen, mooi onder elkaar met een bolletje ervoor een soort boodschappenlijstje. En ook daarvoor heeft Kompozer een tweetal knopjes. Eén voor een lijstje met bolletjes ervoor en één voor een lijstje met nummertjes. een overzichtelijk lijstje maken met bullets Vóór je een lijstje gaat maken klik je op zo n icoontje. Nu verschijnt er óf een bolletje óf je eerste nummer. Hierachter ga je schrijven. Als je een enter geeft ga je naar een nieuw onderdeel met dus een nieuw bolletje of een hoger cijfer. Als je twee keer een enter geeft ga je uit het lijstje, het laatste bolletje of cijfer kun je met backspace gewoon verwijderen. 8) - Links vanuit de tekst Nu komen we aan één van de belangrijkste onderwerpen die je waarschijnlijk veelvuldig gaat gebruiken: het maken van een link vanuit een woord of tekstdeel. Je weet wel wat ik bedoel, een stuk tekst dat zichtbaar een link naar een andere pagina of website is of naar een folder. Maakt niet uit wat voor link, je zult het snel beheersen. Allereerst moet je weer de tekst of het woord selecteren dat je wilt gebruiken voor de link die je wilt maken. Als dit deel blauw, dus geselecteerd is, klik je in de bovenste balk op koppeling, het icoontje is als een schakel uit een ketting, een link dus! het icoontje voor het maken van een link En wat zien we? Jazeker, ons bekende schermpje koppelingseigenschappen en daar gaan we exact bepalen welke link we maken en hoe we die gaan vertonen. Je ziet een lege regel, en daarin moet je de link schrijven. We zetten de belangrijkste voor je op een rij. Die hoef je niet te begrijpen, als je ze maar kunt nabootsen. Binnen je website navigeren is een interne link, daarvoor hoeven we geen gekke dingen te doen. Je vult gewoon de naam van een pagina in, zoals pagina-1.html, let wel: de.html hoort er achter te staan! Als je naar een andere website wilt, ga je naar buiten, dus extern. Je moet dan het volledige adres van die website in het venster invullen. Dat ziet er dan zo uit: Dus stel, je wilt een link naar Alphamega plaatsen, dan moet er staan: 24

7 Maar voor externe links speelt er nog iets, als ze open gaan verdringen ze jouw eigen website, die wordt afgesloten in het voordeel van de nieuwe website. Als je dat niet wilt, moet de link in een nieuw venster opengaan. Dan komen bezoekers weer terug op jouw site als ze die ene afsluiten. Hoe regelen we dat? Eenvoudig! Vink onder het venster van de koppelingslocatie (daar waar je het adres hebt ingevuld) Koppeling moet geopend worden aan. Je ziet een menuutje, klik op het pijltje aan de rechterkantkant en er komen meerdere keuzes. Klik hier op nieuw venster. hier selecteer je een nieuw venster De andere mogelijkheden moet je maar eens uitproberen, het wijst zich vanzelf. 9) - Tekst markeren Soms wil je een stuk tekst accentueren, benadrukken. Net als met zo n gele stift een streep er doorheen. Dat kan binnen je website ook. Selecteer maar een stuk tekst. Links van de A tjes voor de tekstgrootte staat een icoontje dat lijkt op een stift. Als je hierop klikt, kun je een kleur uitkiezen. Die wordt nu de achtergrond van het geselecteerde stuk tekst. Met het gereedschap links van dit stiftje kun je tekst kleuren of een hele alinea van een achtergrondkleur voorzien. Probeer het maar ns. markeren met een achtergrondkleur 25

8 10) - Tekst uitlijnen Van de belangrijkste mogelijkheden blijft er nu nog één over, de uitlijning van een hele lap tekst, links, rechts, uitvullen of centreren. Vier mogelijkheden die duidelijk afgebeeld bovenin als icoontje staan. Je ziet ze rechts naast de grote onderstreepte U (van onderstrepen) Selecteer een tekst, klik ze één voor één aan en je ziet wat er met de tekst gebeurt! Dit kun je gebruiken om bijvoorbeeld titels mooi te centreren, of kleine tekstdelen meer te laten opvallen. de mogelijkheden voor het uitlijnen van tekst Je hebt nu bijna alle gereedschappen gezien, in elk geval de belangrijkste. Met dit arsenaal kun je in ieder geval de tekstuele inhoud van je website naar je hand zetten. Met alle gereedschappen die je nu gezien hebt moet je maar eens naar eigen inzicht jouw drie pagina s gaan opmaken. In stap vier, die we nu gaan bekijken, komt het onderwerp aan bod dat een website net dat beetje extra geeft; afbeeldingen! We gaan je leren digitale foto s op maat te maken en in je website te plaatsen. Daarvoor hebben we nog een programma voor je beschikbaar. Ga snel naar stap 4, en je komt weer een stuk dichterbij de titel webmaster. Klik hier om Stap 4 te downloaden 26