Syllabus1

Een site bouwen met

FrontPage 2000 Basis Expert Syllabus: Hans De Four [email protected] www.klascement.net

Lesgevers: Gino Vanherweghe - Viviane Batens ICT-dag KlasCement Anytime Anywhere Learning 10 november 2003

Een site bouwen

DEEL 1

met

FrontPage 2000

Kennismaking

Hoofdstuk 1 FrontPage 2000 starten 1. Kies START - PROGRAMMA’S - MICROSOFT FRONTPAGE 2. Als gevraagd wordt of FrontPage de standaard webeditor moet worden, klik je op JA. 3. Dan wordt FrontPage 2000 met een leeg documentvenster geopend. Werkbalk STANDAARD

Werkbalk OPMAAK

Menubalk

Werkgebied in NORMALE PAGINAWEERGAVE

Weergaventabs

Weergavenbalk

Hoofdstuk 2 De interface 1. De menubalk BESTAND, BEWERKEN, BEELD, INVOEGEN, OPMAAK, EXTRA, TABEL, FRAMES, VENSTER, HELP.

2. De werkbalk Hier doorlopen we de knoppen op bovenstaande figuur van links naar rechts. Op de STANDAARD-werkbalk: - NIEUWE PAGINA / WEB / MAP / TAAK (CTRL+N) - PAGINA OPENEN / WEB OPENEN (CTRL+O) - PAGINA OPSLAAN (CTRL+S) - WEB PUBLICEREN (ALT+P) - MAPPENLIJST WEERGEVEN - PAGINA AFDRUKKEN (CTRL+P) - VOORBEELD IN BROWSER (CTRL+SHIFT+B) - SPELLINGSCONTROLE (F7) - KNIPPEN (CTRL+X) - KOPIËREN (CTRL+C) - PLAKKEN (CTRL+V) © Hans De Four 2000-2003

- OPMAAK KOPIËREN/PLAKKEN (CTRL+SHIFT+C) - ONGEDAAN MAKEN (CTRL+Z) - OPNIEUW - ONDERDEEL INVOEGEN - TABEL INVOEGEN - AFBEELDING INVOEGEN - HYPERLINK (CTRL+K) - VERNIEUWEN (F5) - STOPPEN MET LADEN VAN PAGINA - ALLES WEERGEVEN/VERBERGEN (CTRL+*) - HELP

2

Een site bouwen

met

FrontPage 2000

Op de OPMAAK-werkbalk - TEKSTSTIJL - LETTERTYPE - LETTERGROOTTE - VET (CTRL+B) - CURSIEF (CTRL+I) - ONDERLIJND (CTRL+U) - LINKS UITLIJNEN (CTRL+L) - CENTREREN (CTRL+E)

- RECHTS UITLIJNEN (CTRL+R) - NUMMERING - OPSOMMINGSTEKENS - INSPRINGING VERKLEINEN (CTRL+SHIFT+M) - INSPRINGING VERGROTEN (CTRL+M) - MARKEERSTIFTKLEUR - TEKSTKLEUR

3. Het werkgebied In het werkgebied zorg je voor de vorm en de inhoud van je homepage.

4. De statusbalk Op de statusbalk verneem je wat meer informatie over bepaalde opdrachten, wordt vermeld hoe lang het duurt om een pagina te laden en kan je zien welke actietoetsen vergrendeld zijn: CAP (Shift Lock), NUM (Num Lock).

Hoofdstuk 3 De interface aanpassen Je kan de werkbalk en werkbalkknoppen van FrontPage aanpassen naar eigen wensen. Standaard worden enkel de werkbalken STANDAARD en OPMAAK getoond. Wil je werkbalken bijplaatsen, dan kan dat door de gewenste werkbalk te selecteren uit de keuze die je krijgt via: o

een rechtsklik op de grijze achtergrond van de menu- of werkbalk

o

BEELD Æ WERKBALKEN

Om weinig gebruikte knoppen te verwijderen of om nieuwe knoppen toe te voegen kies je één van deze mogelijkheden: o

Rechtsklik op de grijze achtergrond van de menu- of werkbalk en kies AANPASSEN…

o

BEELD Æ WERKBALKEN Æ AANPASSEN

o

EXTRA Æ AANPASSEN

De steekkaart OPDRACHTEN van het dialoogvenster AANPASSEN verschijnt dan:

Duid de gewenste categorie aan en sleep de bij te plaatsen knop naar een van de werkbalken bovenaan. Een knop verwijderen kan je door de knop weg te slepen van de werkbalk. Via de steekkaart WERKBALKEN kan je werkbalken bijplaatsen of aanmaken.

© Hans De Four 2000-2003

3

Een site bouwen

met

FrontPage 2000

Via de steekkaart OPTIES kan je de werking en lay-out van de werkbalk naar eigen voorkeur instellen.

Hoofdstuk 4 FrontPage 2000 sluiten ¾

Kies één van deze mogelijkheden: o

Kies BESTAND Æ AFSLUITEN

o

Klik op het kruisje in de rechterbovenhoek van het FrontPage-venster.

Als er nog pagina’s geopend zijn die nog niet zijn opgeslagen, zal FrontPage vragen om die op te slaan. De volgende keer dat je FrontPage start, opent het programma in de weergave die je gebruikte toen je de laatste keer afsloot.

Hoofdstuk 5 Menu Venster Het menu VENSTER is vooral interessant als er meer dan één pagina geopend is. Je kan hiermee overschakelen van de ene pagina naar de andere. Of sneller: ¾

Overschakelen van de ene pagina naar de andere kan via CTRL+TAB.

Hoofdstuk 6 Menu Help Je kan een beroep doen op de ingebouwde helpfunctie. ¾

Contextgevoelige helpinformatie, d.i. uitleg over een bepaald onderdeel van je scherm, krijg via een klik op de knop HELP wenst.

¾

en daarna op het deel van je scherm waarover je uitleg

Algemene helpinformatie oproepen doe je via de sneltoets F1 of via HELP - MICROSOFT FRONTPAGE HELP.

Daarna krijg je een dialoogvenster met drie steekkaarten: CONTENTS, ANTWOORDWIZARD, INDEX. Het werken met dergelijke steekkaarten kennen we van bij Windows.

© Hans De Four 2000-2003

4

Een site bouwen

met

FrontPage 2000

Hoofdstuk 7 De zes weergaven De informatie in FrontPage kan worden weergegeven d.m.v. weergaven. Wisselen van weergave ¾

Kies één van deze mogelijkheden:

§1

o

Klik op de overeenkomstige knop in de weergavenbalk.

o

Kies BEELD Æ GEWENSTE WEERGAVE.

Paginaweergave

In deze weergave zal je het meest werken. Je gebruikt ze om de webpagina’s te bekijken en te wijzigen.

§2

Mappenweergave

Deze ziet eruit en werkt ongeveer als Windows Verkenner. Je gebruikt ze om de webpagina’s te beheren en te ordenen.

Mappenlijst

Inhoudvak

•

Klik op de naam van een map in de MAPPENLIJST om de inhoud van die map te zien in het INHOUDVAK.

•

Klik op de naam van een pagina of map en druk nadien op F2 om de naam van die pagina of map te wijzigen. Als je de naam van een pagina of map wil wijzigen, herziet FrontPage automatisch alle met die pagina of die map verbonden hyperlinks. Tenminste … als je in het dialoogvenster dat wordt getoond op JA klikt.

•

Rechtsklik op de naam van een map in de mappenlijst om een nieuwe pagina of een nieuwe map te maken in deze map.

•

Sleep een pagina vanuit het INHOUDVAK naar de gewenste map in de MAPPENLIJST om een pagina te verplaatsen. De links worden automatisch aangepast.

•

Om de bestanden in het INHOUDVAK te sorteren, klik je op de kolomtitel volgens dewelke je wil sorteren.

© Hans De Four 2000-2003

5

Een site bouwen

met

FrontPage 2000

Speciale mappen

§3

•

_private Wat zich hierin bevindt, wordt niet getoond door webbrowsers die de FrontPageserverextensies ondersteunen.

•

images Het is aan te raden om deze map te gebruiken om er alle afbeeldingen in te bewaren die je FrontPage-web bevat.

•

_borders Een map die erbij komt wanneer je gemeenschappelijke randen gebruikt.

•

_fpclass Een map die erbij komt wanneer je de FrontPage-onderdelen KNOP MET AANWIJSEFFECT of RECLAMEVAANDELBEHEER gebruikt.

•

_themes Een map die erbij komt wanneer je een FrontPage-thema toepast op (een deel van) je site.

Rapportweergave

Met de rapportweergave kan je belangrijke details over je website te weten komen. Deze weergave bevat 14 rapporten.

Maak gebruik van de werkbalk RAPPORTEN om te schakelen tussen de rapporten. Als deze werkbalk niet te zien is in de Rapportweergave, kies dan BEELD Æ WERKBALKEN Æ RAPPORTEN. Dubbelklik in een van de rapporten op een pagina om ze te openen. Site-samenvatting Hierin lees je hoeveel hyperlinks en afbeeldingen de website bevat, hoeveel pagina’s verbroken hyperlinks bevatten, … Alle bestanden Hierin krijg je een lijst van alle bestanden in je website. Laatst toegevoegde bestanden Hierin krijg je een lijst van de bestanden die recent aan de website werden toegevoegd. Recent wil zeggen: tijdens de afgelopen 30 dagen. Wil je dit aantal wijzigen, kies dan een ander tijdsinterval in de werkbalk RAPPORTEN of kies EXTRA Æ OPTIES Æ RAPPORTWEERGAVE en tik een nieuw getal in het vak RECENTE BESTANDEN ZIJN MINDER DAN … DAGEN OUD.

© Hans De Four 2000-2003

6

Een site bouwen

met

FrontPage 2000

Laatst gewijzigde bestanden Hierin krijg je een lijst van de bestanden die recent werden gewijzigd. Recent wil zeggen: tijdens de afgelopen 30 dagen. Wil je dit aantal wijzigen, kies dan een ander tijdsinterval in de werkbalk RAPPORTEN of kies EXTRA Æ OPTIES Æ RAPPORTWEERGAVE en tik een nieuw getal in het vak RECENTE BESTANDEN ZIJN MINDER DAN … DAGEN OUD.

Oudere bestanden Hierin krijg je een lijst van de bestanden die gedurende een hele tijd niet werden veranderd. Een hele tijd wil zeggen: tijdens de afgelopen 72 dagen. Wil je dit aantal wijzigen, kies dan een ander tijdsinterval in de werkbalk RAPPORTEN of kies EXTRA Æ OPTIES Æ RAPPORTWEERGAVE en tik een nieuw getal in het vak OUDERE BESTANDEN ZIJN MEER DAN … DAGEN OUD. Niet-gekoppelde bestanden Hierin krijg je een lijst van de bestanden die geen hyperlinks bevatten en niet bereikt kunnen worden m.b.v. hyperlinks op de openingspagina. Langzame pagina’s Hierin krijg je een lijst van de pagina’s waarvan het laden via een 28.8-modem naar schatting langer duurt dan 30 seconden. Wil je deze instellingen wijzigen, kies dan een nieuw tijdsinterval in de werkbalk RAPPORTEN of kies EXTRA Æ OPTIES Æ RAPPORTWEERGAVE en tik een nieuw getal in het vak DOWNLOADEN VAN LANGZAME PAGINA’S DUURT TEN MINST … SECONDEN. Kies daarna een VERBINDINGSSNELHEID. Verbroken hyperlinks Hierin krijg je een lijst van de hyperlinks die zijn VERBROKEN of nog niet gecontroleerd (ONBEKEND). Dit overzicht kan uiterst nuttig zijn om fouten uit webpagina’s te halen. Fouten van onderdelen FrontPage-onderdelen zijn dynamische programmaatjes (teller, zoekfunctie, …) die je in je website kan invoegen. Dit rapport geeft een lijst van de pagina’s met onderdelen die fouten bevatten. Revisiestatus – Toegewezen aan Deze rapporten geven weer wat de revisiestatus is van elke pagina en aan wie elke pagina werd toegewezen. Deze informatie kan worden gebruikt zodra je met een heel team aan een site werkt. Categorieën Je kan elke pagina toewijzen aan een bepaalde categorie. Hier krijg je een lijst van alle pagina’s en de categorieën waaraan ze zijn toegewezen. Publicatiestatus Dit rapport houdt bij wanneer pagina’s voor het laatst zijn gewijzigd en welke pagina’s klaar zijn voor publicatie.

© Hans De Four 2000-2003

7

Een site bouwen

met

FrontPage 2000

Uitcheckstatus Dit rapport staat ter beschikking als het versiebeheer is geactiveerd. (EXTRA Æ WEBINSTELLINGEN – Steekkaart ALGEMEEN – DOCUMENT INCHECKEN EN UITCHECKEN GEBRUIKEN) Dit is handig wanneer je met een team aan een site werkt. Elke medewerker moet dan een pagina waaraan hij wil werken eerst uitchecken. Zo kan er maar één auteur tegelijkertijd aan een webpagina werken. Het rapport geeft een overzicht van status, de naam van de auteur, …. Een groene stip staat naast de pagina’s die zijn ingecheckt en een rood vinkje naast de pagina’s die zijn uitgecheckt.

§4

Navigatieweergave

In deze weergave kan je de structuur van je site in beeld brengen.

Zo’n structuur maken is optioneel, tenzij je de navigatiebalken of paginavaandels wil gebruiken. Een navigatiebalk bestaat uit hyperlinks en maakt het voor bezoekers gemakkelijker om door de website te navigeren. Een paginavaandel verfraait je pagina met het label uit de navigatiestructuur. Om zo’n structuur te maken, denk je eerst na hoe je je website wil structureren. Daarna sleep je de pagina’s uit de mappenlijst naar het blauwe gedeelte rechts. Je begint met de openingspagina en koppelt er nadien de andere pagina’s aan. Terwijl je de pagina’s naar de goede plaats sleept, verschijnt een lijn die de pagina die je sleept verbindt met een van de pagina’s in de navigatiestructuur. Ga door totdat alle pagina’s die je in de structuur wil hebben, zijn toegevoegd. Dat hoeven niet alle pagina’s van je website te zijn. Veel hangt af van wat je later met deze structuur wil doen. De navigatiestructuur kan eenvoudig worden herschikt door de pictogrammen te verplaatsen via de sleepmethode. Wil je een pagina uit de structuur verwijderen, duid ze dan aan en druk op DELETE. Ze blijft wel bestaan in de website! Wanneer je een nieuwe pagina in de structuur maakt (onder een bestaande pagina), komt deze pagina maar in de website terecht wanneer je erop dubbelklikt. Je kan ze dan meteen aanvullen en opmaken. Met de Werkbalk NAVIGATIE kan je de weergave verkleinen of vergroten, de richting wijzigen, in- of uitzoomen, een externe koppeling leggen, pagina’s al dan niet opnemen in de navigatiebalk of alleen de substructuur weergeven. Als deze werkbalk niet te zien is in de Navigatieweergave, kies dan BEELD Æ WERKBALKEN Æ NAVIGATIE.

© Hans De Four 2000-2003

8

Een site bouwen

§5

met

FrontPage 2000

Hyperlinksweergave

In deze weergave kan je zicht krijgen op de interne koppelingen die gelegd werden tussen de verschillende pagina’s in je site en op de externe koppelingen. Door in de mappenlijst te klikken op een pagina zie je meteen welke pagina’s naar de gelecteerde pagina verwijzen (linkerdeel) en naar welke pagina’s de geselecteerde pagina verwijst (rechterdeel). Bij elke pagina staan specifieke pictogrammen die aangeven of je te maken hebt met een interne pagina, een externe pagina, een e-mailadres, een afbeelding, … Een verbroken link wordt weergegeven door een onderbroken grijze lijn, i.p.v. een blauwe lijn. Extra koppelingen kan je laten weergeven door te rechtsklikken op de gele achtergrond van de hyperlinksweergave.

§6

Takenweergave

Hier kan je bijhouden welke taken je nog moet uitvoeren. Handig om je site te beheren en up-to-date te houden. Zeker als je met een team aan de site werkt. Een nieuwe taak toevoegen kan via een rechtsklik in het TAKENOVERZICHT of via BESTAND Æ NIEUW Æ TAAK of door de te klikken op de knop TAAK TOEVOEGEN die je in heel wat dialoogvensters in FrontPage terugvindt. Geef de taak een naam, bepaal de prioriteit en omschrijf de taak. Wanneer je met een team werkt, kan je de taak toewijzen aan een van de medewerkers.

Een taak starten doe je door erop te dubbelklikken. Klik nadien op de knop TAAK STARTEN in het dialoogvenster dat dan verschijnt.

© Hans De Four 2000-2003

9

Een site bouwen

DEEL 2

met

FrontPage 2000

Paginabeheer

Hoofdstuk 1 Een nieuwe pagina Kies één van deze mogelijkheden: ¾

Knop NIEUWE PAGINA

¾

Sneltoets CTRL+N

Er wordt meteen een nieuwe, lege pagina geopend met een voorlopige naam nieuwe_pagina_nr.htm.

Hoofdstuk 2 Een pagina openen Kies één van deze mogelijkheden: ¾

BESTAND Æ OPENEN

¾

Klik op het pijltje naast de knop OPENEN en kies OPENEN

¾

Sneltoets CTRL+O

Dan krijg je dit dialoogvenster:

Doorblader de schijven en duid de te openen pagina aan. Klik nadien op OPENEN.

In een dialoogvenster navigeren door mappen en bestanden Gebruik het venster ZOEKEN IN

om andere mappen te selecteren.

Gebruik de knop BOVENLIGGENDE MAP Gebruik de knop NIEUWE MAP

om naar hogergelegen mappen te gaan.

om een nieuwe map te maken.

Dubbelklik op een bestaande map om die te openen. Dubbelklik op een bestand om het te openen. Een pagina openen van de lokale schijf of van het netwerk Door de schijven en mappen te doorbladeren, kan je pagina’s openen die zich bevinden in de huidige website of op je computer of netwerk. Een pagina openen van een webserver Maar met FrontPage is het ook mogelijk om een pagina te openen die op een webserver op het internet of op het intranet staat. Daartoe leg je eerst verbinding met de server, kies je BESTAND Æ OPENEN en in het vak BESTANDSNAAM vul je het internetadres van de pagina in (Vb.: http://home2.planetinternet.be/deinsbek). Klik nadien op OPENEN.

© Hans De Four 2000-2003

10

Een site bouwen

met

FrontPage 2000

Staat de pagina op een server die de FrontPage-extensies ondersteunt, dan moet je je gebruikersnaam en wachtwoord invoeren. Daarna wordt zowel de pagina als de website geopend. Zodra je de gemaakte wijzigingen opslaat, zijn die voor iedere bezoeker van je site zichtbaar. Staat de pagina niet op een server die de FrontPage-extensies ondersteunt, dan opent FrontPage een kopie van de pagina. Wil je de wijzigingen in deze kopie opslaan, dan moet je een plaats aanduiden op je eigen computer of netwerk.

Hoofdstuk 3 Een pagina opslaan Het verschil tussen OPSLAAN, OPSLAAN ALS en ALLES OPSLAAN OPSLAAN ALS gebruik je enkel wanneer: -

je een bestaand bestand op een andere plaats wil bewaren (bv. een bestand, geopend vanop de harde schijf, moet worden opgeslagen op diskette of in andere map op de harde schijf);

-

je een bestaand bestand een andere naam wil geven.

OPSLAAN gebruik je in alle andere gevallen. Met ALLES OPSLAAN worden alle geopende bestanden opgeslagen, alsof je voor elk bestand afzonderlijk OPSLAAN zou hebben gekozen. ~~~~~~~~~ Na de opdracht OPSLAAN ALS krijg je altijd een dialoogvenster waarin je het bestand een naam en een plaats kan geven. Na de opdracht OPSLAAN krijg je enkel datzelfde dialoogvenster als je een nieuw bestand aan het opslaan bent (een bestand dat nog geen naam of plaats had gekregen). In alle andere gevallen zal de opdracht OPSLAAN resulteren in een stilzwijgend bewaren van het bestaande bestand onder dezelfde naam op dezelfde plaats, zonder dialoogvenster! Je krijgt dit dialoogvenster bij OPSLAAN ALS of bij het OPSLAAN van een nieuw bestand:

1 Open hier de map

Geef je pagina hier een titel.

waarin de pagina moet worden opgeslagen.

2 Geef hier de naam van de pagina in.

De map kan worden geselecteerd door middel van om inhoud van de bovenliggende map te tonen

-

de knop BOVENLIGGENDE MAP

-

de knop NIEUWE MAP

-

dubbelklikken op een map om de inhoud van die map te tonen,

om een nieuwe map te maken

Naam Kies steeds een naam van maximaal acht kleine letters. De extensie .htm wordt automatisch toegevoegd. De openingspagina van de website en van elke map in je website moet index.htm heten. Deze pagina wordt standaard getoond, ook als de bezoeker de naam index.htm niet intikt in de URL. Op sommige webservers wordt een andere naam herkend (bv. default.htm).

© Hans De Four 2000-2003

11

Een site bouwen

met

FrontPage 2000

Titel Geef elke pagina in de site ook een passende titel. Deze titel wordt in de browser getoond in de titelbalk en moet de bezoeker een idee geven van het onderwerp van de pagina. De titel is ook van belang voor zoekrobotten. Deze robotten gebruiken de titel om een site te vinden en tonen deze titel ook in de lijst van gevonden sites. Tot slot wordt de titel eveneens gebruikt als naam voor de pagina wanneer een bezoeker deze pagina bij zijn favoriete sites bewaart. Je kan je pagina ook nog op andere manieren een titel geven: ¾

Via de NORMALE PAGINAWEERGAVE 1. Rechtsklik op de pagina-achtergrond en kies EIGENSCHAPPEN VAN PAGINA. 2. Kies in het dialoogvenster de steekkaart ALGEMEEN.

Tik hier de titel van de pagina in.

3. Klik na het intikken van de titel op OK. ¾

Via de MAPPENWEERGAVE 1. Selecteer de pagina. 2. Klik op de titel van de pagina.

Afbeeldingen Als je pagina afbeeldingen bevat, worden ze automatisch mee opgeslagen. Na het opslaan verschijnt het dialoogvenster INGESLOTEN BESTANDEN OPSLAAN.

Hierin kan je de naam van de afbeelding wijzigen, de map wijzigen of aanduiden wat er met de afbeelding moet gebeuren (Zie dialoogvenster ACTIE INSTELLEN). Bevestig door op OK te klikken. Niets dat eenvoudiger is. Automatisch wordt de HTML-code van de pagina zodanig aangepast het pad naar de afbeelding goed wordt weergegeven. Tip

Je kan altijd terugkeren naar de laatste opgeslagen versie van de pagina. Dit is vooral handig als je al heel wat wijzigingen hebt aangebracht, maar deze nog niet bewaard. Klik daartoe op de knop VERNIEUWEN op de werkbalk STANDAARD. Volgende verwittiging verschijnt dan:

© Hans De Four 2000-2003

12

Een site bouwen

met

FrontPage 2000

Hoofdstuk 4 Een pagina afdrukken Kies één van deze mogelijkheden: ¾

BESTAND Æ AFDRUKKEN

¾

Knop AFDRUKKEN

¾

Sneltoets CTRL+P Het dialoogvenster AFDRUKKEN verschijnt.

Hierin geef je aan of je de hele pagina wil afdrukken of niet, hoeveel afdrukken je wenst, welke kwaliteit die afdrukken moeten hebben (via EIGENSCHAPPEN), … Nadien klik je op OK. Alvorens af te drukken, kan je ook steeds een afdrukvoorbeeld bekijken via BESTAND Æ AFDRUKVOORBEELD.

Hoofdstuk 5 Een pagina sluiten Klik op de sluitknop van het documentvenster (meestal het onderste kruisje van de twee rechtsboven in je venster).

¾

Hoofdstuk 6 Een pagina verwijderen, verplaatsen, kopiëren Voor deze bewerkingen is de MAPPENWEERGAVE van FrontPage2000 heel handig. FrontPage zal er bv. voor zorgen dat in alle andere pagina's de links automatisch worden aangepast, wanneer je een pagina verplaatst. FrontPage zal je ook inlichten over de gebroken links, wanneer je een pagina verwijdert. Het verwijderen, verplaatsen en kopiëren van pagina’s gebeurt zoals in Windows: ¾

Selecteer het gewenste bestand.

¾

Klik op een van de knoppen op de werkbalk: of Gebruik het snelmenu door op het bestand te rechtsklikken:

¾

Kies KNIPPEN, KOPIËREN (of VERWIJDEREN).

¾

Open de plaats waar de te verplaatsen pagina of de kopie moet komen.

¾

Kies PLAKKEN.

Belangrijke opmerkingen

¾

Door een pagina te verwijderen kan je dode links krijgen! Verwijder een pagina dus enkel als er in andere pagina’s geen links (meer) zijn naar de te verwijderen pagina.

¾

Door een bestand te verplaatsen worden alle links naar deze pagina aangepast!

¾

Door een bestand te kopiëren worden geen links aangepast!

Hoofdstuk 7 Documenten converteren naar webpagina’s FrontPage kan onderstaande bestandsformaten converteren naar webpagina’s: •

Microsoft Word-documenten (.doc - Windows 2.x, 6.0, 97 t/m 2000 en Mac 4.0 t/m 5.1)

•

Microsoft Works 4.0-documenten (.wps)

•

WordPerfect 5.x en 6.X-documenten (.doc, .wpd)

•

Microsoft Excel- en Lotus 1-2-3-werkbladen (.xls, .xlw, .wkl, .wk3, .wk4)

•

Windows Write-bestanden (.wrl)

© Hans De Four 2000-2003

13

Een site bouwen •

RTF-documenten (.rtf)

•

Tekstdocumenten (.txt)

met

FrontPage 2000

De conversie lukt echter niet altijd even goed. Ze werkt goed voor tekstbestanden en eenvoudig opgemaakte tekstverwerkingsbestanden. ¾

Documenten converteren naar webpagina’s 1. Maak een nieuwe pagina 2. Kies INVOEGEN Æ BESTAND. Het dialoogvenster BESTAND SELECTEREN verschijnt.

2 Doorblader de schijven en duid de te converteren pagina aan. Klik nadien op OPENEN.

1

Duid eerst het bestandstype aan dat je wil laten converteren.

3.1 Als FrontPage het bestandstype herkent, converteert het de inhoud en plaatst die in de webpagina. 3.2 Als je een tekstbestand converteert, krijg je de keuze uit:

3.3 Als FrontPage niet meteen weet hoe verder te gaan, wordt dit dialoogvenster getoond:

Dit dialoogvenster verschijnt ook als FrontPage merkt dat het te converteren tekstdocument een HTML-bestand is. Door HTML aan te duiden, wordt de inhoud van het tekstdocument als HTML-code behandeld en worden de codes niet in de tekst van de webpagina weergegeven. Gebruikers van Office2000 kunnen documenten in Word, Excel en Powerpoint rechtstreeks opslaan als webpagina’s. Deze mogelijkheid is vaak beter dan het converteren in FrontPage. Toch voegt Office enorm veel onnodige HTML-tags in je webpagina wanneer je een document opslaat als webpagina. Wil je zo’n bestand openen in FrontPage, kies dan BESTAND Æ OPENEN (CTRL+O), selecteer het bestand via het dialoogvenster BESTAND OPENEN, klik op het pijltje naast de knop OPENEN en kies OPENEN IN MICROSOFT FRONTPAGE. Kies je OPENEN, dan zal het .htm-bestand worden geopend in de toepassing waarin het oorspronkelijk was opgeslagen als .htm.

Wanneer je in FrontPage een bestandstype tracht te converteren, kan het gebeuren dat je deze melding krijgt:

In dat geval zoek je best de Office2000 CD-ROM om deze ontbrekende functie te installeren.

© Hans De Four 2000-2003

14

Een site bouwen

met

FrontPage 2000

Hoofdstuk 8 Paginavoorbeeld FrontPage is een WYSIWYG-editor (What You See Is What You Get). Dat wil zeggen dat de pagina’s er tijdens het aanmaken al uitzien zoals ze er uiteindelijk op het web zullen uitzien. Toch raad ik je aan om een voorbeeld van je pagina’s te bekijken alvorens ze te publiceren. Zo’n voorbeeld geeft een veel nauwkeuriger voorstelling van hoe de webpagina er op het WWW zal uitzien. Een voorbeeld bekijken kan op twee manieren: 1. Weergaventab VOORBEELD Via deze weergaventab onderaan je werkgebied krijg je heel snel een indruk van hoe de pagina er op het internet zal uitzien. Daartoe wordt de versie van MS Internet Explorer gebruikt die op dat moment op jouw computer is geïnstalleerd. Voordelen: -

je hoeft geen ander programma op te starten

-

je hoeft de pagina niet op te slaan

2. Voorbeeld in browser Deze mogelijkheid is beter en betrouwbaarder. Hiermee bekijk je de pagina in een echte browser. Je kan zelfs kiezen welke browser en welke resolutie je wil gebruiken om het voorbeeld te bekijken. 1. Sla de te bekijken pagina('s) op! 2. Klik op de werkbalk STANDAARD op de knop VOORBEELD IN BROWSER

(CTRL+SHIFT+B).

3. De pagina wordt geopend in de browser die als standaard staat ingesteld in een resolutie die als standaard staat ingesteld. Nu kan je de pagina in de browser zien en kan je de links testen en de wijzigingen controleren. Wil je de standaardbrowser en standaardresolutie wijzigen, kies dan BESTAND Æ VOORBEELD IN BROWSER. Je krijgt dan dit dialoogvenster:

Kies nu de gewenste browser en resolutie en klik op VOORBEELD. Vanaf nu zal de pagina steeds in de hier geselecteerde browser en resolutie worden getoond tot wanneer je deze instellingen opnieuw verandert. Duid PAGINA AUTOMATISCH OPSLAAN aan als je wil dat de pagina elke keer automatisch worden opgeslagen als je de opdracht VOORBEELD IN BROWSER gebruikt. Gebruik ALT+TAB of de knoppen op de Windows-taakbalk om te schakelen tussen de geopende programma’s. Tip iv.m. resolutie

Bekijk je pagina ook geregeld in andere resoluties dan je standaardresolutie. Zeker wanneer je op een 17"-scherm werkt in een hoge resolutie, is het nuttig om de pagina af en toe eens in een resolutie van 800x600 te bekijken. De meeste surfers hebben momenteel immers een 14"-scherm met deze resolutie en ook zij moeten je pagina vlot kunnen lezen.

© Hans De Four 2000-2003

15

Een site bouwen

DEEL 3

met

FrontPage 2000

Webbeheer

Hoofdstuk 1 Een nieuw web Een web is een verzameling bestanden die is opgeslagen in een map op de harde schijf. Elke pagina is een bestand met tekst, illustraties andere elementen. De pagina’s in een web zijn meestal aan elkaar gekoppeld door hyperlinks en kunnen ook zijn gekoppeld aan andere websites. Wanneer je een web maakt in FrontPage, hoef je zelf geen HTML te gebruiken. De HTML-code wordt automatisch toegevoegd. Je hoeft alleen de inhoud van de pagina’s en de vormgeving en werking van elk item te bepalen. Nadat je een planning hebt gemaakt van je website, kan je ze maken met FrontPage 2000. Kies één van deze mogelijkheden: ¾

BESTAND Æ NIEUW Æ WEB

¾

Klik op het pijltje naast de knop NIEUWE PAGINA Het dialoogvenster NIEUW verschijnt nu.

en duid WEB aan.

Maak een keuze uit de WEBSITES die kunnen worden gemaakt: •

Web met één pagina Hiermee maak je een web aan dat al één lege pagina (de openingspagina index.htm) bevat.

•

Leeg web Hiermee kan je je website van het begin af aan zelf ontwerpen.

Sjablonen zijn een goede basis voor een website die je zelf kan aanpassen en waarop je kan voortbouwen. •

Klantenondersteuning Met dit web kan je als bedrijf productinformatie en richtlijnen aanbieden op internet. Klanten bezoeken de weblocatie als ze nieuwigheden over een product willen lezen, als ze vragen beantwoord willen hebben of als met andere gebruikers willen overleggen.

•

Persoonlijk web Hiermee maak je een pagina met persoonlijke info, een fotocollectie en een lijst met favoriete links.

•

Projectweb Deze sjabloon bezit een ledenlijst, een statusrapport, een planning, een archief, een zoeklijst en discussies. Ideaal voor een intranet (een intern netwerk van een bedrijf of school, enkel toegankelijk voor werknemers).

Wizards helpen je stap voor stap bij het maken van een website. Er wordt een reeks dialoogvensters getoond waarin je uit verschillende mogelijkheden kan kiezen. •

Wizard Bedrijsweb Deze wizard bouwt een professionele website op met grafische voorstellingen. Afhankelijk van de keuzes die je maakt, kan de website een productcatalogus, een discussieforum, … bevatten.

•

Wizard Discussieweb Hiermee maak je een interactieve website waar bezoekers opmerkingen kunnen plaatsen en antwoorden van anderen kunnen lezen over een bepaald onderwerp.

© Hans De Four 2000-2003

16

Een site bouwen

met

FrontPage 2000

Geef je web een eigen, unieke LOCATIE. Vb.: C:\MY DOCUMENTS\MIJN WEBS\SCHOOLWEB. Dan zullen alle onderdelen van het nieuwe web in de map SCHOOLWEB worden opgeslagen. Wanneer je hier een reeds bestaande map opgeeft, zal FrontPage vragen de map te converteren naar een FrontPage-web. Klik op JA. Klik op OK. Nu creëert FrontPage een nieuwe website. Als er al een andere website is geopend op het moment dat je de nieuwe aanmaakt, verschijnt de nieuwe website in een apart FrontPage-venster.

Hoofdstuk 2 Een bestaand web importeren Als je al een website op je harde schijf hebt staan en je wil die bewerken met FrontPage, dan moet je die eerst importeren. Dit kan via de wizard WEB IMPORTEREN. 1. Kies BESTAND Æ NIEUW Æ WEB. 2. Kies in het dialoogvenster NIEUW de wizard WEB IMPORTEREN. 3. Geef de plaats van het nieuwe web op. Vb.: C:\MY DOCUMENTS\MIJN WEBS\SCHOOLWEB. Dan zullen alle onderdelen van het nieuwe web in de map SCHOOLWEB worden opgeslagen. 4. Klik op OK. Na een tijdje verschijnt het linkse dialoogvenster (het rechtse verkrijg je door de eerste optie aan te duiden):

5. Hier geef je de plaats aan van de website die je wil importeren. De bestanden kunnen al gepubliceerd zijn op het web of opgeslagen zijn in een map op je computer. 6. Klik op VOLGENDE. Afhankelijk van de keuze verschijnt één van onderstaande dialoogvensters:

7. Wil je een website importeren die zich op het World Wide Web bevindt, dan kan je nu de hoeveelheid van de website die je wil downloaden en importeren in de hand houden. Wil je een website importeren die zich op je harde schijf bevindt, dan kan je nu bepaalde bestanden uitsluiten. 8. Klik op VOLGENDE. 9. Klik op VOLTOOIEN. De website wordt nu geïmporteerd.

© Hans De Four 2000-2003

17

Een site bouwen

met

FrontPage 2000

Hoofdstuk 3 Een web openen Kies één van deze mogelijkheden: ¾

BESTAND Æ WEB OPENEN

¾

Klik op het pijltje naast de knop OPENEN en kies WEB OPENEN. Dan krijg je dit dialoogvenster:

Merk op dat er nu geen bestanden worden getoond! ¾

Duid de map aan die het web bevat.

¾

Klik op OPENEN. Het web wordt nu geopend.

Hoofdstuk 4 Een web publiceren Opdat anderen uw website zouden kunnen bezoeken, moet je ze eerst publiceren. Daarvoor heb je het adres van de webserver nodig, een gebruikersnaam en een wachtwoord. Dit alles krijg je van een provider. Je kan publiceren volgens het Hypertext Transfer Protocol (http) of volgens het File Transfer Protocol (ftp). Om via http te publiceren moeten de FrontPage-serverextensies op de webserver van de provider zijn geïnstalleerd. Is dat niet zo, dan kan je de website enkel publiceren via ftp. FrontPage ondersteunt zowel het publiceren via http als via ftp. Een FTP-client (zoals WS_FTP of FTP-Voyager) laat alleen publiceren via ftp toe. 1. Kies één van deze mogelijkheden: •

BESTAND Æ WEB PUBLICEREN

•

Klik op de knop PUBLICEREN

Het dialoogvenster WEB PUBLICEREN verschijnt.

2. Tik in het vak WEB PUBLICEREN NAAR het ftp-adres of http-adres in. 3. Klik op de knop PUBLICEREN. Bij succes, krijg je dit dialoogvenster:

4. Tik je gebruikersNAAM en WACHTWOORD in en klik op OK.

© Hans De Four 2000-2003

18

Een site bouwen

met

FrontPage 2000

5. Bij goedkeuring, krijg je deze dialoogvensters:

Nu begint het publiceren. Wanneer je via http publiceert op een server die geen FrontPage-extensies ondersteunt, krijg je dit dialoogvenster. Probeer in dit geval te publiceren via ftp.

Een website openen Staat je website op een server die FrontPage-extensies ondersteunt, dan kan je die site rechtstreeks openen vanaf de server en zo ook rechtstreeks bewerken (terwijl je on line bent). 1. Leg verbinding met je provider. 2. Kies de opdracht WEB OPENEN in het menu BESTAND. 3. Tik in het vak MAPNAAM de URL van je website in en klik op OPENEN.

Na enige tijd wordt de website in FrontPage geopend. Wanneer je geen verbinding hebt met je provider, krijg je deze foutmelding:

Hoofdstuk 5 Een web verwijderen 1. Klik in de mappenlijst op de bovenste map van de weblocatie. 2. Druk op DELETE. Het dialoogvenster VERWIJDEREN BEVESTIGEN verschijnt. 3. Kies DIT WEB HELEMAAL VERWIJDEREN. 4. Klik op OK.

© Hans De Four 2000-2003

19

Een site bouwen

DEEL 4

met

FrontPage 2000

Tekstopmaak

Vanaf nu werken we vooral in de PAGINAWEERGAVE. We zullen er de pagina’s openen, bekijken, bewerken, links leggen, afbeeldingen plaatsen, onderdelen toevoegen, … Doordat FrontPage een WYSIWYG-editor is, is het aanmaken van webpagina’s heel eenvoudig. Je hoeft immers niets of weinig te kennen van de HTML-code. HTML staat voor Hypertext Markup Language, een reeks codes (tags genoemd) die de opmaak en structuur van een webpagina bepalen.

HTML-code

voor

deze pagina

Toch is het aan te raden om op de hoogte te blijven van HTML. Op die manier kan je – waar nodig – eigenhandig enkele wijzigingen aanbrengen in de code en kan je de laatste nieuwe snufjes gebruiken.

Hoofdstuk 1 Hulpmiddelen Bij het intikken van tekst en het toevoegen van andere onderdelen, heb je heel vaak andere hulpmiddelen nodig. Vele van die hulpmiddelen herken je zeker vanuit een ander Office-pakket. We overlopen even de mogelijkheden:

§1

Ongedaan maken / Opnieuw

FrontPage houdt de laatste dertig handelingen bij. Daardoor kan je haast elke ‘fout’ of elk ‘probeersel’ ongedaan maken. Ook indien je intussen zou opslaan, kan je nog terug. Bovendien kan je alles wat je ongedaan hebt gemaakt, opnieuw herstellen. ¾

¾

ONGEDAAN MAKEN kan volgens een van deze mogelijkheden: o

Klik op de knop ONGEDAAN MAKEN

o

Kies BEWERKEN Æ ONGEDAAN MAKEN

o

Sneltoets CTRL+Z

OPNIEUW kan volgens een van deze mogelijkheden: o

§2

Klik op de knop OPNIEUW

Knippen, kopiëren en plakken

Tekst, afbeeldingen, tabellen, … kan je steeds verplaatsen of kopiëren in pagina’s in FrontPage of in ander documenten in verschillende programma’s. Om te kopiëren: 1. Duid aan wat je wil kopiëren 2. Sneltoets CTRL+C / Knop KOPIËREN / Rechtsklikken en KOPIËREN / BEWERKEN Æ KOPIËREN 3. Ga naar de plaats waar de kopie moet komen. 4. Sneltoets CTRL+V / Knop PLAKKEN / Rechtsklikken en PLAKKEN / BEWERKEN Æ PLAKKEN

© Hans De Four 2000-2003

20

Een site bouwen

met

FrontPage 2000

Om te verplaatsen: 1. Duid aan wat je wil verplaatsen 2. Sneltoets CTRL+X / Knop KNIPPEN / Rechtsklikken en KNIPPEN / BEWERKEN Æ KNIPPEN 3. Ga naar de plaats waar je het object of de tekst wil plaatsen. 4. Sneltoets CTRL+V / Knop PLAKKEN / Rechtsklikken en PLAKKEN / BEWERKEN Æ PLAKKEN Je kan ook opmaak kopiëren. Dit is heel handig als je bepaalde delen in je tekst van dezelfde opmaak wil voorzien. 1. Selecteer de opmaak die wenst te kopiëren. 2. Klik op de knop OPMAAK KOPIËREN/PLAKKEN

(CTRL+SHIFT+C).

3. Sleep over de tekst die dezelfde opmaak moet krijgen. Wil je de opmaak toepassen op meer stukken tekst: 1. Selecteer de opmaak die wenst te kopiëren. 2. Dubbelklik op de knop OPMAAK KOPIËREN/PLAKKEN

.

3. Sleep over de stukken tekst die dezelfde opmaak moeten krijgen. 4. Klik op de knop OPMAAK KOPIËREN/PLAKKEN

§3

.

Slepen en neerzetten

Je kan een tekst, afbeelding, onderdeel of ander object steeds selecteren en nadien met de muis aanklikken en verslepen naar verschillende plaatsen in de pagina’s. M.b.v. slepen en neerzetten kan je ook: -

afbeeldingen invoegen Selecteer de naam van de afbeelding in de mappenlijst of in Windows Verkenner en sleep die naar je webpagina.

-

links leggen Selecteer de naam van een .htm-bestand in de mappenlijst of in Windows Verkenner en sleep die naar je webpagina.

-

bestanden invoegen en laten converteren Selecteer de naam van bv. een .doc- of .xls-bestand in de mappenlijst of in Windows Verkenner en sleep die naar je webpagina.

§4

Zoeken en vervangen

Je kan de plaats van een teken, woord of zinsnede steeds terugvinden en zelfs laten vervangen in één of meer webpagina’s. Zoeken ¾

Kies één van deze mogelijkheden: •

BEWERKEN Æ ZOEKEN

•

Sneltoets CTRL+F

Het dialoogvenster ZOEKEN verschijnt nu. Vervangen ¾

Kies één van deze mogelijkheden: •

BEWERKEN Æ VERVANGEN

•

Sneltoets CTRL+H

Het dialoogvenster VERVANGEN verschijnt nu.

© Hans De Four 2000-2003

21

Een site bouwen

met

FrontPage 2000

Je kan zoeken of vervangen naar tekst in de huidig geopende pagina of in alle pagina’s van het web. Door in de MAPPENWEERGAVE een aantal pagina’s te selecteren, kan je ook zoeken of vervangen in de geselecteerde pagina’s. Zodra je in meer dan één pagina zoekt, kan je zelfs zoeken in de HTML-code! Om de pagina te openen waarin de zoekterm gevonden is, dubbelklik je erop in de lijst onderaan het dialoogvenster. Dan kan je aanduiden of je de tekst wil laten vervangen. Na vervanging verandert de rode status in een gele bewerkte status. Je kan de zoek- of vervangopdracht ook (pagina per pagina) toevoegen aan de TAKENWEERGAVE.

§5

Synoniemenlijst en Spellingcontrole

De ingebouwde synoniemenlijst kan je gebruiken om je woordenschat te verrijken. De synoniemenlijst start je via: •

•

EXTRA Æ SYNONIEMENLIJST

SNELTOETS SHIFT+F7

Met de spellingcontrole kan je de tekst laten controleren terwijl je aan het typen bent. Door de controle te starten terwijl je in de PAGINAWEERGAVE zit, controleer je de spelling van de geopende pagina. Door de controle te starten terwijl je in de MAPPENWEERGAVE zit, kan je de spelling van de hele website controleren. De spellingcontrole start je via: •

EXTRA Æ SPELLING

•

Knop

•

Sneltoets F7

Hoofdstuk 2 Compatibiliteit Met de compatibiliteitsfuncties kan je bepalen welke geavanceerde mogelijkheden je al dan niet wil gebruiken. Als je er bv. wil voor zorgen dat je webpagina ook kan worden bezocht in een browserversie 3.0, kan je dat aanduiden. Alle nieuwe functies zullen dan niet toegankelijk via de opdrachten. Als je je webpagina bv. moet publiceren op een server die geen FrontPageserverextensies ondersteunt, kan je dat aanduiden. Alle opdrachten waarvoor deze extensies vereist zijn, zullen dan niet toegepast kunnen worden. Om ervoor te zorgen dat je hele website in FrontPage specifiek wordt ingesteld voor bepaalde browsers of servers, doorloop je volgende stappen: 1. Kies EXTRA Æ PAGINAOPTIES. 2. Kies de steekkaart COMPATIBILITEIT. 3. Kies in het vak BROWSERS de naam van de browser waarvoor je wil ontwerpen. 4. Kies in het vak BROWSERVERSIES de naam van de versie waarvoor je wil ontwerpen. 5. Kies in het vak SERVERS de naam van het serverprogramma dat wordt gebruikt door je provider. 6. Geef aan of de server de FrontPage-extensies ondersteunt. 7. Wil je een bepaalde TECHNOLOGIE in- of uitschakelen, dan kan dat door wel of geen vinkje te plaatsen in het betreffende vakje. 8. Klik op OK. Toch blijft het aan te raden om je website steeds te controleren in verschillende browsers en browserversies. Zelfs wanneer je website compatibel zou zijn met browserversies 4.0, zal je zeker nog verschillen merken tussen Netscape 4.0 en MS Internet Explorer 4.0.

© Hans De Four 2000-2003

22

Een site bouwen

met

FrontPage 2000

Hoofdstuk 3 Kleur en Paginaopmaak Je kan je site vrolijker en aantrekkelijker maken door kleuren te gebruiken. Maar overdrijf niet. Zorg ervoor dat de tekst duidelijk leesbaar blijft, gebruik rustgevende kleuren en goede contrasten. Kies voor elke rubriek in de site een andere kleur, zodat de bezoeker zich vlot weet te oriënteren. Pas de kleuren aan aan het onderwerp en aan het doelpubliek. Je kan elk paginaonderdeel van een kleur voorzien: achtergrond, tekst, links, tabellen, randen, … Meestal doe je dit door te rechtsklikken op zo'n onderdeel en dan de kleur te kiezen uit de keuzelijst.

§1

Kleuren kiezen In de keuzelijst krijg je de meest gebruikte kleuren te zien. Duid de gewenste kleur aan. Kies je MEER KLEUREN, dan krijg je het KLEURENPALET. Hierin kan je nog meer basiskleuren kiezen of je eigen kleurencombinatie samenstellen.

Ook via AANGEPAST kan je een kleur selecteren.

Duid hier de gewenste kleur aan

Hier zie je de gekozen kleur.

Na een klik op AANGEPAST krijg je het dialoogvenster KLEUR te zien: Ook hier kan je een kleur selecteren Duid hier de gewenste kleur aan

Door exact aan te geven hoeveel rood, groen en blauw je wil combineren in een kleur, kan je je kleur zelf samenstellen.

Hier zie je de gekozen kleur.

Tip

In het KLEURENPALET krijg je enkel de webveilige keuren aangeboden (deze kleuren worden op alle besturingssystemen en in alle browsers zo werkelijkheidsgetrouw mogelijk weergegeven). Via het dialoogvenster KLEUR kan je meer kleuren selecteren, maar die komen niet op elk computersysteem goed tot hun recht. Een kleur zelf samenstellen Een kleur voor een webpagina wordt weergegeven als een combinatie van drie basiskleuren: rood, groen en blauw. Per kleur kan je 256 waarden (0 t/m 255) kiezen en combineren. Enkele voorbeelden: Rood 255 0 255 0 0 255 255 © Hans De Four 2000-2003

Groen 255 0 0 255 0 255 0

Blauw 255 0 0 0 255 0 255

Geeft Wit Zwart Rood Groen Blauw Geel Paars

23

Een site bouwen

§2

met

FrontPage 2000

Kleur voor tekst op de hele pagina

Via de pagina-eigenschappen kan je de tekst op je homepage een tekstkleur geven. Deze kleur wordt toegepast op alle tekst op de volledige pagina. 1. Rechtsklik in je pagina en kies EIGENSCHAPPEN VAN PAGINA. OF Kies BESTAND Æ EIGENSCHAPPEN. 2. Kies de steekkaart ACHTERGROND.

3. Kies de gewenste tekstkleur uit de lijst TEKST. 4. Klik op OK.

§3

Kleur van stukken tekst

Via de werkbalk kan je bepaalde tekst (een titel, een zin, een woord, …) binnen de pagina toch nog laten opvallen in een andere kleur. 1. Klik op het pijltje naast de knop TEKSTKLEUR

op de werkbalk.

2. Duid de gewenste kleur aan. Opmerking

Het onderscheid tussen de twee manieren om kleur te geven aan tekst is belangrijk. Een basiskleur kies je via ACHTERGROND. Een deel van de tekst laat je opvallen via TEKSTKLEUR.

§4

Kleur van links

Hyperlink Een hyperlink heeft meestal een blauwe kleur. Een gekoppelde tekst wordt blauw onderlijnd. Een gekoppelde afbeelding wordt omkaderd met een blauwe rand. Bezochte hyperlink Een hyperlink die je in de voorbije dagen hebt aangeklikt, krijgt echter meestal een paarse kleur. Actieve hyperlink Een hyperlink krijgt ook een andere kleur terwijl je hem aanklikt, meestal rood. Deze kleuren kan je instellen via de pagina-eigenschappen.

© Hans De Four 2000-2003

24

Een site bouwen

met

FrontPage 2000

1. Rechtsklik in je pagina en kies EIGENSCHAPPEN VAN PAGINA. OF

Kies BESTAND Æ EIGENSCHAPPEN. 2. Kies de steekkaart ACHTERGROND.

Kies hier de gewenste kleuren.

3. Klik op OK. Opmerking

Blauw, paars en rood zijn de standaardkleuren en geven vele bezoekers van de site een houvast. Een gele link wordt vaak niet herkend. Verander deze kleuren dus niet te vaak.

§5

Kleur van achtergrond

Ook de achtergrond van je pagina kan je een kleur geven. 1. Rechtsklik in je pagina en kies EIGENSCHAPPEN VAN PAGINA. OF

Kies BESTAND Æ EIGENSCHAPPEN. 2. Kies de steekkaart ACHTERGROND.

Kies hier de gewenste kleur.

3. Klik op OK. Hou er rekening mee dat de tekst en de hyperlinks op deze pagina nog steeds leesbaar moeten kunnen blijven. Een achtergrond mag niet dezelfde kleur hebben als een van de tekst- of hyperlinkkleuren.

§6

Kleuren baseren op een andere pagina

Je kan de kleuren van tekst, hyperlinks en achtergrond laten baseren op de instellingen van een andere pagina in je website. Dan hoef je maar één pagina de juiste kleurinstellingen te geven. De gekozen instellingen zullen meteen van kracht zijn op alle andere pagina’s die deze instellingen gebruiken. © Hans De Four 2000-2003

25

Een site bouwen ¾

met

FrontPage 2000

Kleuren baseren op een andere pagina 1. Rechtsklik in je pagina en kies EIGENSCHAPPEN VAN PAGINA. OF

Kies BESTAND Æ EIGENSCHAPPEN. 2. Kies de steekkaart ACHTERGROND.

Duid dit vakje aan.

Klik op BLADEREN.

3. Doorblader het HUIDIG WEB en duid de pagina aan waarvan de kleurinstellingen mogen worden overgenomen. Klik op OK.

4. Klik op OK in het dialoogvenster EIGENSCHAPPEN VAN PAGINA.

Hoofdstuk 4 Opmaak van alinea Zodra je op ENTER drukt, begin je een nieuwe alinea!! Wil je in dezelfde alinea toch naar een nieuwe regel, gebruik dan SHIFT+ENTER.

§1

Opmaakprofiel Je kan opmaakprofielen gebruiken om belangrijke delen op de pagina te accentueren of om titels aan te duiden. Een opmaakprofiel kies je uit de lijst OPMAAKPROFIEL op de werkbalk OPMAAK. ¾

Ga in de alinea staan die een bepaald opmaakprofiel moet krijgen

¾

Kies het gewenste profiel uit de lijst.

NORMAAL is de standaardopmaak voor alinea’s (meestal Times). OPGEMAAKT geeft alinea’s weer in een niet-proportioneel lettertype (meestal Courier). ADRES (overbodige functie) geeft alinea’s cursief weer, wat nu veel sneller kan via CTRL+I. KOP1 (groot) tot KOP6 (klein) zijn 6 niveaus waarin je bepaalde tekst kan weergeven. Kop1 wordt vaak gebruikt voor titels. De kleinere koppen worden gebruikt voor subtitels en verdelen de pagina daardoor in overzichtelijke delen. LIJSTEN groeperen stukken tekst m.b.v. opsommingstekens, getallen of andere tekstopmaak. © Hans De Four 2000-2003

26

Een site bouwen

§2

met

FrontPage 2000

Lijsten

Bij een opsomming van rubrieken is het fraai iedere rubriek (alinea) te laten beginnen met een nummer of met een speciaal teken zoals y, {,   (Eng. bullets). In de afbeeldingen hieronder zie je een voorbeeld van zo'n genummerde lijst of opsomming (links) en een niet-genummerde lijst (rechts).

Een genummerde lijst maken 1. Klik op de knop NUMMERING . Het nummer 1. verschijnt dan op je scherm. 2. Tik de tekst in bij dit nummer. 3. Druk op ENTER. Automatisch verschijnt het nummer 2. 4. Doe zo voort tot het laatste nummer. 5. Om de lijst te stoppen, druk je tweemaal op ENTER of klik je op de knop NUMMERING

.

Is de tekst bij een bepaald nummer langer dan een regel, dan springt de tekst automatisch naar de volgende regel (Automatische regelovergang). Wil je echter vervroegd een nieuwe regel beginnen, zonder een nieuw nummer te beginnen (zoals bij het eerste en het derde pijltje hierboven), druk dan op SHIFT+ENTER (Normaal regeleinde). Een niet-genummerde lijst maken Dit doe je op dezelfde manier als bij een genummerde lijst, behalve dat je nu op de knop OPSOMMINGSTEKENS klikt. Alinea’s in lijsten omzetten Bestaande alinea’s omzetten in lijsten doe je door die alinea’s te selecteren en dan te klikken of op . op Een geneste lijst maken ¾ Begin de hoofdlijst met een klik op

of op

.

¾ Zodra je een niveau wil inspringen, klik je tweemaal op de knop INSPRINGING VERGROTEN . Nu begin je een sublijst. ¾ Door op ENTER te drukken, blijf je deze sublijst aanvullen op het huidige niveau. ¾ Wil je nog een niveau inspringen, dan klik je opnieuw tweemaal op

.

¾ Zodra je terug wil naar het vorige niveau, klik je tweemaal op de knop INSPRINGING VERMINDEREN . ¾ De lijst kan je beëindigen door terug te keren naar het eerste niveau en te klikken of tweemaal op ENTER te drukken. dan eenmaal op

© Hans De Four 2000-2003

27

Een site bouwen

met

FrontPage 2000

Eigenschappen van lijst Je kan de eigenschappen van de lijst bewerken door te rechtsklikken ter hoogte van de lijst en te kiezen voor EIGENSCHAPPEN VAN LIJST. Je krijgt dan één van onderstaande steekkaarten te zien:

Via de steekkaart FIGUUR ALS OPSOMMINGSTEKEN kan je i.p.v. de saaie bolletjes of nummering een eigen figuur kiezen als opsommingsteken. Via beide andere steekkaarten kan je de standaardinstellingen aanpassen of de nummering bij een bepaald nummer laten starten. Via de opdracht SAMENVOUWBARE OVERZICHTEN INSCHAKELEN kan je ervoor zorgen dat de subitems van een ingesprongen sublijst pas worden getoond nadat er op het bijbehorend hoofditem in de hoofdlijst wordt geklikt. Dit werkt echter alleen vanaf MS Internet Explorer 4.0. !NIEUW! Definitielijst Een definitielijst is een lijst waarbij je een reeks termen vermeldt met bijkomende uitleg. De termen staan netjes opgesomd en de bijbehorende uitleg staat telkens wat ingesprongen op de regel eronder. (Zoals hier dus.) 1. Plaats de cursor waar je de definitielijst wil beginnen. 2. Kies GEDEFINIEERDE TERM in de keuzelijst OPMAAKPROFIEL in de werkbalk OPMAAK. 3. Tik de eerste term in. 4. Druk op ENTER. Een nieuwe regel begint wat ingesprongen. 5. Tik de definitie behorende bij de term in. 6. Druk op ENTER. 7. Doe zo voort tot het laatste nummer. 8. Om de lijst te stoppen, druk je tweemaal op ENTER.

§3

Inspringing en uitlijning

Inspringing -

Wil je een alinea een of meerdere niveaus laten inspringen, plaats de cursor dan in die alinea en klik op de knop INSPRINGING VERGROTEN (CTRL+M).

-

Wil je een niveau terug, klik dan op de knop INSPRINGING VERMINDEREN (CTRL+SHIFT+M).

Je kan de inspringing aanduiden net voor het intikken van de alinea, maar ook door de cursor in een bestaande alinea te plaatsen en dan pas op de knoppen te klikken.

© Hans De Four 2000-2003

28

Een site bouwen

met

FrontPage 2000

Uitlijning Wil je een alinea uitlijnen, plaats de cursor dan in die alinea en klik op één van de knoppen: -

LINKS UITLIJNEN

-

CENTREREN

-

RECHTS UITLIJNEN

Normaal wordt een alinea links uitgelijnd. Meer mogelijkheden ¾

Rechtsklik ter hoogte van een (selectie van) alinea(‘s)

¾

Kies ALINEA. Het dialoogvenster ALINEA verschijnt dan.

Hierin kan je aangeven welke uitlijning je wenst. In de sectie INSPRINGEN geef je aan hoeveel pixels de alinea moet inspringen. Met het vak VOOR TEKST regel je de inspringing aan de linkermarge. Met het vak NA TEKST regel je de inspringing aan de rechtermarge. In de sectie AFSTAND geef je aan hoeveel pixels er tussen alinea’s, regels en woorden vrij moeten blijven. Met het vak VOOR regel je de witruimte boven een alinea. Met het vak NA regel je de witruimte onder een alinea. Met het vak REGELAFSTAND regel je de witruimte tussen de tekstregels in een alinea. Met het vak WOORD regel je de witruimte tussen de woorden in een alinea.

§4

Randen en arcering

!Cascading Style Sheets!

Je kan een alinea een rand of een achtergrond geven. 1. Klik ergens in de alinea (of selecteer verschillende alinea’s). 2. Kies OPMAAK Æ RANDEN EN ARCERING. Het dialoogvenster RANDEN EN ARCERING verschijnt. 3. In de steekkaart RANDEN bepaal je: a. De INSTELLING van de rand b. Het OPMAAKPROFIEL c.

De KLEUR van de rand

d. De BREEDTE van de rand e. Welke randen je wil laten weergeven f.

Hoeveel pixels er tussen de tekst van de alinea(‘s) en de rand vrij moeten blijven

© Hans De Four 2000-2003

29

Een site bouwen

met

FrontPage 2000

4. In de steekkaart ARCERING bepaal je: a. De ACHTERGRONDKLEUR van de alinea b. De VOORGRONDKLEUR van de alinea (dit is de TEKSTKLEUR) c.

Een ACHTERGRONDFIGUUR voor de alinea

d. De herhaling van de achtergrondfiguur STANDAARD: Afbeelding herhaalt zich voortdurend over de hele alinea HERHALEN-X: Afbeelding wordt enkel horizontaal herhaald (één rij) HERHALEN-Y: Afbeelding wordt enkel verticaal herhaald (één kolom) NIET HERHALEN: Afbeelding wordt maar één keer geplaatst e. De VERTICALE POSITIE en HORIZONTALE POSITIE van de achtergrondfiguur f.

Of de afbeelding moet meebewegen met de pagina (DOORLOPEND) of niet (VAST). Dit doe je via BIJLAGE.

5. Klik op OK. Opmerking: Cascading Style Sheets. De mogelijkheden die je krijgt in het dialoogvenster RANDEN EN ARCERING werken alleen met CSS. Dit zijn opmaakmodellen en worden niet door alle browsers ondersteund. Browsers die ze wel ondersteunen, doen dat niet consequent. Bekijk je pagina dus minstens in enkele browsers als je CSS gebruikt!

Hoofdstuk 5 Opmaak van tekst Tekstopmaak kan je op twee manieren toewijzen: vóór of nà de invoer. De tekstopmaak vóór de invoer instellen 1. Zet de cursor op de plaats vanaf waar de nieuwe tekenopmaak van toepassing is. 2. Zet de gewenste tekenopmaak aan. 3. Voer de tekens in. Deze krijgen de ingestelde tekenopmaak. 4. Zet de tekstopmaak nadien weer uit. De tekstopmaak nà de invoer instellen 1. Selecteer de letter, het woord, … als tekstblok. 2. Activeer de gewenste tekenopmaak. Tekstopmaak kiezen (ALGEMENE METHODE) 1.

Bepaal waar het kenmerk moet komen.

2.

Kies LETTERTYPE in het menu OPMAAK. Het dialoogvenster LETTERTYPE wordt nu weergegeven.

© Hans De Four 2000-2003

30

Een site bouwen

met

FrontPage 2000

3.

Klik in het dialoogvenster de gewenste opties aan.

4.

Klik OK.

De meeste opmaakkenmerken kan je echter veel sneller kiezen m.b.v. de werkbalk of met sneltoetsen. Zo’n knop of sneltoets kan je zowel gebruiken om de opmaak te activeren of te inactiveren. Voorbeeld

… gewone tekst [CTRL+B] vette tekst [CTRL+B] gewone tekst … Je kan meer dan één opmaakkenmerk toepassen op een stuk tekst. Voorbeeld

VET,

CURSIEF EN

KLEIN

KAPITAAL

Tekstopmaak kopiëren Je kan tekstopmaak ook kopiëren. Dit is heel handig als je bepaalde delen in je tekst van dezelfde opmaak wil voorzien. 1. Selecteer de opmaak die wenst te kopiëren. 2. Klik op de knop OPMAAK KOPIËREN/PLAKKEN

(CTRL+SHIFT+C).

3. Sleep over de tekst die dezelfde opmaak moet krijgen. Wil je de opmaak toepassen op meer stukken tekst: 1. Selecteer de opmaak die wenst te kopiëren. 2. Dubbelklik op de knop OPMAAK KOPIËREN/PLAKKEN

.

3. Sleep over de stukken tekst die dezelfde opmaak moeten krijgen. 4. Klik op de knop OPMAAK KOPIËREN/PLAKKEN

.

Alle tekstopmaak verwijderen Sneltoets CTRL+Spatiebalk.

© Hans De Four 2000-2003

31

Een site bouwen

§1

met

FrontPage 2000

Lettertype

Men kan de lettertypes indelen op grond van een aantal kenmerken: -

proportionele Voorbeeld

: de tekens inclusief witruimte nemen geen vaste breedte in. In Times New Roman neemt i minder plaats in dan m.

-

niet-proportionele Voorbeeld

: ieder teken inclusief witruimte neemt dezelfde breedte in. Courier

-

geschreefde Voorbeeld

: de tekens hebben kleine dwarsstreepjes op de uiteinden. Times New Roman, Courier

-

schreefloze Voorbeeld

: de tekens hebben geen kleine dwarsstreepjes op de uiteinden. Arial

Over het algemeen wordt in een webpagina enkel gewerkt met de lettertypes -

Arial

(proportioneel schreefloos)

-

Times New Roman

(proportioneel geschreefd)

-

Courier

(niet-proportioneel geschreefd)

Wil je toch een ander lettertype gebruiken, hou er dan rekening mee dat de bezoeker van jouw site dat lettertype enkel zal zien als het op zijn PC is geïnstalleerd. Is dat niet zo, dan krijgt hij jouw site te zien in het standaardlettertype van de browser. De browser bepaalt dus heel vaak het lettertype! Een lettertype kiezen 1. Selecteer of zet de cursor op de juiste plaats. 2. Klik op het pijltje van de keuzelijst op de werkbalk Kies OPMAAK Æ LETTERTYPE.

OF

3. Kies het gewenste lettertype Via de steekkaart STANDAARDLETTERTYPE in EXTRA Æ PAGINAOPTIES kan je instellen welke lettertypes FrontPage standaard moet gebruiken.

§2

Lettergrootte

De lettergrootte drukt men meestal uit in typografische punten (PT). Eén punt is 0,35 mm. Voorbeeld

Deze tekst is afgedrukt met Arial 10 punt. De lettergrootte van de tekst in je webpagina kan je met verschillende methodes beïnvloeden, maar niet met de vertrouwde keuzelijst met puntgroottes die je vaak bij tekstverwerkers ziet. Waarom niet? Omdat je voor het web publiceert en dus voor een scherm dat bij elke gebruiker een andere grootte (resolutie) kan hebben, waardoor je de lettergrootte toch niet exact kan vastleggen.

© Hans De Four 2000-2003

32

Een site bouwen

met

FrontPage 2000

Welke methodes kan je dan wel gebruiken? Via de werkbalk OPMAAK: 1. Je kan kiezen voor opmaakprofielen NORMAAL, KOP1 (grootst), KOP2 (groot), … KOP6 (kleinst). Het profiel NORMAAL is het standaardprofiel. De profielen KOP1 t/m KOP6 worden vaak gebruikt voor titels en subtitels.

2. Je kan de lettergrootte ook wijzigen door een niveau van 1 (klein) tot 7(groot) te kiezen. Deze niveaus komen respectievelijk overeen met de puntgroottes 8, 10, 12, 14, 18, 24 en 36.

Het grootste lettertype kan je verkrijgen door te kiezen voor KOP1, gecombineerd met GROOTTE 7. Wil je toch een nóg groter lettertype, dan moet je dit lettertype invoegen als een afbeelding (en dus overweg kunnen met grafische editors zoals Paint Shop Pro, CorelDraw, Adobe PhotoShop of PhotoDraw). Let dan wel op met de bestandsgrootte!

§3

Letterstijl

De term letterstijl is een verzamelnaam voor allerlei kenmerken van een teken. De meest bekende zijn: - de aanslag

: normaal, vet.

- de stijl

: recht (romein), cursief (Eng. italic), onderstreept.

Een letterstijl kiezen 1. Selecteer of zet de cursor op de juiste plaats. 2. Kies één van de volgende werkbalkknoppen of sneltoetsen: Functie





Tekst vet maken

CTRL + B

Tekst cursief maken

CTRL + I

Tekst onderstrepen

CTRL + U

OF Kies OPMAAK Æ LETTERTYPE en duid een van de vele andere mogelijkheden aan.

Opmerking: Cascading Style Sheets De effecten LIJN BOVEN, KLEIN KAPITAAL, HOOFDLETTERS en BEGINHOOFDLETTERS werken alleen met CSS en werken dus niet in alle browsers. Ook het effect DOORHALEN is een nieuwe toevoeging aan HTML en zal dus niet in elke browser werken.

© Hans De Four 2000-2003

33

Een site bouwen

§4

met

FrontPage 2000

Tekstpositie De term tekstpositie geeft de plaats van een teken aan t.o.v. de basislijn van een regel.

Standaard :

De tekens bevinden zich op de basislijn van de regel.

Superscript :

De tekens worden iets hoger dan de basislijn afgedrukt. Voorbeeld: Exponenten (3x4+2x2-1=0).

Subscript

De tekens worden iets lager dan de basislijn afgedrukt. Voorbeeld: Indexen (H2S04, x1+x2=3).

:

De tekstpositie kiezen 1. Selecteer of zet de cursor op de juiste plaats. 2. Kies één van de volgende sneltoetsen: Functie

Sneltoets

Tekst in superscript

CTRL + = of CTRL + +

Tekst in subscript

CTRL + -

OF ¾

§5

Kies OPMAAK Æ LETTERTYPE.

Tekstkleur

Tot slot kan je ook nog de kleur waarin de tekst wordt weergegeven bepalen. Dit kan op twee manieren die je heel goed moet onderscheiden. Met de ene manier kies je de basistekstkleur van de volledige pagina, met de andere manier kan je één enkel woord laten opvallen door het een andere kleur te geven. We hebben dit al besproken in Hoofdstuk 3: Kleur en Paginaopmaak. Opmerking

Je moet ervoor zorgen dat je pagina aangenaam om lezen is. Overdrijf dus niet met het door elkaar gebruiken van verschillende lettertypes, lettergrootten en kleuren. Wees zuinig met vet, cursief, onderstreept en andere effecten. De bezoeker moet de informatie die je biedt immers nog willen lezen. Voorzie in voldoende witruimte en maak je pagina's niet al te lang. Wees consequent in je opmaak en streef harmonie na in je hele website.

© Hans De Four 2000-2003

34

Een site bouwen

met

FrontPage 2000

Hoofdstuk 6 Extra’s §1

Lijnen

Binnen één pagina kan het nuttig zijn om bepaalde onderdelen visueel van elkaar te scheiden met een horizontale lijn. Dit bevordert heel vaak het overzicht. Er bestaan twee soorten horizontale lijnen: -

horizontale lijnen die geen afbeeldingen zijn. Deze komen aan bod in deze paragraaf. Voorbeelden

-

horizontale lijnen die afbeeldingen zijn. Deze komen aan bod in Deel 6: Afbeeldingen. Voorbeelden

1. Lijn invoegen ¾

Kies INVOEGEN Æ HORIZONTALE LIJN. De lijn wordt meteen over de hele lengte ingevoegd. Voor en na de lijn wordt witruimte gelaten.

2. Lijn verwijderen ¾

Selecteer de lijn en druk op DELETE.

3. Lijneigenschappen Je kan de breedte, lengte en kleur van zo'n lijn wijzigen. ¾

Dubbelklik op de lijn. Je krijgt dit dialoogvenster te zien:

Hierin kan je de BREEDTE in stellen in percent of in pixels. PERCENT

Zo laat je de lijnlengte bepalen door de schermbreedte. 100% geeft een lijn over de hele breedte van het scherm, 50% geeft een lijn die de helft zo breed is als het scherm.

PIXELS

Hiermee bepaal je de lengte van de lijn exact, ongeacht de schermbreedte. Je stelt de lengte best niet groter in dan 600 pixels, aangezien vele 14"-schermen slechts een breedte van 640 pixels hebben.

Je kan ook de HOOGTE (dikte), de UITLIJNING (links, midden, rechts) en de KLEUR van de lijn bepalen. Door het vak VASTE LIJN aan te kruisen, geef je de lijn geen schaduw. © Hans De Four 2000-2003

35

Een site bouwen

§2

met

FrontPage 2000

Symbolen

Sommige tekens vind je niet terug op je toetsenbord. Voorbeeld

ß ¾ ® Symbolen invoegen 1. Kies INVOEGEN Æ SYMBOOL. Het dialoogvenster SYMBOOL wordt nu weergegeven.

2. Klik op het symbool dat je wil invoegen. 3. Klik op INVOEGEN om het symbool in te voegen. 4. Herhaal stap 2 en 3 zolang je een van deze symbolen wil invoegen. 5. Klik op SLUITEN.

§3

Opmerkingen

Dit is een zeer handige optie om geheugensteuntjes en verklarende tekst (voor jezelf of andere medewerkers) toe te voegen aan een webpagina. De opmerkingen worden enkel getoond in FrontPage, niet in de browser (behalve in de onderliggende HTML-code). Opmerking invoegen 1. Kies INVOEGEN Æ OPMERKING. Het dialoogvenster Opmerking wordt nu weergegeven.

2. Tik je opmerking in. 3. Klik op OK. De opmerking verschijnt in je webpagina als gekleurde tekst. Opmerking bewerken ¾

Dubbelklik op de opmerking.

Opmerking verwijderen 1. Klik op de opmerking. 2. Druk op DELETE.

© Hans De Four 2000-2003

36

Een site bouwen

DEEL 5

met

FrontPage 2000

Hyperlinks

Zonder hyperlinks geen wereldwijd web. De hyperlinks zorgen ervoor dat je via een klik erop van de enige naar de andere pagina gestuurd wordt, van de ene naar de andere website, van de ene naar de andere server. Je hebt vijf soorten hyperlinks: •

hyperlinks naar een pagina binnen je eigen site (Interne hyperlinks - §1)

•

hyperlinks naar externe pagina’s (Externe hyperlinks - §2)

•

hyperlinks naar een plaats op dezelfde pagina (Bladwijzers - §3)

•

hyperlinks naar een e-mailadres (§4)

•

hyperlinks naar een bestand (§5)

Elk van deze links zijn in de browser te herkennen aan een handje als je de muis over de link beweegt. De link kan zowel een tekst als een afbeelding zijn. Een hyperlink leggen – Snelle methode Als je tussen de tekst op je pagina een URL of e-mailadres intikt en daarna op de spatiebalk of op ENTER drukt, wijzigt FrontPage de link meteen in een hyperlink naar dat internet- of e-mailadres. Een hyperlink wijzigen 1. Klik op de hyperlink die je wil wijzigen. (CTRL+K). 2. Klik op de knop HYPERLINK Dan verschijnt het dialoogvenster HYPERLINK BEWERKEN. 3. Breng de wijzigingen aan in het vak URL:. 4. Klik op OK. Hyperlinktekst wijzigen 1. Selecteer de hyperlinktekst die je wil wijzigen 2. Tik de nieuwe tekst in. De onderliggende hyperlink blijft ongewijzigd. Een hyperlink testen Over het algemeen zal je de hyperlinks testen in je browser, in de VOORBEELDWEERGAVE of via de RAPPORTWEERGAVE, maar je kan een hyperlink ook testen in de NORMALE WEERGAVE van FrontPage. Dit is trouwens ook een zeer handige manier om pagina’s te openen. 1. Beweeg de muisaanwijzer over een hyperlink. 2. Hou CTRL ingedrukt. 3. Klik op de link. De gekoppelde pagina wordt nu geopend in de NORMALE WEERGAVE.

© Hans De Four 2000-2003

37

Een site bouwen

met

FrontPage 2000

Hoofdstuk 1 Interne hyperlinks Een interne hyperlink leggen 1. Selecteer de tekst of de afbeelding die een link moet worden. 2. Klik op de knop HYPERLINK (CTRL+K). Dan verschijnt het dialoogvenster HYPERLINK MAKEN.

Duid in dit venster de pagina aan waarnaar de link gelegd moet worden.

Of tik hier de naam van de pagina in.

De pagina’s die geopend zijn worden weergegeven met een pictogram met een potloodje. 3. Klik op OK. Is de hyperlink een tekst, dan wordt die nu onderstreept en gekleurd. Is de hyperlink een afbeelding (grafische hyperlink), dan verandert er weinig. Je kan merken dat een tekst of afbeelding ook een hyperlink is door er met de muis over te bewegen. Het doel wordt vermeld op de statusbalk. Een grafische hyperlink kan je laten opvallen door een rand te plaatsen rond de afbeelding. Tip

Een hyperlink maken kan ook door een pagina uit de MAPPENLIJST te slepen naar de pagina. Een interne hyperlink leggen naar een nog aan te maken pagina 1. Selecteer de tekst of afbeelding die een link moet worden. 2. Klik op de knop HYPERLINK (CTRL+K). Dan verschijnt het dialoogvenster HYPERLINK MAKEN.

Klik hier.

3. Open een nieuwe pagina (maak je keuze uit het dialoogvenster NIEUW). 4. Sla de nieuwe pagina op.

© Hans De Four 2000-2003

38

Een site bouwen

met

FrontPage 2000

Hoofdstuk 2 Externe hyperlinks Een externe hyperlink leggen 1. Selecteer de tekst of de afbeelding die een link moet worden. 2. Klik op de knop HYPERLINK (CTRL+K). Dan verschijnt het dialoogvenster HYPERLINK MAKEN.

Tik hier de URL van de pagina in. Of klik hier en surf naar je doel. Schakel via ALT+TAB terug naar FrontPage en de URL zal ingevuld zijn.

3. Klik op OK.

Hoofdstuk 3 Bladwijzers Een bladwijzer is een specifieke plaats op de geopende of op een andere pagina in je site waarnaar gelinkt kan worden. Dit wordt vaak gebruikt op langere pagina's: een klein overzicht met items wordt bovenaan de pagina geplaatst en elk item linkt naar het betreffende onderdeel. Een ander voorbeeld: een klik op het woord ‘Top’ stuurt je meteen naar boven op dezelfde pagina. Om een link naar een bladwijzer te maken, heb je de link zelf en de bladwijzer nodig. Een bladwijzer maken 1. Open de doelpagina en selecteer het woord of de zin die de bladwijzer (de bestemming van de link) moet worden. 2. Kies INVOEGEN Æ BLADWIJZER.

Tik hier een unieke naam in of accepteer de voorgestelde naam. OF Kies een al bestaande bladwijzer.

3. Klik op OK. Als je geen tekst selecteerde, verschijnt op de pagina het symbool de bladwijzer.

op de plaats van

Als je tekst selecteerde, wordt die nu met een stippellijn onderstreept. Een hyperlink naar een bladwijzer 1. Selecteer de tekst of afbeelding die een link moet worden. 2. Klik op de knop HYPERLINK

(CTRL+K).

3. Duid eventueel de pagina aan die de bladwijzer bevat. 4. Kies de bladwijzer via de keuzelijst BLADWIJZER. 5. Klik op OK.

© Hans De Four 2000-2003

39

Een site bouwen

met

FrontPage 2000

Een bladwijzer verwijderen ¾

Bestaat de bladwijzer uit tekst, klik dan op de bladwijzer en kies INVOEGEN Æ BLADWIJZER. Het dialoogvenster BLADWIJZER wordt weergegeven. Klik op WISSEN.

¾

Bestaat de bladwijzer uit het symbool

, dubbelklik dan op het symbool en druk op DELETE.

Hoofdstuk 4 E-mailadressen Je kan ook hyperlinks naar e-mailadressen leggen. Wanneer de bezoeker op zo'n link klikt, wordt zijn e-mailprogramma geopend en kan hij meteen een bericht sturen naar het opgegeven e-mailadres. Het snelst kan dat door je e-mailadres in te tikken en daarna op de spatiebalk of op ENTER te drukken. Je kan er ook voor zorgen dat een bepaalde tekst of afbeelding een link wordt naar een emailadres. Een hyperlink naar een e-mailadres 1. Selecteer de tekst of de afbeelding die een link moet worden. 2. Klik op de knop HYPERLINK (CTRL+K). Dan verschijnt het dialoogvenster HYPERLINK MAKEN. Klik hier. Het dialoogvenster EEN EMAILHYPERLINK MAKEN verschijnt.

Tik het e-mailadres in en klik op OK.

Of tik hier mailto: (i.p.v. http://) in gevolgd door het e-mailadres.

3. Klik op OK.

Hoofdstuk 5 Bestanden Een bestand laten downloaden via je website, verloopt in twee eenvoudige stappen. Eerst importeer je het bestand in de site, daarna leg je de hyperlink naar het bestand. Als een bezoeker op die link klikt, zal de browser er meteen voor zorgen dat het bestand kan worden opgeslagen op de harde schijf van de bezoeker. Een bestand importeren 1. Open of selecteer in de mappenlijst de map waarin je het bestand wil importeren. 2. Kies BESTAND Æ IMPORTEREN. Het dialoogvenster IMPORTEREN wordt nu weergegeven. Klik hier en selecteer het bestand dat je wil importeren. Klik nadien op OK.

© Hans De Four 2000-2003

40

Een site bouwen

met

FrontPage 2000

Een hyperlink naar een bestand 1. Selecteer de tekst of de afbeelding die een link moet worden. (CTRL+K). 2. Klik op de knop HYPERLINK Dan verschijnt het dialoogvenster HYPERLINK MAKEN.

Duid in dit venster het bestand aan waarnaar de link gelegd moet worden.

Of tik hier de naam van het bestand in.

3.

Klik op OK.

Hoofdstuk 6 Extra’s §1 Aanwijseffecten Je kan ervoor zorgen dat er iets opvallends gebeurt met de hyperlink als de bezoekers de muisaanwijzer op de hyperlink plaatsen. Je kan de hyperlink bv. van kleur laten veranderen, laten vergroten of een achtergrondkleur laten krijgen. 1. Kies OPMAAK Æ ACHTERGROND. De steekkaart ACHTERGROND van het dialoogvenster EIGENSCHAPPEN VAN PAGINA wordt nu getoond. 2. Duid het vakje AANWIJSEFFECTEN VAN HYPERLINKS aan. 3. Klik op de knop AANWIJSSTIJL. Het dialoogvenster LETTERTYPE verschijnt.

4. Stel het effect samen dat moet worden weergegeven als de bezoeker met de muisaanwijzer over de hyperlink beweegt en klik op OK. 5. Klik nogmaals op OK. Opmerking: Cascading style sheets Deze effecten werken met CSS en worden niet door alle browsers ondersteund. Browsers die ze wel ondersteunen, doen dat niet consequent. Bekijk je pagina dus minstens in enkele browsers als je CSS gebruikt! © Hans De Four 2000-2003

41

Een site bouwen

met

FrontPage 2000

§2 Hyperlinks controleren en herstellen Je verwijdert een bestand dat aan een andere pagina in je site is gekoppeld. Je maakt een tikfout in de URL terwijl je een externe hyperlink maakt. De pagina die gekoppeld was aan een externe hyperlink wordt verplaatst. … In deze situaties krijg je verbroken hyperlinks in je web. Je kan FrontPage echter laten controleren of er verbroken links zijn en die links laten herstellen. Hyperlinks controleren 1. Sla alle pagina’s op. 2. Kies BEELD Æ RAPPORTEN Æ VERBROKEN HYPERLINKS. Het rapport toont een lijst met verbroken interne (melding VERBROKEN) en externe (melding ONBEKEND) hyperlinks. 3. Klik op de werkbalk RAPPORTEN op de knop HYPERLINKS CONTROLEREN. Het dialoogvenster HYPERLINKS CONTROLEREN wordt nu weergegeven. 4. Klik in het dialoogvenster op STARTEN. Om externe hyperlinks te laten controleren, moet je een internetverbinding tot stand hebben gebracht. De controle kan een hele tijd duren (zeker als je site veel externe links bevat). Bij een gecontroleerde link verandert het vraagteken in een groen vinkje gevolgd door OK of VERBROKEN. Op het einde verschijnt een samenvatting in de statusbalk. Stoppen doe je door op ESC te drukken, doorgaan door op de knop HYPERLINKS CONTROLEREN te klikken. Verbroken hyperlinks herstellen 1. Dubbelklik in het rapport VERBROKEN HYPERLINKS op de hyperlink die je wil herstellen. Het dialoogvenster HYPERLINK BEWERKEN verschijnt.

2. Klik op de knop PAGINA BEWERKEN De pagina die de verbroken link bevat, wordt geopend. Herstel die link. OF Tik in het vak HYPERLINK VERVANGEN door het nieuwe doel of de nieuwe URL in. Bepaal waar je deze hyperlink wil wijzigen. Klik op de knop VERVANGEN. Tip

Controleer de links in je website heel regelmatig! Indien je niet te veel links moet controleren, kan je dat ook m.b.v. CTRL+klik op de hyperlink.

© Hans De Four 2000-2003

42

Een site bouwen

met

FrontPage 2000

Hoofdstuk 7 Gemeenschappelijke randen Met gemeenschappelijke randen kan je een consequente opmaak aanhouden voor heel je website. Met deze randen kan je navigatiebalken, paginavaandels, zinsneden, logo’s, … plaatsen in de marges van de pagina’s, zodat ze automatisch op elke pagina op dezelfde plaats verschijnen. Door navigatiebalken en paginavaandels in die randen op te nemen, wordt je website trouwens heel wat overzichtelijker. Gemeenschappelijke randen toepassen 1. Kies OPMAAK Æ GEMEENSCHAPPELIJKE RANDEN. Het dialoogvenster GEMEENSCHAPPELIJKE RANDEN wordt nu weergegeven.

2. Bepaal of je de randen enkel op de HUIDIGE PAGINA wil laten weergeven, op de GESELECTEERDE PAGINA’S (als je er eerst enkele selecteert in de MAPPENWEERGAVE) of op ALLE PAGINA’S (gemeenschappelijk). 3. Bepaal aan welke kant van de pagina(’s) de randen moeten komen. 4. Bepaal of er navigatieknoppen moeten worden weergegeven in de randen (Zie Hoofdstuk 8: Navigatiebalken). 5. Klik op OK.

Werkgebied

Gemeenschappelijke rand links

© Hans De Four 2000-2003

Gemeenschappelijke rand onderaan

43

Een site bouwen

met

FrontPage 2000

De gemeenschappelijke randen worden nu in de PAGINAWEERGAVE weergegeven op de aangeduide pagina’s m.b.v. stippellijnen. Plaats je iets in die gemeenschappelijke randen, dan zal dat worden weergegeven op dezelfde plaats op elke pagina met randen in je website. In de browser zijn de stippellijnen niet te zien. Je kan de instellingen van de gemeenschappelijke randen wijzigen voor afzonderlijke pagina’s of de weergave van die randen uitzetten. Instellingen van gemeenschappelijke randen wijzigen 1. Open de pagina indien het slechts één pagina betreft. Selecteer de pagina’s in de MAPPENWEERGAVE als het meer pagina’s betreft. 2. Kies OPMAAK Æ GEMEENSCHAPPELIJKE RANDEN. Het dialoogvenster GEMEENSCHAPPELIJKE RANDEN wordt nu weergegeven. 3. Duid HUIDIGE PAGINA of GESELECTEERDE PAGINA’S aan. 4. Bepaal welke randen je aan of uit wil zetten. M.b.v. STANDAARDWAARDEN VAN WEB VOOR RANDEN VAN HUIDIGE PAGINA herstel je de originele instellingen. 5. Klik op OK.

Hoofdstuk 8 Navigatiebalken Een navigatiebalk bestaat uit navigatieknoppen. Zo’n balk kan je laten plaatsen in de gemeenschappelijke randen (bovenaan of links) van je website. Daardoor kan het voor de bezoeker veel eenvoudiger zijn om de weg te vinden doorheen je website. Wil je gebruik maken van navigatiebalken, dan moet je eerst de navigatiestructuur van je website ontwerpen m.b.v. de NAVIGATIEWEERGAVE. Zodra dat in orde is (of althans de kern van de structuur is uitgetekend), geef je aan volgens welke NAVIGATIEBALKEIGENSCHAPPEN de navigatiebalk(en) moet(en) worden opgebouwd. Je moet immers het niveau van de hyperlinks t.o.v. de actieve pagina aanduiden. De pagina’s die in dit niveau verschijnen, worden gehaald uit de NAVIGATIEWEERGAVE.

Mogelijke navigatiebalkeigenschappen: BOVENLIGGEND NIVEAU Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op het niveau boven de huidige pagina.

HETZELFDE NIVEAU Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op hetzelfde niveau als de huidige pagina.

VORIGE EN VOLGENDE Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op hetzelfde niveau als de huidige pagina. Nuttig in een website waarin de pagina’s lineair na elkaar moeten worden weergegeven.

ONDERLIGGEND NIVEAU Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op het niveau onder de huidige pagina.

© Hans De Four 2000-2003

44

Een site bouwen

met

FrontPage 2000

BOVENSTE NIVEAU Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op het bovenste niveau van de website.

ONDERLIGGENDE PAGINA’S ONDER INTRODUCTIEPAGINA Hierdoor worden de hyperlinks weergegeven die leiden naar de pagina’s op het niveau onder de openingspagina van de website.

Je kan steeds hyperlinks opnemen naar de INTRODUCTIEPAGINA of de BOVENLIGGENDE PAGINA. Hoe de navigatiebalk er moet uitzien bepaal je m.b.v. het groepsvak RICHTING EN VORMGEVING. Je kan hem horizontaal of verticaal laten weergeven, met teksthyperlinks of met grafische knoppen. Grafische knoppen worden echter enkel weergegeven als je website thema’s gebruikt. Een navigatiebalk invoegen 1. Plaats de cursor in de pagina waar je wil dat de balk verschijnt. Plaats de cursor in een gemeenschappelijke rand als je de balk op meer dan één pagina wil laten weergeven. 2. Kies INVOEGEN Æ NAVIGATIEBALK. Het dialoogvenster NAVIGATIEBALKEIGENSCHAPPEN verschijnt. 3. Bepaal welk niveau hyperlinks je wil laten weergeven. 4. Bepaal de richting en vormgeving van de navigatiebalk. 5. Klik op OK. De navigatiebalk verschijnt nu in de pagina(‘s). Mocht dat niet zo zijn (er verschijnt een cursief gedrukte aantekening), dan heb je waarschijnlijk een niveau laten weergeven dat niet past bij de huidige pagina. Dubbelklik op de aantekening om de instellingen te wijzigen of open de NAVIGATIEWEERGAVE en verander de navigatiestructuur. Het kan zijn dat bepaalde paginatitels te lang zijn om te worden weergegeven in de navigatiebalk of op een navigatieknop. De tekst van een navigatieknop wijzigen 1. Open de NAVIGATIEWEERGAVE. 2. Klik op het pictogram met de titel die je wil wijzigen. 3. Klik op de titel en tik een nieuwe titel in. 4. Druk op ENTER. 5. Open de PAGINAWEERGAVE en klik eventueel op VERNIEUWEN. Soms kan het nodig zijn om bepaalde pagina’s die in de navigatiestructuur zijn opgenomen toch niet weer te geven in een navigatiebalk. Pagina’s uitsluiten van weergave in een navigatiebalk 1. Open de NAVIGATIEWEERGAVE. 2. Klik op de pagina die je uit de navigatiebalk wil verwijderen. 3. Klik in de werkbalk NAVIGATIE op de knop OPGENOMEN IN NAVIGATIEBALKEN. Het gele pictogram wordt nu grijs. Je kan ook externe pagina’s of hyperlinks toevoegen aan een navigatiebalk. 1. Open de NAVIGATIEWEERGAVE. 2. Klik op de pagina waaraan je de extra link wil koppelen. 3. Klik in de werkbalk NAVIGATIE op de knop EXTERNE KOPPELING. Het dialoogvenster HYPERLINK SELECTEREN verschijnt. 4. Geef het internetadres, de pagina of het bestand aan waarnaar je de externe koppeling wil maken. 5. Klik op OK. Er verschijnt nu een pictogram voor de nieuwe hyperlink.

© Hans De Four 2000-2003

45

Een site bouwen

DEEL 6

met

FrontPage 2000

Afbeeldingen

Je wil je site natuurlijk aantrekkelijker maken door afbeeldingen toe te voegen. Het logo van de school, foto's van activiteiten, knoppen, lijnen, fleurige achtergronden, image maps, … Ook hier een oproep om niet te overdrijven met afbeeldingen en te letten op de omvang van afbeeldingen. Veel en zware figuren op je pagina vertragen het inladen ervan, waardoor vele bezoekers vroegtijdig de site verlaten. De enige afbeeldingen die je voor een webpagina kan gebruiken zijn die met als extensie .GIF of .JPEG. Sinds kort is er ook het type .PNG, maar dat wordt nog niet door alle browsers ondersteund. Wil je een afbeelding van een ander type gebruiken (bv. .BMP, .TIF, …), dan moet dit type worden omgezet naar .GIF of .JPEG. FrontPage2000 doet dat automatisch, maar je kan hier ook een grafisch programma voor gebruiken. Tips -

Beperkt elke pagina tot maximaal 30 KB (exclusief de afbeeldingen). Gemiddeld neemt een pagina zo'n 5-10 KB in beslag.

-

Verklein de bestandsomvang. Plaats geen afbeeldingen die groter zijn dan 50 KB.

-

Beperk het aantal kleuren van je afbeelding. Dat kan zonder kwaliteitsverlies met een grafisch programma.

-

Hou de resolutie laag (max. 72 ppi). Deze resolutie is ruim voldoende voor afbeeldingen die op een computerscherm moeten worden getoond.

-

Herhaal afbeeldingen. De browser slaat de afbeeldingen immers tijdelijk op in de cache van de computer van de bezoeker en zal een afbeelding de volgende keer veel sneller kunnen tonen, vermits hij die eerst gaat zoeken in die cache.

-

Gebruik miniaturen. Afbeeldingen van 10-20 KB kan je rechtstreeks op de pagina plaatsen. Van omvangrijker afbeeldingen plaats je best een thumbnail (een miniatuurversie, zowel in grootte als in omvang). Wanneer de bezoeker op die miniatuur klikt, krijgt hij de normale, grotere versie van de afbeelding te zien. Deze techniek wordt heel vaak gebruikt bij fotogalerieën.

Hoofdstuk 1 Soorten afbeeldingen §1

Cliparts en pictogrammen

Dit zijn voornamelijk eenvoudige illustraties (geen foto's) en worden meestal opgeslagen in het GIF-formaat. Dit formaat laat maximaal 256 kleuren toe, daardoor is de omvang niet te groot.

§2

Foto’s

Deze worden meestal opgeslagen in het JPEG-formaat. Dit formaat laat 16 miljoen kleuren toe en gebruikt compressie zodat de omvang van de foto toch niet te groot wordt.

§3

Animated gifs

Dit zijn bewegende cliparts en pictogrammen en moeten de extensie .GIF hebben.

§4

Image maps

Een afbeelding kan als hyperlink worden gebruikt naar één andere pagina, maar ook als hyperlink naar verschillende pagina's. Dan spreken we van een image map. Naar welke pagina je surft, hangt dan af van de plaats op de afbeelding waar je klikt. Deze afbeelding zou bv. uiterst geschikt zijn als een image map, waarbij je meer info krijgt over de provincie waarop je klikt.

© Hans De Four 2000-2003

46

Een site bouwen

§5

met

FrontPage 2000

Achtergronden

Je kan afbeeldingen ook gebruiken als pagina-achtergrond. Die afbeeldingen mogen daarvoor niet te ingewikkeld zijn. Op een achtergrond worden ze immers honderden keren naast elkaar geplaatst om zo een mooi egaal behang te vormen voor de pagina. Voorbeelden van goede achtergronden zijn :

Foto's en al te kleurrijke afbeeldingen kunnen niet als achtergronden worden gebruikt, omdat hun randen zichtbaar worden. Een achtergrondfiguur moet naadloos aansluiten. Een voorbeeld van een slechte achtergrond is:

Hoofdstuk 2 Afbeeldingen bekijken Wanneer je eigen afbeeldingen vanop diskette of harde schijf op je pagina wil invoegen, is het vaak gokken over het resultaat. Met behulp van verschillende programma’s kan je er echter voor zorgen dat je de afbeelding op voorhand kan bekijken. •

Grafische viewer Open een afbeeldingsviewer (ACDSee, Paint Shop Pro Browser, Ember, CompuPic, ImageView, ThumbsPlus, …). Deze programma’s dienen enkel voor het bekijken van figuren.

•

Grafisch programma Open een afbeeldingseditor (Paint, Paint Shop Pro, Corel Draw, Adobe PhotoShop, PhotoDraw, …) en open de afbeelding daarin. Je kan ze eventueel meteen bewerken.

•

Windows98 Open Windows Verkenner. Kies BEELD Æ ALS WEBPAGINA. Duid de naam van de afbeelding aan.

•

Windows2000 Kies de weergave THUMBNAILS, wanneer je het bestand wil selecteren.

© Hans De Four 2000-2003

47

Een site bouwen •

met

FrontPage 2000

Netscape

Slepen

Verkenner

Netscape

1. Open de browser Netscape (met Internet Explorer werkt deze methode niet). 2. Maximaliseer Netscape. 3. Open Windows Verkenner en ga naar de map waarin de te bekijken afbeeldingen zich bevinden. 4. Geef Windows Verkenner weer in een kleiner venster, met Netscape op de achtergrond. 5. Selecteer in Windows Verkenner de te bekijken afbeeldingen (zie afbeelding). 6. Sleep deze selectie naar het Netscape-venster. De afbeeldingen worden nu in dit venster geopend. 7. Klik in het Netscape-venster en bekijk ze stuk voor stuk via de knop TERUG. In de adresbalk (bij LOCATIE) lees je de naam van de afbeelding. Zodra je een geschikte afbeelding gevonden hebt, onthou je de naam en voeg je ze in via FrontPage.

© Hans De Four 2000-2003

48

Een site bouwen

met

FrontPage 2000

Hoofdstuk 3 Afbeeldingen invoegen en verwijderen §1

Afbeelding vanuit de website invoegen

Snelle en eenvoudige methode ¾

Sleep het pictogram van de afbeelding uit de mappenlijst naar de pagina.

Andere methode 1. Plaats de cursor waar de afbeelding moet komen. 2. Klik in de werkbalk STANDAARD op de knop FIGUUR UIT BESTAND INVOEGEN . In het dialoogvenster FIGUUR krijg je een overzicht van de grafische bestanden in je website.

Open de juiste map en selecteer de afbeelding die je wil invoegen. Er wordt een voorbeeld weergegeven.

3. Klik op OK.

§2

Afbeelding vanop de schijf invoegen

Snelle methode ¾

Kopieer de afbeelding vanuit een andere toepassing en plak ze in de pagina in FrontPage.

¾

Sleep de afbeelding vanuit Windows Verkenner naar de pagina in FrontPage.

Andere methode 1. Plaats de cursor waar de afbeelding moet komen. 2. Klik in de werkbalk STANDAARD op de knop FIGUUR UIT BESTAND INVOEGEN

.

Klik hier

3. Selecteer de gewenste afbeelding in het dialoogvenster BESTAND SELECTEREN.

© Hans De Four 2000-2003

49

Een site bouwen

met

FrontPage 2000

Via deze knop kan je miniaturen bekijken van de afbeeldingen.

4. Klik op OK. Als je de pagina opslaat, zal FrontPage automatisch vragen de ingesloten afbeelding(en) mee op te slaan. Het dialoogvenster INGESLOTEN BESTANDEN OPSLAAN verschijnt.

Wijzig eventueel de naam of de map of stel een actie in en klik op OK.

§3

Afbeelding vanaf het WWW invoegen

Je kan een afbeelding die op een pagina op een heel andere server op het WWW staat ook invoegen in jouw eigen website. Hou er dan wel rekening mee dat de figuur niet meer wordt getoond als ze wordt verwijderd of als de naam ervan verandert op die andere server. Dit kan je voorkomen door de figuur eerst naar je eigen schijf te kopiëren en in te voegen volgens de methode van §2. Om een afbeelding die ergens op het web staat in te voegen, doorloop je deze stappen: 1. Plaats de cursor waar de afbeelding moet komen. 2. Klik in de werkbalk STANDAARD op de knop FIGUUR UIT BESTAND INVOEGEN

.

Tik hier de URL van de afbeelding in . OF Klik hier om de browser te starten en naar het adres van de afbeelding te surfen.

3. Klik op OK. Als de koppeling naar de afbeelding niet goed werkt, verschijnt dit pictogram. Dubbelklik erop om de EIGENSCHAPPEN VAN FIGUUR te tonen. In het vak BRON VAN FIGUUR kan je de URL wijzigen.

© Hans De Four 2000-2003

50

Een site bouwen

§4

met

FrontPage 2000

Afbeelding vanuit de illustratiegalerie invoegen

Om een afbeelding die ergens op het web staat in te voegen, doorloop je deze stappen: 1. Plaats de cursor waar de afbeelding moet komen. 2. Kies INVOEGEN Æ FIGUUR Æ ILLUSTRATIE. OF Klik in de werkbalk STANDAARD op de knop FIGUUR UIT BESTAND INVOEGEN

.

Klik hier

Het dialoogvenster CLIPGALERIE verschijnt.

3. Kies de soort clip (FIGUREN – GELUIDEN – ANIMATIES) en de gewenste CATEGORIE. 4. Klik op de gewenste illustratie en duid CLIP INVOEGEN aan. De illustratie verschijnt nu (nogal groot) op de pagina.

§5

Afbeeldingen verwijderen

Afbeeldingen verwijderen uit de pagina 1. Selecteer de afbeelding. 2. Druk op DELETE. Hierdoor is de afbeelding verwijderd in de pagina. Maar als de pagina (en de bijbehorende afbeeldingen) al eerder werd opgeslagen, is de afbeelding niet verwijderd uit de site. Afbeeldingen verwijderen uit de site 1. Selecteer de afbeelding in de mappenlijst of in de MAPPENWEERGAVE. 2. Druk op DELETE. 3. Klik op JA als antwoord op de vraag WEET U HET ZEKER? © Hans De Four 2000-2003

51

Een site bouwen

met

FrontPage 2000

Hoofdstuk 4 Afbeeldingseigenschappen §1

Algemeen

Bij elke afbeelding kan je een aantal eigenschappen instellen. Rechtsklik op de afbeelding en kies de opdracht EIGENSCHAPPEN VAN FIGUUR. De steekkaart ALGEMEEN van het dialoogvenster EIGENSCHAPPEN VAN FIGUUR wordt nu weergegeven.

•

BRON VAN FIGUUR Hier kan je een andere figuur selecteren. Via de knop BEWERKEN wordt een grafisch programma geopend, zodat je de afbeelding kan bewerken. Welk grafisch programma wordt gestart, hangt af van de instellingen in EXTRA Æ OPTIES Æ EDITORS CONFIGUREREN.

•

TYPE Je kan aangeven of de afbeelding moet worden bewaard als GIF, als JPEG of als PNG. ™

GIF Een GIF-afbeelding kan één transparante kleur bezitten. De transparantie schakel je in via een grafisch programma of via de werkbalk FIGUUR. Een geïnterlinieerde afbeelding komt geleidelijk in beeld: eerst heel vaag, daarna steeds helderder. Daardoor heeft de bezoeker wat om naar te kijken en lijkt het alsof hij niet zolang moet wachten.

™

JPEG Je kan de weergavekwaliteit instellen (en zo ook de capaciteit) en je kan bepalen in hoeveel stappen de afbeelding moet worden opgebouwd in de browser.

™

PNG Dit is een heel nieuw type met veel meer mogelijkheden dan GIF of JPEG. Toch raad ik het gebruik ervan voorlopig nog af, aangezien nog niet veel browsers dit type ondersteunen.

•

VERVANGENDE AFBEELDINGEN ™

LAGE RESOLUTIE Hier kan je verwijzen naar een afbeelding die minder bestandsruimte inneemt (wegens een lagere kwaliteit) dan de definitief te tonen versie. Zolang de uiteindelijke afbeelding ingeladen wordt, zal deze afbeelding worden getoond aan de bezoeker. Zo is er toch al iets te zien.

™

TEKST De tekst die je hier intikt, wordt getoond - terwijl de afbeelding wordt ingeladen; - als de bezoeker met de muisaanwijzer over de afbeelding beweegt.

•

STANDAARDHYPERLINK ™ LOCATIE Hier wordt de URL weergegeven als de afbeelding ook een hyperlink is. ™

DOELFRAME Hier wordt aangegeven in welk frame het doel van de hyperlink moet worden weergegeven.

•

OPMAAKPROFIEL Zie Deel 12: Hoofdstuk 3: Cascading Style Sheets.

© Hans De Four 2000-2003

52

Een site bouwen

§2

met

FrontPage 2000

Vormgeving

Je kan ook bepalen waar de afbeelding moet worden weergegeven (al heb je hier niet alle controle over), hoe de tekst errond moet lopen en welke de afmetingen moeten zijn. Rechtsklik op de afbeelding en kies de opdracht EIGENSCHAPPEN VAN FIGUUR. Kies de steekkaart VORMGEVING in het dialoogvenster EIGENSCHAPPEN VAN FIGUUR.

•

INDELING ™ UITLIJNING Je kan o.a. kiezen uit: ƒ

!NIEUW!

LINKS De figuur wordt links geplaatst en de tekst loopt er rechts omheen. Zie afbeelding (Linkse uitlijning) Je kan een figuur ook links uitlijnen door ze te selecteren en te klikken op de knop LINKS UITLIJNEN in de werkbalk OPMAAK. Dit geeft echter een ander effect! Zie de afbeelding onderaan (Standaard)

ƒ

RECHTS De figuur wordt rechts geplaatst en de tekst loopt er links omheen. Zie de afbeelding onderaan (Rechtse uitlijning)

ƒ

BOVEN Eén lijn tekst wordt ter hoogte van de bovenkant van de figuur geplaatst.

ƒ

MIDDEN of CENTREREN Eén lijn tekst wordt ter hoogte van het midden van de figuur geplaatst. Zie de afbeelding onderaan (Midden uitlijning)

ƒ

ONDER Eén lijn tekst wordt ter hoogte van de onderkant van de figuur geplaatst.

Wil je de tekstomloop stoppen, dan moet je een eindemarkering plaatsen. Een eindemarkering maakt een nieuwe, lege regel en plaatst alle tekst die na de eindemarkering komt onder de afbeelding. Let op!

Een eindemarkering is niet hetzelfde als een normaal regeleinde SHIFT+ENTER.

© Hans De Four 2000-2003

53

Een site bouwen

met

FrontPage 2000

Een eindemarkering plaatsen 1. Plaats de cursor waar je de eindemarkering wil invoegen. 2. Kies INVOEGEN Æ EINDEMARKING. Dit dialoogvenster verschijnt en er wordt een NORMAAL REGELEINDE ingevoegd.

3. Bepaal welke eindemarkering je wil invoegen. o

Bij vrije linkermarge kies je als de afbeeldingen links zijn uitgelijnd.

o

Bij vrije rechtermarge kies je als de afbeeldingen rechts zijn uitgelijnd.

o

Bij vrije linker- en rechtermarge kies je als er op de pagina zowel links als rechts uitgelijnde afbeelding staan.

De tekst na de eindemarkering wordt telkens naar de eerste vrije regel onder de afbeelding geplaatst, aansluitend bij de linker- of rechtermarge. 4. Klik op OK. ™ RANDBREEDTE Hiermee kan je afbeelding omranden en meteen de dikte van de rand bepalen. De waarde wordt in pixels uitgedrukt. Dit is vooral nuttig als de afbeelding een hyperlink is. De randkleur wordt bepaald door de hyperlinkkleuren.

™ HORIZONTALE AFSTAND / VERTICALE AFSTAND Hiermee bepaal hoeveel plaats (witruimte) er moet blijven tussen de afbeelding en de tekst errond. De waarde wordt in pixels uitgedrukt.

•

GROOTTE ™

GROOTTE OPGEVEN De afmetingen van een afbeelding worden automatisch ingevuld. Op die manier wordt tijdens het inladen van de afbeelding een leeg kader met de betrokken afmetingen geplaatst, zodat de beozeker kan zien dat er nog een afbeelding volgt. Je kan de afmetingen hier wijzigen en opgeven in pixels of in procent van de venstergrootte. Door BREEDTE-HOOGTEVERHOUDING BEHOUDEN aan te duiden, zorg je ervoor dat de oorspronkelijk verhoudingen behouden blijven (het veranderen van de breedte resulteert meteen in een aangepaste hoogte). De grootte kan je echter veel sneller wijzigen door de afbeelding te selecteren en de hoekgrepen te verslepen.

Formaatgrepen

Opmerkingen

-

Door de grootte te wijzigen, verandert er niets aan de capaciteit!

-

Wil je de afbeelding exact op een bepaalde plaats krijgen, dan moet je gebruik maken van: -

Tabellen Dit bespreken we in Deel 7: Tabellen.

-

Plaatsing Dit bespreken we in Deel 12: Hoofdstuk 2: Plaatsing. Deze techniek werkt echter enkel in de nieuwste browsers.

© Hans De Four 2000-2003

54

Een site bouwen

met

FrontPage 2000

Hoofdstuk 5 Afbeeldingen bewerken Als je een afbeelding wil wijzigen (kleur veranderen, achtergrond doorzichtig maken, …) of wil maken, heb je een grafisch programma (Paint Shop Pro, Corel Draw, PhotoShop, PhotoDraw, …) nodig. Het programma Paint zit standaard bij Windows95/98, maar biedt slechts beperkte mogelijkheden. Het programma Paint Shop Pro kan je gratis downloaden en gebruiken. De programma's Corel Draw, Adobe PhotoShop en PhotoDraw zijn professionele pakketten en bieden massaal veel mogelijkheden. Je schaft ze aan in een softwarewinkel. FrontPage2000 biedt een beperkt aantal handige mogelijkheden om afbeeldingen te bewerken met behulp van de werkbalk FIGUREN die je verkrijgt via BEELD Æ WERKBALKEN Æ FIGUREN. Door een figuur te selecteren kan je heel wat knoppen activeren.

Tekst

Plaatsing Spiegelen

Auto-miniatuur

Contrast

Draaien

Transparante Wassen Aantal bits kleur

Helderheid

Zwart-wit Bijsnijden

Terugzetten Hotspots

Schuine rand

Opmerkingen

Als je een figuur bewerkt in FrontPage en je slaat daarna de pagina op, dan wordt je gevraagd een nieuwe, gewijzigde versie van de afbeelding op te slaan (INGESLOTEN BESTANDEN OPSLAAN). Klik je op OK, dan wordt de originele afbeelding overschreven. Wil je de originele afbeelding houden, verander dan de naam (NAAM WIJZIGEN) en klik nadien op OK. Een aantal van de mogelijkheden die we hier gaan bespreken kunnen enkel wrden toegepast op GIFafbeeldingen. Probeer je ze op JPEG-afbeeldingen, dan zal FrontPage vragen of je de afbeelding wil converteren naar GIF. Daardoor kan de kwaliteit (en de bestandsgrootte) wel verminderen!

1. Tekst op een figuur plaatsen Deze mogelijkheid is zeer handig om knoppen te maken. 1. Klik op de afbeelding die je een tekstlabel wil geven. 2. Klik op de knop TEKST. Een rechthoek verschijnt met een cursor erin.V 3. Tik de gewenste tekst in. 4. Klik ergens buiten de afbeelding. Om het label te verplaatsen, klik je op de figuur en versleep je het kader rond de tekst. Met de knoppen in de werkbalk OPMAAK kan je de tekst opmaken.

2. Miniaturen Een miniatuur is een kleine versie van een afbeelding. Miniaturen worden sneller geladen dan grote afbeeldingen en zijn dus heel nuttig om fotogalerieën aan te leggen. Zodra de bezoeker op een miniatuur klikt, wordt een pagina geopend waarin de grote afbeelding wordt getoond. 1. Klik op de afbeelding die je wil wijzigen in een miniatuur. 2. Klik op de knop AUTO-MINIATUUR. Van sommige afbeeldingen kan je geen miniatuur maken: -

afbeeldingen die al hyperlinks zijn;

-

afbeeldingen die hyperlinks bevatten;

-

afbeeldingen die kleiner zijn dan de miniatuur;

-

afbeeldingen met tekstlabels.

© Hans De Four 2000-2003

55

Een site bouwen

met

FrontPage 2000

3. Transparantie Bekijk deze twee figuren op de gekleurde achtergrond. Doordat de eerste figuur een witte achtergrond heeft, vloekt ze met de achtergrondkleur van de pagina. Door de transparantie-eigenschap kan je ervoor zorgen dat de pagina-achtergrond door de afbeelding heen schijnt. Niet-transparante figuur op groene achtergrond

Transparante figuur

Deze eigenschap kan alleen worden toegepast op GIF en PNG-bestanden. Bovendien kan een figuur maar één transparante kleur hebben. Meestal wordt de achtergrond van een figuur als transparante kleur gekozen. 1. Klik op de afbeelding die je transparant wil maken. 2. Klik op de knop TRANSPARANTE KLEUR INSTELLEN. 3. Klik met de aanwijzer in de afbeelding op de kleur die je wil verwijderen. Wil je de transparante GIF-afbeelding weer wijzigen in een gewone GIF-afbeelding, klik dan op de knop TRANSPARANTE KLEUR INSTELLEN en klik op het transparante gedeelte.

4. Bijsnijden Wanneer je een deel van een figuur wil overhouden en de rest verwijderen, kan je de figuur bijsnijden.

VOOR

BIJSNIJDEN

NA

1. Klik op de afbeelding die je wil bijsnijden. 2. Klik op de knop BIJSNIJDEN. 3. Wijzig de vorm van de snijrand en omkader wat je wil overhouden. 4. Klik nogmaals op de knop BIJSNIJDEN.

5. Andere effecten Met de knoppen op de werkbalk FIGUREN kan je nog meer: •

LINKSOM DRAAIEN en RECHTSOM DRAAIEN

•

HORIZONTAAL SPIEGELEN en VERTICAAL SPIEGELEN

•

MEER CONTRAST en MINDER CONTRAST

•

MEER HELDERHEID en MINDER HELDERHEID

•

ZWART-WIT

•

WASSEN Hiermee vervaag je de afbeelding.

•

SCHUINE RAND Hiermee kan je de rand van de afbeelding afschuinen. Je krijgt dan een het effect van een knop.

•

Nog andere effecten kan je met behulp van een grafisch programma bereiken. Dubbelklik op een afbeelding om het grafisch programma te starten. Via EXTRA Æ OPTIES Æ EDITORS CONFIGUREREN kan je instellen welk grafisch programma je liefst gebruikt.

© Hans De Four 2000-2003

56

Een site bouwen

met

FrontPage 2000

Hoofdstuk 6 Imagemaps maken Een imagemap is een afbeelding met hyperlinks. Bezoekers kunnen op verschillende delen van de afbeelding klikken en worden – afhankelijk van de plaats waar ze klikken – telkens naar een andere pagina doorgestuurd. De aanklikbare delen van de afbeelding noemen we hotspots. Opmerkingen

Werk je met een imagemap om de bezoeker door te sturen naar andere pagina’s, neem onder de imagemap (of elders op die pagina) dan ook gewone teksthyperlinks op. Sommige bezoekers gebruiken immers een browser die geen afbeeldingen toont of hebben het laden van afbeeldingen uitgeschakeld. Zij kunnen dan verder met de teksthyperlinks. Kies een goede afbeelding! Het moet immers opvallen dat de afbeelding een imagemap met verschillende aanklikbare delen is. De hotspots testen kan je in je browser of door CTRL ingedrukt te houden en met de muis op de hotspots te klikken.

1. Hotspots maken Hotspots maak je met de knoppen op de werkbalk FIGUREN en bestaan in drie vormen: RECHTHOEKIG, ROND, VEELHOEKIG. 1. Plaats de afbeelding die een imagemap moet worden. 2. Klik op de afbeelding. 3. Klik op één van de HOTSPOTS-knoppen. Kies de vorm die het best overeenkomt met het deel dat je wil veranderen in een hotspot. 4. Klik met de aanwijzer op de afbeelding en sleep totdat de hotspot helemaal gevormd is. ¾

RECHTHOEKIGE HOTSPOT: Klik in de hoek en sleep.

¾

RONDE HOTSPOT: Klik in het midden en sleep.

¾

VEELHOEKIGE HOTSPOT: Klik en beweeg de muisaanwijzer naar de volgende hoek, klik beweeg de muisaanwijzer naar de volgende hoek, … Om de veelhoek te sluiten, klik je op het beginpunt.

Nadat de hotspot getekend is, verschijnt de rand van de hotspot op de afbeelding en wordt het dialoogvenster HYPERLINK MAKEN weergegeven. 5. Maak de hyperlink aan (intern, extern, bladwijzer, e-mailadres, bestand). 6. Bepaal op deze manier alle aanklikbare delen. Als hotspots elkaar overlappen, zal de hotspot die je laatst tekende voorrang krijgen. Delen zonder hotspot doen niets, tenzij je een standaardhyperlink aangeeft. 7. Klik tenslotte buiten de afbeelding om de randen van de hotspots te verbergen.

2. Werken met hotspots Hotspots … bekijken verplaatsen van vorm veranderen bewerken verwijderen

Te doen Klik op de afbeelding Klik op de hotspot en versleep hem Klik op de hotspot en versleep de hoekgrepen Dubbelklik op de hotspot Klik op de hotspot en druk op DELETE

Met de knop HOTSPOTS MARKEREN, worden alleen de hotspots in de afbeelding getoond. De afbeelding zelf wordt wit. Klik nogmaals op die knop om terug te keren naar de gewone weergave.

© Hans De Four 2000-2003

57

Een site bouwen

met

FrontPage 2000

3. Een tekst-hotspot Wanneer de aanklikbare delen niet zo goed te herkennen zijn, kan je een tekstlabel aan de hotspot hangen. 1. Klik op de afbeelding 2. Klik op de knop TEKST. Een rechthoekige hotspot verschijnt met een cursor erin. 3. Tik de beschrijvende tekst in. 4. Klik ergens buiten de afbeelding. 5. Dubbelklik op de hotspot. 6. Maak de hyperlink. 7. Klik ergens buiten de afbeelding.

4. Een standaardhyperlink leggen Door een standaardhyperlink in te stellen voor een imagemap kan je ervoor zorgen dat de bezoekers toch naar een site springen als ze niet op een hotspot klikken. Bij een imagemap zonder standaardhyperlink gebeurt er immers niets als er naast de hotspots wordt geklikt. 1. Rechtsklik op de afbeelding 2. Kies EIGENSCHAPPEN VAN FIGUUR. Het dialoogvenster EIGENSCHAPPEN VAN FIGUUR wordt nu weergegeven. 3. Geef in het vak LOCATIE de URL van de standaardhyperlink op. Gebruik eventueel de knop BLADEREN om het dialoogvenster HYPERLINK BEWERKEN weer te geven. 4. Klik op OK.

© Hans De Four 2000-2003

58

Een site bouwen

met

FrontPage 2000

Hoofdstuk 7 Achtergronden invoegen 1. Rechtsklik op de pagina-achtergrond en kies EIGENSCHAPPEN VAN PAGINA. Kies de steekkaart ACHTERGROND. OF Kies OPMAAK Æ ACHTERGROND.

2. Duid het vak ACHTERGRONDFIGUUR aan en klik op de knop BLADEREN. Het dialoogvenster ACHTERGRONDFIGUUR SELECTEREN verschijnt.

Open de juiste map en selecteer de achtergrondfiguur. Er wordt een voorbeeld weergegeven. Klik op OK.

3. Wil je dat de achtergrond niet meebeweegt als de bezoeker door de pagina bladert, duid dan het vak WATERMERK aan. Dit werkt alleen in MS Internet Explorer! 4. Klik op OK. De achtergrond van de pagina wordt nu gevuld met de gekozen afbeelding. Opmerkingen

De achtergrond wordt gecreëerd door de afbeelding voortdurend te herhalen, totdat het volledige browservenster ermee is gevuld. Wanneer je website een thema gebruikt, kan je zelf geen achtergrond kiezen. We zagen al eerder dat je in plaats van een achtergrondfiguur ook een effen achtergrondkleur kan instellen en dat je de achtergrondgegevens ook kan laten bepalen door een andere pagina via GEGEVENS OVER DE ACHTERGROND VAN EEN ANDERE PAGINA HALEN.

© Hans De Four 2000-2003

59

Een site bouwen

DEEL 7

met

FrontPage 2000

Tabellen

Een tabel is het krachtigste hulpmiddel dat een webdesigner ter beschikking staat. Het toepassen van een tabel geeft namelijk aan de opmaker een sterk houvast bij het positioneren van tekst en afbeeldingen. Tabellen delen afzonderlijke gegevens op in cellen, die zijn geordend in horizontale rijen en verticale kolommen.

Hoofdstuk 1 Werken met tabellen Een tabel maken Voor je begint met het aanmaken van een tabel, kan je jezelf veel tijd besparen door eerst een schets op papier te maken van de tabel. Zodra dit is gebeurd, kies je een van deze mogelijkheden: ¾

Via de menu TABEL 1. Kies TABEL Æ INVOEGEN Æ TABEL. Geef aan hoeveel rijen en kolommen de tabel moet bevatten. Bepaal de andere eigenschappen van de tabel. Ze worden verder uitgelegd.

2. Klik op OK. ¾

Via de werkbalk STANDAARD Klik op TABEL INVOEGEN en sleep de muis totdat je het gewenste aantal rijen en kolommen hebt geselecteerd.

¾

Via de tekenknoppen 1. Klik op de knop TABEL TEKENEN. 2. Klik met de aanwijzer waar je de tabel wenst en sleep om de kader van de tabel aan te geven. 3. Laat de muisknop los. Je hebt nu een tabel met één cel. 4. Verdeel de tabel in rijen door in de tabel te klikken en van links naar rechts te slepen. 5. Verdeel de tabel in kolommen door in de tabel te klikken en van boven naar onder te slepen. 6. Klik op de knop TABEL TEKENEN om te stoppen.

Een tabel selecteren ¾

Kies TABEL Æ SELECTEREN ÆTABEL. OF Sleep de muis over de bovenrand van alle kolommen.

Een tabel verwijderen ¾

Selecteer de tabel en druk op DELETE.

Een tabel verwijderen zonder verlies van de inhoud. ¾

Kies TABEL Æ CONVERTEREN Æ TABEL NAAR TEKST.

© Hans De Four 2000-2003

60

Een site bouwen

met

FrontPage 2000

Tabellen nesten Tabellen nesten is ook mogelijk. Dit wil zeggen dat je tabellen in tabellen kan aanmaken. Plaats hiertoe de cursor in de cel waarin de tabel moet komen en voeg de tabel in volgens bovenstaande werkwijze. Zo kan je je webpagina nog veel beter structureren. Onderstaande structuur in de NORMALE WEERGAVE

geeft dit resultaat in de browser:

Tabellen gebruiken Een tabel heeft dezelfde mogelijkheden als een pagina. Je kan er tekst, afbeeldingen, links, andere tabellen, … in plaatsen. Je kan de tabel of slechts enkele cellen een achtergrondkleur of achtergrondafbeelding geven, … Wil je van cel naar cel vooruitspringen, druk dan op TAB (achteruit: SHIFT+TAB). Sta je in de laatste cel van de tabel, dan wordt er een nieuwe rij toegevoegd door op TAB te drukken.

Hoofdstuk 2 Tabeleigenschappen Als je aan een tabel werkt, zal je geregeld bepaalde eigenschappen zoals randdikte, kleur, uitlijning, breedte, … willen veranderen. Dit doe je als volgt: ¾

Plaats de cursor ergens in de tabel en kies TABELÆ EIGENSCHAPPEN Æ TABEL. OF Rechtsklik in de tabel en kies EIGENSCHAPPEN VAN TABEL.

In het dialoogvenster krijg je een waaier van mogelijkheden, onderverdeeld in drie groepen: INDELING, RANDEN, ACHTERGROND.

Een handige knop in dit dialoogvenster is de knop TOEPASSEN. Daarmee kan je het effect zien van je wijzigingen in het dialoogvenster zonder het venster te sluiten. Bevalt het je, klik dan op OK. Bevalt het je niet, kies dan andere instellingen of klik op Annuleren.

§1

Indeling

1. Uitlijning Als je tabel niet de volledige schermbreedte in beslag neemt, kan je hier bepalen waar je ze wil plaatsen: aan de linkerkant (standaard), aan de rechterkant, gecentreerd of uitgevuld.

© Hans De Four 2000-2003

61

Een site bouwen

met

FrontPage 2000

2. Laten zweven

!NIEUW!

Bij een zwevende tabel kan je tekst om de linker- of rechterkant van een tabel leiden.

STANDAARD: Niet-zwevend. LINKS: De tabel gaat tegen de linkermarge zweven en de tekst loopt langs de rechterkant om de tabel heen. RECHTS: De tabel gaat tegen de rechtermarge zweven en de tekst loopt langs de linkerkant om de tabel heen. Deze functie werkt enkel in de nieuwste browsers!

3. Celopvulling Deze waarde bepaalt welke afstand (in pixels) vrij blijft tussen de binnenranden van alle cellen en de inhoud van die cellen. Deze instelling kan het uiterlijk van een tabel heel wat verfraaien. Standaard is dit 1 pixel.

4. Ruimte tussen cellen Deze waarde bepaalt welke afstand (in pixels) vrij blijft tussen de cellen. Standaard is dit 2 pixels. Deze instelling heeft ook effect op de tabel- en celranden. Onderstaande tabel heeft een RANDDIKTE 10, CELOPVULLING 20 en RUIMTE TUSSEN CELLEN 5.

5. Breedte en hoogte opgeven Om de breedte van de tabel goed te bepalen, moet je inzicht hebben in de verschillende mogelijkheden. Als je het vak BREEDTE OPGEVEN niet aankruist, past de breedte van de cellen zich automatisch aan de inhoud aan, zodat het aantal lijnen in elke cel op één rij ongeveer gelijk blijft. De tabel zal maximaal de volledige schermbreedte innemen. Als je het vak BREEDTE OPGEVEN aankruist, kan je breedte van de tabel eigenhandig instellen. Je hebt de keuze tussen IN PIXELS of IN PROCENTEN. -

IN PROCENTEN (Proportioneel) De tabel neemt een bepaald percentage in van het totale scherm. In dit geval zal de gebruiker de hele tabel steeds kunnen zien, maar heb jij geen vat op de exacte breedte van de tabel. Een gebruiker met een scherm met hoge resolutie zal een bredere tabel krijgen (wat vaak overzichtelijker is) dan een gebruiker met een scherm met lage resolutie. De breedte van elke cel in de tabel is gelijk (zolang er enkel tekst in de cellen staat).

-

IN PIXELS (Absoluut)

De tabel is steeds - op eender welk scherm - even breed. Daardoor kan je de vorm en inhoud veel beter in de hand houden. Hou er wel rekening mee dat een groot deel van de surfers nog steeds een scherm heeft met een resolutie van 640x480. Daardoor is het af te raden om de breedte van een tabel breder te maken dan 630 pixels. Doe je het toch, dan zullen bepaalde gebruikers horizontaal moeten scrollen, wat niet in dank zal worden afgenomen. Tip

In plaats van de gehele tabel afmetingen mee te geven, kan je vaak beter elke kolom afzonderlijk een bepaalde breedte meegeven. Sommige kolommen krijgen dan een vaste breedte, andere een proportionele. Voor het vak HOOGTE OPGEVEN gelden dezelfde opmerkingen, al zal je dit vak heel wat minder gebruiken. © Hans De Four 2000-2003

62

Een site bouwen

§2

met

FrontPage 2000

Randen

1. Dikte De tabelrand bestaat uit de buitenrand van de tabel en de alle binnenranden. Standaard staat de dikte van deze randen op 1 pixel. Buitenranden kunnen echter elke waarde aannemen. Binnenranden kunnen enkel 0 of 1 pixel dik zijn. Zet je de dikte op 0, dan worden de randen in FrontPage als puntlijnen weergegeven (om het werken met de tabel te vergemakkelijken), maar in je browser zie je ze niet. Dit is zeer handig om alle objecten op je webpagina te schikken. De gebruiker kan niet merken dat de webpagina is samengesteld met behulp van tabellen. Soms is een rand wél fraai en gewenst. Vul dan een waarde groter dan 0 in. Deze waarde heeft enkel effect hebben op de breedte van de buitenrand. Als de randdikte niet 0 is, zijn de binnenranden immers steeds 1 pixel breed. Voorbeeld: Een randdikte van 20 zorgt voor een buitenrand die 20 pixels breed is, terwijl de binnenranden 1 pixel breed zullen zijn.

2. Kleur

!NIEUW!

Je kan de rand van een tabel een kleur geven. Deze mogelijkheid wordt echter enkel ondersteund door recente browsers. Je hebt twee mogelijkheden: -

Een platte tabel met effen randen. Kies een kleur uit de keuzelijst KLEUR. Laat de vakken LICHTE en DONKERE RAND op AUTOMATISCH staan.

RAND

-

Een 3D-tabel: Kies een kleur bij LICHTE RAND en bij DONKERE RAND en laat het vak KLEUR op AUTOMATISCH staan. Dit 3D-effect komt het best over als je de TUSSENRUIMTE CELLEN op 0 instelt.

§3

Achtergrond

!NIEUW!

De achtergrond van een tabel kan worden opgefleurd met een kleur of met een afbeelding. Deze mogelijkheid wordt echter enkel ondersteund door recente browsers.

1. Kleur Kies in het vak KLEUR de gewenste kleur.

2. Achtergrondfiguur Duid ACHTERGRONDFIGUUR GEBRUIKEN aan en klik op BLADEREN. Selecteer de gewenste afbeelding in het dialoogvenster ACHTERGRONDFIGUUR SELECTEREN. Tips

1. Kies geen al te drukke achtergrond en hou de bestandsgrootte klein. 2. De achtergrond in een tabel kan verschillen van de achtergrond van de pagina. 3. Als je een achtergrondafbeelding gebruikt, raad ik ook aan om een achtergrondkleur in dezelfde tint in te stellen. Aangezien deze kleur meteen getoond wordt, zal de gebruiker de contrasterende tekst in de tabel toch al kunnen lezen, in afwachting van het laden van de achtergrondafbeelding.

© Hans De Four 2000-2003

63

Een site bouwen

met

FrontPage 2000

Hoofdstuk 3 Werken met cellen Eén cel selecteren ¾

Hou ALT ingedrukt en klik in de te selecteren cel. OF Plaats de cursor in de te selecteren cel en kies TABEL Æ SELECTEREN Æ CEL.

Aansluitende cellen selecteren ¾

Hou ALT ingedrukt en sleep over de te selecteren cellen.

Niet-aansluitende cellen selecteren ¾

Hou CTRL+ALT ingedrukt en klik in de te selecteren cellen. Zo kan je zelfs cellen in verschillende tabellen tegelijkertijd selecteren.

Cellen splitsen 1. Plaats de cursor in de te splitsen cel of selecteer de te splitsen cellen. 2. Kies één van deze mogelijkheden: ¾

TABEL Æ CELLEN SPLITSEN

¾

Rechtsklik in de cel en kies CELLEN SPLITSEN

¾

Klik op de knop CELLEN SPLITSEN

in de werkbalk TABEL

3. Geef aan in hoeveel kolommen of rijen je de cel(len) wil splitsen. 4. Klik op OK. Cellen splitsen kan je ook door met het potloodje

een celrand te tekenen.

Cellen samenvoegen 1. Selecteer de samen te voegen cellen. 2. Kies één van deze mogelijkheden: ¾

TABEL Æ CELLEN SAMENVOEGEN

¾

Rechtsklik in de cel en kies CELLEN SAMENVOEGEN

¾

Klik op de knop CELLEN SAMENVOEGEN

Om cellen samen te voegen kan je ook de VLAKGOM bewegen.

© Hans De Four 2000-2003

in de werkbalk TABEL

over de te verwijderen celrand(en)

64

Een site bouwen

met

FrontPage 2000

Hoofdstuk 4 Celeigenschappen Naast de algemene eigenschappen voor de hele tabel kan je één of meer cellen ook specifieke kenmerken meegeven. Dit doe je als volgt: 1. Selecteer de cel(len) die je een specifieke eigenschap wil geven. 2. Kies TABEL Æ EIGENSCHAPPEN Æ CEL. OF Eén cel: Rechtsklik in de cel en kies EIGENSCHAPPEN VAN CEL. Cellen: Sneltoets ALT+ENTER. In het dialoogvenster krijg je een waaier van mogelijkheden, onderverdeeld in drie groepen: OPMAAK, RANDEN en ACHTERGROND. Je merkt dat sommige celeigenschappen ook bij de tabeleigenschappen aan bod kwamen. Onthou alvast dat de celeigenschappen een hogere prioriteit hebben dan de overeenkomstige tabeleigenschappen.

§1 Opmaak Standaard staat de tekst in een cel horizontaal links en verticaal in het midden uitgelijnd.

1. Uitlijning Bij HORIZONTAAL UITLIJNEN heb je de keuze tussen LINKS, RECHTS, CENTREREN of UITVULLEN. Bij VERTICAAL UITLIJNEN heb je de keuze tussen BOVEN, MIDDEN, ONDER of BASISLIJN. De eerste drie opties bij HORIZONTAAL UITLIJNEN kan je ook bereiken via de werkbalk OPMAAK:

.

De eerste drie opties bij VERTICAAL UITLIJNEN kan je ook bereiken via de werkbalk TABEL:

.

2. Breedte en hoogte Wanneer je een of meerdere cellen een bepaalde breedte wil geven, hou dan rekening met de haalbaarheid en met de breedte-instelling die je hebt gegeven aan de tabel. Geef je een celbreedte op in procenten, dan zal de cel een bepaald percentage innemen van de tabel. Je kan de kolombreedte of de rijhoogte ook wijzigen door op een celrand te gaan staan en te slepen met de dubbele pijl. Wil je de rijen of kolommen gelijkmatig verdelen in de tabel, selecteer dan die rijen of kolommen en of KOLOMMEN GELIJKMATIG VERDELEN . klik op de knop RIJEN GELIJKMATIG VERDELEN Wil je de afmetingen van kolommen en rijen aanpassen aan de inhoud, klik dan in de tabel en klik daarna op de knop AUTOAANPASSEN . Deze knoppen of opdrachten vind je zowel in de werkbalk als in de menu TABEL. © Hans De Four 2000-2003

65

Een site bouwen

met

FrontPage 2000

3. Andere CEL MET KOPTEKST aankruisen zorgt ervoor dat de tekst in de cel automatisch gecentreerd en in het vet komt te staan. Handig voor titelcellen. GEEN OMLOOP aankruisen zorgt ervoor dat de tekst in een cel niet automatisch op een volgende regel verder gaat. De celbreedte zal worden aangepast aan de tekst in de cel. Deze optie heeft enkel effect als de breedte van de cel procentueel of in pixels wordt opgegeven en zorgt vaak voor verwarrende toestanden.

§2 Randen Je kan elke cel een eigen randkleur (zelfs een 3D-effect m.b.v. LICHTE RAND en DONKERE RAND) geven. Deze kleuren vallen echter niet zo op, aangezien een celrand maximaal 1 pixel dik kan zijn.

§3 Achtergrond Je kan elke cel een andere achtergrondkleur of – afbeelding geven. Een achtergrondkleur geven kan in de werkbalk TABEL. heel snel door te klikken op het pijltje naast de knop OPVULKLEUR

© Hans De Four 2000-2003

66

Een site bouwen

met

FrontPage 2000

Hoofdstuk 5 Werken met rijen en kolommen Rij selecteren ¾

Hou de muispijl links van de rij en klik als de volle zwarte pijl verschijnt (Sleep verticaal om meer rijen te selecteren). OF Plaats de cursor in de te selecteren rij en kies TABEL Æ SELECTEREN Æ RIJ.

Kolom selecteren ¾

Hou de muispijl boven de kolom en klik als de volle zwarte pijl verschijnt (Sleep horizontaal om meer kolommen te selecteren). OF Plaats de cursor in de te selecteren kolom en kies TABEL Æ SELECTEREN Æ KOLOM.

Selecteren kan ook door te klikken in combinatie met het ingedrukt houden van de CTRL-, ALT-, en/of SHIFT-toets. Probeer zelf! Rij(en) invoegen 1. Plaats de cursor ergens in een rij onder de in te voegen rij. 2. Klik op de knop RIJEN INVOEGEN

in de werkbalk TABEL.

Kolom(men) invoegen 1. Plaats de cursor ergens in een kolom rechts naast de in te voegen kolom. 2. Klik op de knop KOLOMMEN INVOEGEN

in de werkbalk TABEL.

Het invoegen van rijen of kolommen kan ook via TABEL Æ INVOEGEN Æ RIJEN OF KOLOMMEN. Het dialoogvenster Rijen of kolommen invoegen wordt dan getoond.

Duid hierin de gewenste instellingen aan. Rij(en) of kolom(men) verwijderen 1. Selecteer de rij(en) of kolom(men). 2. Klik op de knop CELLEN VERWIJDEREN in de werkbalk TABEL. (Door op DELETE te drukken, verwijder je enkel de inhoud.) Bijschrift invoegen Een bijschrift is een beschrijvend stukje tekst dat zich ne boven of net onder de tabel bevindt. 1. Kies TABEL Æ INVOEGEN Æ BIJSCHRIFT. De cursor springt naar een lege ruimte boven de tabel. 2. Tik de tekst in voor het bijschrift. Via TABEL Æ EIGENSCHAPPEN Æ BIJSCHRIFT kan je daarna bepalen of het bijschrift onderaan of bovenaan de tabel moet worden ingevoegd.

© Hans De Four 2000-2003

67

DEEL 1

Kennismaking...................................................................... 2

Hoofdstuk 1

FrontPage 2000 starten .............................................................................................. 2

Hoofdstuk 2

De interface ................................................................................................................. 2

Hoofdstuk 3

De interface aanpassen .............................................................................................. 3

Hoofdstuk 4

FrontPage 2000 sluiten ............................................................................................... 4

Hoofdstuk 5

Menu Venster .............................................................................................................. 4

Hoofdstuk 6

Menu Help ................................................................................................................... 4

Hoofdstuk 7

De zes weergaven....................................................................................................... 5

DEEL 2

Paginabeheer..................................................................... 10

Hoofdstuk 1

Een nieuwe pagina.................................................................................................... 10

Hoofdstuk 2

Een pagina openen ................................................................................................... 10

Hoofdstuk 3

Een pagina opslaan................................................................................................... 11

Hoofdstuk 4

Een pagina afdrukken ............................................................................................... 13

Hoofdstuk 5

Een pagina sluiten..................................................................................................... 13

Hoofdstuk 6

Een pagina verwijderen, verplaatsen, kopiëren ........................................................ 13

Hoofdstuk 7

Documenten converteren naar webpagina’s ............................................................ 13

Hoofdstuk 8

Paginavoorbeeld ....................................................................................................... 15

DEEL 3

Webbeheer......................................................................... 16

Hoofdstuk 1

Een nieuw web .......................................................................................................... 16

Hoofdstuk 2

Een bestaand web importeren .................................................................................. 17

Hoofdstuk 3

Een web openen ....................................................................................................... 18

Hoofdstuk 4

Een web publiceren................................................................................................... 18

Hoofdstuk 5

Een web verwijderen ................................................................................................. 19

DEEL 4

Tekstopmaak ..................................................................... 20

Hoofdstuk 1

Hulpmiddelen ............................................................................................................ 20

Hoofdstuk 2

Compatibiliteit............................................................................................................ 22

Hoofdstuk 3

Kleur en Paginaopmaak............................................................................................ 23

Hoofdstuk 4

Opmaak van alinea ................................................................................................... 26

Hoofdstuk 5

Opmaak van tekst ..................................................................................................... 30

Hoofdstuk 6

Extra’s ....................................................................................................................... 35

DEEL 5

Hyperlinks.......................................................................... 37

Hoofdstuk 1

Interne hyperlinks ...................................................................................................... 38

Hoofdstuk 2

Externe hyperlinks..................................................................................................... 39

Hoofdstuk 3

Bladwijzers ................................................................................................................ 39

Hoofdstuk 4

E-mailadressen ......................................................................................................... 40

Hoofdstuk 5

Bestanden ................................................................................................................. 40

Hoofdstuk 6

Extra’s ....................................................................................................................... 41

Hoofdstuk 7

Gemeenschappelijke randen .................................................................................... 43

Hoofdstuk 8

Navigatiebalken......................................................................................................... 44

DEEL 6

Afbeeldingen ..................................................................... 46

Hoofdstuk 1

Soorten afbeeldingen ................................................................................................ 46

Hoofdstuk 2

Afbeeldingen bekijken ............................................................................................... 47

Hoofdstuk 3

Afbeeldingen invoegen en verwijderen ..................................................................... 49

Hoofdstuk 4

Afbeeldingseigenschappen ....................................................................................... 52

Hoofdstuk 5

Afbeeldingen bewerken............................................................................................. 55

Hoofdstuk 6

Imagemaps maken.................................................................................................... 57

Hoofdstuk 7

Achtergronden invoegen ........................................................................................... 59

DEEL 7

Tabellen.............................................................................. 60

Hoofdstuk 1

Werken met tabellen ................................................................................................. 60

Hoofdstuk 2

Tabeleigenschappen ................................................................................................. 61

Hoofdstuk 3

Werken met cellen..................................................................................................... 64

Hoofdstuk 4

Celeigenschappen..................................................................................................... 65

Hoofdstuk 5

Werken met rijen en kolommen ................................................................................ 67