Hoofdstuk 3: Kennismaking met FrontPage 2000
42
3. Kennismaking met FrontPage 2000 3.1. Een eerste kennismaking 3.1.1. Doel van FrontPage Het doel van frontpage is om websites te maken. We gaan hier geen vergelijkende studie uitvoeren tussen verschillende programma’s, maar FrontPage behoort vandaag tot de uitgebreidere webauthoring programma’s. Je zal met FrontPage complexere sites sneller in elkaar kunnen steken. Vergeet echter niet dat je zelf ook nog wat moet doen. Als je concept niet goed overdacht is, dan zal je resultaat ook niet aanspreken. 3.1.2. FrontPage 2000 starten FrontPage 2000 maakt deel uit van de professionele editie van de Office 2000 suite. Je kan de snelkoppeling voor FrontPage dus op dezelfde plaats vinden als de snelkoppelingen voor Word en Excel. Wanneer FrontPage gestart is krijg je onderstaand hoofdvenster te zien.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
43
3.1.3. De onderdelen van FrontPage Aan de linkerkant van het hoofdvenster zien we de zogenaamde weergavenbalk. Deze balk geeft je snelle toegang tot zeer veel onderdelen van je site. We gaan hier later uitgebreid gebruik van maken. Aan de rechterkant van het scherm zie je een klassiek geval van Writer’s Block. Je kan je in dit deel van het venster uitleven om de meest prachtige site te maken. Voorlopig merken we hierbij op dat het rechterdeelvenster eigenlijk uit 3 delen bestaat. Je hebt immers onderaan dit deelvenster de mogelijkheid om andere weergavenvormen te bekijken. We onderscheiden hierin de normale weergave waarin we onze pagina gaan ontwerpen.
Daarnaast heb je de HTML-weergave. Dit is de eigenlijke code die gebruikt wordt om de webpagina te maken.
Merk op dat in deze weergave reeds een aantal HTML-tags geschreven zijn. Deze tags vormen de basis voor elk HTML document. Het is niet de bedoeling om de HTML-tags allemaal te bespreken in de cursus.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
44
Merk eveneens op dat wanneer we nog niets ingesteld of ingetypt hebben de HTML code reeds aangemaakt wordt. Elke handeling die we verder ondernemen zal gevolgen hebben voor de HTML-code. Wanneer deze wijzigingen voldoende groot zijn zal er verwezen worden naar de HTML-code. Uiteraard kan je zelf ingrijpen op de HTML-code. Er is echter de nodige voorzichtigheid geboden. Je kan best van de HTML-code afblijven wanneer je er niets van kent. Tenslotte kunnen we ook naar een voorbeeld van ons werk gaan kijken met het laatste tabblad. Aangezien we nog niets gemaakt hebben zal dit tabblad leeg zijn.
3.2. Bespreking van de schermonderdelen 3.2.1. De titelbalk Net als ieder programma in Windows heeft ook Microsoft FrontPage een titelbalk. In deze titelbalk vind je de naam van het programma terug. Wanneer je een Web geopend hebt, krijg je daarnaast nog de naam van het web met eventueel een locatie op de harde schijf.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
45
3.2.2. De menubalk Onder de titelbalk bevindt zich de menubalk. Ook deze balk is klassiek te noemen in de meeste Windowstoepassingen. Je zal bovendien een grote gelijkenis vinden tussen de menubalk van FrontPage en de menubalken van andere officetoepassingen.
3.2.3. De werkbalken Onder de menubalk vind je de werkbalken. Deze werkbalken hebben elk een eigen naam en een eigen bedoeling. In totaal zijn er 9 werkbalken. Hiervan worden er standaard twee getoond. 3.2.3.1 Werkbalk Standaard Normaal zie je in de normale weergave van de pagina de werkbalken Standaard en Opmaak. De werkbalk Standaard bevat alle standaard elementen zoals in Word of Excel. We gaan hier niet elk van de knoppen bespreken. We bespreken de knoppen wanneer we ze nodig hebben.
3.2.3.2 Werkbalk Opmaak Onder de werkbalk Standaard vind je de werkbalk Opmaak. De meeste knoppen in deze werkbalk zullen bekend voorkomen voor mensen die met Word en Excel kunnen werken. Ook hier gaan we niet elk van de knoppen bespreken. We bespreken de knoppen wanneer we ze nodig hebben.
3.2.3.3 De werkbalken verbergen / zichtbaar maken Je kan net zoals in elk ander programma van de Microsoft Office reeks de werkbalken onzichtbaar maken of extra werkbalken te voorschijn halen. Hiervoor kan je in het menu kiezen voor Beeld en vervolgens voor Werkbalken. Je kan dezelfde keuze krijgen wanneer je met de rechtermuisknop op één van de balken klikt. Een werkbalk die reeds zichtbaar is zal aangevinkt zijn. Een onzichtbare werkbalk zal niet aangevinkt zijn. Maak de werkbalk Tabellen zichtbaar. Sommige balken zullen niet aan de bovenkant van het scherm verschijnen. Ze kunnen eigenlijk eender waar op het scherm voorkomen. Links, rechts, boven of onder noemt men in dat opzicht ook wel eens de gedokte plaatsen. De werkbalk Tabellen zal standaard de eerste keer als zwevende werkbalk beschikbaar zijn. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
46
Je kan de werkbalken verplaatsen door ofwel de zijkant (grijpertje) vast te nemen ofwel door de blauwe bovenrand vast te nemen wanneer de werkbalk zwevend is. Versleep de werkbalk Tabellen naar de rechterkant van het scherm. Zorg dat de werkbalk verticaal komt te staan.
3.2.3.4 Aanpassen van de werkbalken Je kan zelf bepalen welke knoppen er allemaal op de werkbalken moeten staan. Hiervoor kies je in het menu voor Beeld,vervolgens voor Werkbalken en tenslotte voor Aanpassen…. In het tabblad Opties kan je een aantal schermeigenschappen instellen die te maken hebben met de knoppen op de werkbalken. Je ziet bijvoorbeeld de mogelijkheid om grote pictogrammen te tonen, maar ook de optie menu-animaties zal opvallen. Stel
de
opties
werkbalken
voor
zoals
de de
nevenstaande figuur in. In het tabblad Opdrachten kan je zelf opdrachten kiezen. Deze opdrachten kan je vanuit dit venster slepen naar de werkbalk van je keuze. Een verticale streep geeft op de werkbalk aan op welke de opdracht terecht zal komen. Sleep de opdracht Thema uit de groep Opmaak naar de werkbalk Opmaak. Als alles goed gegaan is, dan zie je in werkbalk een knop bij verschijnen. Æ Verwijder de kop die je zopas gemaakt hebt terug. Dit doe je door de knop terug te verslepen naar het venster Aanpassen.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
47
Het tabblad Werkbalken biedt verder bijna dezelfde mogelijkheden als het menu of de rechtermuisknop. Je hebt via de knop
de mogelijkheid om de originele situatie
voor de geselecteerde werkbalk terug te herstellen. Met behulp van de knop maak je zelf een nieuwe werkbalk aan die je dan ook een eigen naam kan geven. We gaan hier verder en
niet op in. De knoppen
zijn enkel beschikbaar voor zelfgemaakte werkbalken.
3.3. Een eerste eenvoudige site maken De eerste stap bij het maken van een website lijkt vaak moeilijk. In FrontPage is er echter een eenvoudig systeem aanwezig waarmee snel en op een gemakkelijke manier een complete website in elkaar gestoken kan worden. Je zal hier stap voor stap leren hoe je deze eenvoudige site kan aanpassen volgens je eigen wensen. 3.3.1. Een nieuw web maken Je kan in FrontPage op slechts één manier een volledig nieuwe website maken. In FrontPage wordt dit verder kortweg een Web genoemd. Wanneer je in het menu Bestand kiest voor Nieuw en vervolgens voor Web…, dan krijg je een aantal mogelijke vooraf gedefinieerde websites. In dit venster kan je aangeven welk soort web je wilt maken. Je hebt de keuze
uit
Web
met
één
pagina,
Klantenondersteuningsweb, Leeg web, Persoonlijk web, Projectweb, Wizard Bedrijfsweb, Wizard Discussieweb en Wizard Web Importeren. Met behulp van de knoppen
en
kan je aangeven op welke manier de lijst getoond moet worden. Verder kan je in het invoerveld opgeven waar je nieuw web moet komen. Hier wordt doorgaans een plaats op de harde schijf ingevuld. Het is echter ook mogelijk om een locatie op een bedrijfsnetwerk op te geven. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
48
Wanneer je niets opgeeft of verandert, dan zal FrontPage zelf een locatie voorstellen. Standaard is dit de locatie C:\Mijn documenten\Mijn
webs\mijnwebXXX\
waarbij XXX een nummer is dat FrontPage
invult.
Dit
nummer
vertrekt bij 1. Er is normaal geen maximum
voor
deze
nummers.
Wanneer je echter een lijst van meer dan 300 sites op deze locatie hebt staan, dan zou een iets meer zeggende naam gemakkelijker geweest zijn. Daarom dat het aan te bevelen is om zelf een locatie en een logische mappennaam op te geven. Geef als locatie voor het Web dat je gaat maken op: C:\Mijn documenten\CVO\Web X\Persoonlijk\ X staat hier voor de groep waar je toe hoort. Als
eerste
web
gaan
we
een
Persoonlijk web maken. Je kan hierin een aantal persoonlijke gegevens en voorkeuren opgeven. Kies
in
de
lijst
Persoonlijk web en klik op OK Frontpage is nu een tijdje bezig met het samenstellen van het web op de locatie die jij opgegeven hebt. Tijdens opbouwen van het web zie je een boodschap op het scherm verschijnen die aangeeft dat FrontPage bezig is. Ook aan de statusbalk onderaan kan je zien dat FrontPage allerlei dingen aan het doen is. Wanneer het opbouwen van het Persoonlijk web klaar is krijg je terug de ontwerp/normale weergave.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
49
Het lijkt alsof FrontPage weinig gedaan heeft en de lange tijd die de computer bezig was lijkt zeker niet gerechtvaardigd. Niets is echter minder waar. We kunnen op de afgebeelde pagina wel niet zien dat er heel wat veranderd is, maar in de details van het web is zeer veel reeds ingesteld. Aan de linkerkant kan je in de Weergavenbalk kiezen voor een andere weergave van het huidige web. Afhankelijk van je keuze zal je merken dat er veel gebeurd is op de achtergrond. 3.3.2. Weergave Mappen In de weergave mappen krijg je te zien welke mappen FrontPage allemaal aangemaakt heeft om jouw web goed te kunnen beheren. Het merendeel van de mappen de aangemaakt zijn is voorlopig nog niet nodig. We gaan voorlopig niet in op de details van de mappenstructuur die aangemaakt is. Het enige dat ons op dit moment interesseert is dat FrontPage voor ons een 5-tal bestanden gemaakt heeft. Deze 5 bestanden hebben alle 5 een titel gekregen. Elk bestand heeft een bepaalde bestandsgrootte en is gewijzigd op een bepaald ogenblik.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
50
In de mappenlijst kan je de verschillende deelmappen van het web aanklikken. Je krijgt dan aan de rechterkant een overzicht van datgene dat er zich in de map bevindt.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
51
Wanneer je dubbelklikt op een htm-bestand in een bepaalde map, dan wordt dit bestand geopend in de weergave Pagina. Wanneer je dubbelklikt op een ander bestand, bijvoorbeeld een gif-figuur, dan wordt een ander programma gestart. Doorgaans is dit in de Office reeks het programma Microsoft Photo Editor. Dubbelklik op een figuur om na te gaan welk programma er gestart wordt. Sluit het programma voor het bewerken van de figuur. Dubbelklik op het bestand index.htm.
De startpagina van je site wordt getoond. Je kan hier natuurlijk nog alles aan veranderen. Dat is echter voor later. 3.3.3. Weergave Rapporten Wanneer je in de Weergavenbalk kiest voor Rapporten, krijg je een overzicht van alle dingen die met de pas gemaakte site te maken hebben. Je krijgt onder andere te zien dat er in totaal 8 bestanden zijn. Dit zijn 5 htm-bestanden en 3 figuren. De totale grootte van de bestanden wordt eveneens aangegeven. De details van deze weergave en de werking van de werkbalk Rapporten die in deze weergave getoond wordt zullen we later verder bekijken.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
52
3.3.4. Weergave Navigatie In de weergave Navigatie krijg je te zien wat de logische navigatiestructuur binnen de site is. Voorlopig is dit maar een eenvoudige structuur. Wanneer je met een groter web bezig bent, dan wordt de navigatieweergave ook een heel stuk complexer. Voorlopig is enkel van belang dat je van de ene pagina naar de andere kan gaan door te dubbelklikken op de pagina van je keuze. Het minteken onder aan de Introductiepagina dient om de onderliggende pagina’s bij elkaar te groeperen in de Introductiepagina. Wanneer je de pagina’s op deze manier gegroepeerd hebt, verschijnt een plusteken in de plaats van het minteken. Door hier op te klikken worden de pagina’s weer uit elkaar gehaald. Deze functie is ook weer weinig zinvol bij het beperkt aantal pagina’s dat we nu hebben, maar eens het web gegroeid is kan je hiermee het overzicht een beetje bewaren. + teken klikken
De actieve pagina wordt aangegeven met een lichtblauwe kleur.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
53
Dubbelklik op pagina met als naam Fotoalbum om deze pagina te openen. De pagina van het Fotoalbum heeft redelijk wat gelijkenissen met de Introductiepagina. Er zijn echter ook belangrijke verschillen. Op de Introductiepagina staan er bovenaan geen grote knoppen. Deze vind je wel terug in het Fotoalbum. Later gaan we hiervoor een verklaring geven. 3.3.5. Weergave Hyperlinks Door in de Weergavenbalk te klikken op Hyperlinks krijg je een overzicht van de hyperlinks van de huidige actieve pagina. Wanneer je de voorgaande opdracht correct uitgevoerd hebt, dan worden de hyperlinks van de pagina met als bestandsnaam photo.htm weergegeven. Er wordt telkens getoond van welk pagina er een link naar de huidige pagina komt en waar de links van de huidige pagina naar toe gaan. Er zijn links vanuit de pagina’s met als bestandsnaam index.htm, interest.htm en favorite.htm. Vanuit de pagina Photo.htm, de huidige pagina dus, zijn er links naar de pagina’s met als bestandsnaam index.htm, interest.htm en favorite.htm. In dit geval zijn het dezelfde pagina’s voor beide gevallen. Dit hoeft echter niet steeds zo te zijn.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
54
Je ziet aan de linkerbovenrand van elke getoonde pagina een plusteken staan. Dit plusteken dient uiteraard om verder te gaan kijken welke de hyperlinks zijn vanuit deze pagina’s. Klik op het plusteken bij de pagina index.htm aan de linkerkant. Wanneer de pagina’s telkens naar elkaar verwijzen, zoals hier het geval, kan je eindeloos doorgaan met het klikken op plustekens. Je merkt dat telkens wanneer er op een plusteken geklikt werd er een minteken in de plaats komt. Een tak van de hyperlinks wordt bovendien gesloten wanneer een andere deeltak gekozen wordt.
Klik op het plusteken bij de pagina interest.htm aan de linkerkant.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
55
Wanneer je dubbelklikt op een bepaalde pagina, spring je naar de paginaweergave van die pagina. Dubbelklik op de pagina interest.htm (maakt niet uit welke)
3.3.6. Weergave Taken In de weergave Taken krijg je een lijst te zien van dingen die nog moeten gebeuren met dit web. Voorlopig staan er hier geen taken in. Je kan ze grotendeels zelf ingeven of laten genereren door een wizard bij het maken van het web. Voorlopig gaan we geen gebruik maken van de taken.
3.4. Een eenvoudige site bewerken Wanneer we via een wizard functie zoals Persoonlijk web een nieuw web aanmaken, dan volgen we een vooraf uitgestippelde weg. Dit kan soms vervelend zijn, maar in eerste instantie is het een gemak om op een snelle en duidelijke manier een web in elkaar te kunnen steken. In dit deel gaan we een aantal details van het gemaakte web instellen. Je maakt hierbij een persoonlijk web waarin je best gegevens plaatst die op jouw van toepassing zijn. In de cursus worden de gegevens van de auteur gebruikt. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
56
3.4.1. Tekst op een pagina ingeven Zorg dat je in de weergave Pagina bent en de pagina Interesses wordt getoond. Klik vlak voor de tekst Dit is een goede plaats om een lijst te maken van de hobby's, projecten of interesses. De tekst wordt normaal gezien geselecteerd. Wanneer een stuk tekst geselecteerd is op een pagina, dan kan je er normaal over heen typen. De eigenschappen van de tekst blijven verder onveranderd. Het lettertype, de lettergrootte en kleur blijven hetzelfde. Wanneer de tekst een hyperlink is, dan blijft de verwijzing naar de bestemming hetzelfde. Let hier op wanneer je hyperlinks wilt wijzigen. Geef als tekst Mijn hobby’s in zonder de eigenschappen van lettertype of lettergrootte te wijzigen.
Vervang de rest van de tekst op de pagina als volgt: (eigen hobby’s mogen uiteraard ook!) Interesse 1 → Tekenen Interesse 2 → Programmeren Interesse 3 → Websites maken
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
57
Vervang de tekst achter Tekenen door: Telkens wanneer er wat tijd over is of wanneer ik op een saaie vergadering een papier met potlood bij heb. De resultaten zullen we maar niet op het web zetten. Vervang de tekst achter Programmeren door: Delphi, Delphi en nog eens Delphi. Na verschillende pogingen in andere programmeertalen schiet er maar één grote liefde over. Vervang de tekst achter Websites maken door: Proberen telkens die laatste kilobyte van een figuur af te knijpen. Experimenteren in een speeltuin met als zeer toepasselijke naam Playgarden.
3.4.2. Gemeenschappelijke randen Aan de linkerkant van de pagina blijft nog een navigatiezone over. Deze zone heeft een speciale betekenis binnen automatisch gegenereerde webs in FrontPage. Op deze pagina, maar ook op andere pagina’s van dit web, heeft deze zone weinig betekenis. Je kan de weer te geven navigatiezones van een pagina instellen door het venster van de gemeenschappelijke randen op te vragen. Dit kan je doen door eender waar binnen de pagina met de rechtermuisknop te klikken. In het snelmenu dat je te zien krijgt kies je voor Gemeenschappelijke randen…. Je kan in het venster Gemeenschappelijke randen aangeven welke randen op de pagina getoond moeten worden. Bij de bovenrand en de linkerrand kan je opgeven of er A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
58
navigatieknoppen moeten staan. Verder heb je de mogelijkheid om dit systeem toe te passen op alle pagina’s van het web of alleen op deze pagina. Zet de linkerrand uit op alle pagina’s van het web. Antwoord bevestigend op de vraag of de inhoud van de randen overschreven mag worden.
3.4.3. Een
bestand
van
een
web
opslaan Een bestand opslaan kan je in FrontPage op maar liefst 3 verschillende manieren. Je kan in het menu Bestand te kiezen voor Opslaan. Daarnaast heb je ook de toetsencombinatie Control + S of de knop
in de werkbalk Standaard om de huidige pagina te bewaren.
Bewaar de huidige wijzigingen van de pagina
Zolang een bestand niet bewaard is kan je in het menu Venster achter de bestandsnaam een * zien. Wanneer een web niet reageert zoals je zou verwachten, dan kan dat wel eens als oorzaak hebben dat niet al de bestanden bewaard zijn.
3.4.4. Eigenschappen van de navigatiebalk Op de pagina Interesses hebben we via de gemeenschappelijke randen de navigatiebalken aan de linkerkant voor alle pagina’s verborgen. Dit is ook gebeurd op de Introductiepagina. We A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
59
hebben nu geen mogelijkheid meer om van de Introductiepagina naar de andere pagina’s te navigeren. Je kan dit zien wanneer je voor de Introductiepagina de Hyperlinks opvraagt. Er kan alleen naar de Introductiepagina gesprongen worden. Je kan vanuit de Introductiepagina niet naar de rest van het web. Dit is niet echt logisch. Ga naar het bestand index.htm (de Introductiepagina) Vraag de Hyperlinks van dit bestand op.
De enige link die vertrekt van de startpagina is naar een andere site. Dat dit “toevallig” de homepage van FrontPage is zal wel niemand verbazen. Vraag de Pagina van het bestand index.htm op. Dubbelklik op de tekst [De eigenschappen van deze navigatiebalk bewerken om de hyperlinks hier weer te geven] Je kan de eigenschappen van de navigatiebalk ook terugvinden door met de rechtermuisknop op de tekst van de navigatiebalk te klikken en te kiezen voor Eigenschappen van navigatiebalk. Wanneer de tekst van de navigatiebalk geselecteerd is (1 keer op klikken), kan je ook de A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
60
toetsencombinatie Alt + Enter gebruiken. De
navigatiebalk
eigenschappen
bieden
de
mogelijkheid om een navigatie te voorzien naar verschillende niveaus. Je kan voor elke navigatiebalk instellen of de introductiepagina mee moet opgenomen worden in de navigatiebalk. Deze introductiepagina hoort dan thuis bij de Aanvullende pagina’s. Naast de logische structuur van de navigatie heb je via dit venster toegang tot de richting en vormgeving van de hyperlinks. Kies als navigatiestructuur Onderliggende pagina’s onder introductiepagina Geef aan dat de introductiepagina mee moet opgenomen worden in de aanvullende pagina’s Kies als richting Horizontaal en als vormgeving Knoppen
Ga zelf na wat de verschillen zijn van de andere instellingen voor de structuur, de aanvullende pagina’s, de richting en de vormgeving. Herhaal vorige opdracht om de situatie terug te herstellen
3.4.5. Paginavaandel instellen Elke pagina van het web dat we tot nu toe gemaakt hebben heeft een paginavaandel. De paginavaandel van de Introductiepagina heeft als weinig zeggend opschrift Introductiepagina. Je kan zelf de paginavaandel instellen. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
61
Om de paginavaandel te wijzigen kan je drie verschillende werkwijzen gebruiken: •
dubbelklikken op de paginavaandel;
•
klikken met de rechtermuisknop op de paginavaandel en uit het snelmenu Eigenschappen van paginavaandel kiezen;
•
paginavaandel selecteren en Alt + Enter gebruiken.
In al de drie gevallen krijg je hetzelfde venster waarin je kan instellen of het een paginavaandel als figuur of als tekst moet zijn. Natuurlijk kan je ook zelf een tekst ingeven. Geef als tekst voor de paginavaandel je eigen naam in. De eigenschappen laat je verder staan op Figuur. Vervang de rest van de tekst op de introductiepagina door tekst die een goed beeld geeft van de bedoeling van deze site: jezelf voorstellen.
Bewaar de pagina en ga naar de het bestand favorite.htm
3.4.6. Hyperlinks aanpassenp In de pagina Favorieten vind je verschillende hyperlinks terug. Deze hyperlinks verwijzen naar andere sites op het net. Je kan hier zelf andere links definiëren. Je moet hiervoor de bestaande tekst van de links selecteren en er overheen typen. Wijzig de tekst The Microsoft Netwerk in Playgarden
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
62
In deel 3.4.1 op bladzijde 56 hebben we reeds opgemerkt dat bij het overtypen van de tekst de eigenschappen die er zijn behouden blijven. Om de eigenschappen van de hyperlink op het scherm te tonen kan je 5 verschillende werkwijzen gebruiken: •
klik met de rechtermuisknop op de hyperlink en kies voor Eigenschappen van hyperlink;
•
selecteer de tekst van de hyperlink en kies in het menu Invoegen voor Hyperlink;
•
selecteer de tekst van de hyperlink en gebruik de toetsencombinatie Control + K;
•
selecteer de tekst van de hyperlink en gebruik de toetsencombinatie Alt + Enter;
•
selecteer de tekst van de hyperlink en klik op de knop
in de werkbalk Standaard.
Je krijgt in elk van de bovenstaande gevallen het hyperlinkvenster waarin je de locatie van de link kan ingeven. Dit kan zowel een locale link zijn als een link naar een andere site. Geef als URL op: http://www.playgarden.com/index.htm en klik op OK. Wijzig de andere twee hyperlinks ook als volgt: Tekst: Webshots
URL: http://www.webshots.com
Tekst: Winamp
URL: http://www.winamp.com
Test de drie gemaakte links uit en bewaar de pagina. 3.4.7. Hyperlinks maken Naast het aanpassen van bestaande links kan je uiteraard zelf ook links maken. Hiervoor is de werkwijze bijna hetzelfde als voor het aanpassen van links. Je bent echter voor het maken van links beperkt tot 3 verschillende werkwijzen: •
selecteer de tekst van de hyperlink en kies in het menu Invoegen voor Hyperlink;
•
selecteer de tekst van de hyperlink en gebruik de toetsencombinatie Control + K;
•
selecteer de tekst van de hyperlink en klik op de knop
in de werkbalk Standaard.
Maak van de tekst mijn interesses op de introductiepagina een hyperlink naar de pagina interest.htm Maak van de tekst mijn favoriete sites op de introductiepagina een hyperlink naar de pagina favorite.htm
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
63
Maak van de tekst klein fotoalbum op de introductiepagina een hyperlink naar de pagina photo.htm
3.4.8. Maillink Je kan naast links naar bestanden op internet of lokaal ook een maillink maken. Dit is een hyperlink waarmee het e-mailprogramma geopend wordt. Het maken van een maillink gebeurt op dezelfde manier als het maken van een link naar een pagina. In het Hyperlinkvenster moet je enkel aangeven via de knop krijgt
dan
een
nieuw
venstertje
waarin
je
dat je een maillink wilt maken. Je
de
bestemmeling van het E-mailbericht kan in ingeven. Maak van je eigen naam een maillink
naar
je
eigen
E-
mailadres. In het Hyperlinkvenster krijg je nu een speciale URL. Het woordje mailto: geeft aan dat het om een maillink gaat. Je kan uiteraard zelf de mailto: typen met daarachter je E-mailadres. Bewaar de pagina.
3.5. Details toevoegen aan de eenvoudige site De site die we tot nu toe gemaakt hebben kan niet op het net geplaatst worden. Er zijn nog een paar pagina’s waar we helemaal niets aan gewijzigd hebben. Hier gaan we dringend verandering in brengen. Om te beginnen gaan we een aantal figuren op het web gebruiken. Daarna gaan we een paar nieuwe pagina’s toevoegen aan de structuur van het web. 3.5.1. Figuren op een webpagina Om een figuur op een webpagina te plaatsen zijn er verschillende methoden. De voornaamste methode, via het menu, zal je waarschijnlijk het meest gaan gebruiken. Je kan een figuur ook via kopiëren en plakken uit een ander programma op de pagina plaatsen. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
64
Via het menu kan je kiezen voor Invoegen, vervolgens Figuur en tenslotte Uit bestand…. In het venster dat je dan bekomt kan je opgeven welke de URL van de te gebruiken figuur is. Je kan op vier verschillende manieren een URL van een figuur ingeven. •
Handmatig een URL ingeven.
•
In de mappenstructuur van het web een figuur kiezen.
•
Via de Windows Verkenner een figuur kiezen.
•
Op het internet een figuur kiezen.
Elk van deze mogelijkheden worden hier verder bekeken. 3.5.1.1 Handmatig een URL ingeven Wanneer je precies weet waar een figuur zich bevindt, kan je met de hand de locatie opgeven. Hierbij is uiteraard de nodige voorzichtigheid geboden. Vaak zal deze werkwijze leiden tot fouten. FrontPage zal dit dan ook wel op de gepaste manier melden. In de plaats van de figuur wordt dan namelijk het icoontje
weergegeven.
Ga naar de pagina met als titel Fotoalbum. Ga met de cursor achter de eerste figuur op deze pagina staan. Voeg een nieuwe figuur in en geef als URL in het daarvoor voorziene vak met da hand in: images\sunset.gif Klik tenslotte op OK.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
65
De figuur die we op deze manier toegevoegd hebben aan het web was reeds aanwezig in de mappenstructuur van het web. Wanneer we een figuur van de harde schijf willen invoegen, dan kunnen we deze rechtstreeks invoegen door de locatie op de harde schijf in te vullen. Wanneer we bijvoorbeeld de figuur storm.jpg op de harde schijf in de map C:\Mijn documenten\web\ hebben staan, dan kunnen we deze invoegen door als URL rechtstreeks in te geven: C:\Mijn documenten\web\storm.jpg Verwijder de pas toegevoegde figuur. Voeg de figuur met als naam storm.jpg via de zopas besproken methode toe aan de pagina Fotoalbum.
De ingevoegde figuur is redelijk groot. Later gaan we hier iets aan doen. Wanneer je de URL van een figuur op internet kent, kan je deze via dezelfde manier invoegen in je pagina. Wanneer je bijvoorbeeld de figuur met als naam logo.gif op de website www.playgarden.com wilt invoegen, dan kan je dit aangeven door in te geven als URL: http://www.playgarden.com/logo.gif. http:// kan je eventueel weglaten. Voor deze laatste opdracht moet je natuurlijk met internet verbonden zijn voor de wijziging te zien is in de pagina. Als je niet verbonden bent met internet, staat hier het icoontje
A. Camps
FrontPage 2000
.
Hoofdstuk 3: Kennismaking met FrontPage 2000
66
3.5.1.2 In mappenstructuur van web een figuur selecteren Je kan in het venster dat we op pagina 64 voor de eerste keer tegenkwamen ook dubbelklikken op de map images. Je krijgt dan een overzicht van alle figuren die in het web opgenomen zijn. Wanneer je een figuur selecteert en op OK klikt of wanneer je dubbelklikt op bestandsnaam van een figuur, wordt de figuur toegevoegd aan de pagina. Voeg de figuur met als bestandsnaam city.gif toe achter de figuur die je zopas ingevoegd hebt.
3.5.1.3 Via de Windows Verkenner een figuur kiezen Wanneer je in het venster Figuur op de knop klikt, krijg je een tweede methode om een figuur toe te voegen aan de pagina. Je krijgt een nieuw dialoogvenster waarin je kan aangeven welk bestand je wilt invoegen.
Voeg via de knop A. Camps
het bestand zonsondergang.jpg toe aan de pagina. FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
67
3.5.1.4 Op internet een figuur kiezen Via de knop
kan je eveneens een figuur toevoegen aan de webpagina. Er wordt eigenlijk
alleen de standaard browser geopend. Je kan dan met de rechtermuisknop op de figuur in de browser klikken en de eigenschappen van de figuur bekijken. Bij deze eigenschappen staat steeds de volledige URL van de figuur vermeld. Door deze URL te kopiëren en te plakken in het daarvoor voorziene invulvak kan je de figuur rechtstreeks van internet invoegen. 3.5.1.5 Basisinstellingen van een figuur De figuren die we tot nu toe ingevoegd hebben op de pagina zijn wat aan de grote kant. Je kan de figuren vergroten of verkleinen door eerste de figuur te selecteren en dan aan de zijkant ervan één van de blokjes die verschenen zijn te verslepen tot de figuur de gewenste grootte heeft. Over de gevorderde eigenschappen van figuren en de mogelijke instellingen die daarbij komen kijken gaan we het later in detail hebben. 3.5.2. Een illustratie invoegen Via de knop
in het venster Figuur of via menu Invoegen, vervolgens Figuur en tenslotte
Illustratie… kan je één van de vooraf gedefinieerde illustraties toevoegen aan de pagina. Het grootte voordeel van deze illustraties is dat je ze vrij mag gebruiken en dat ze reeds geoptimaliseerd zijn voor het web.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
68
Verwijder alle figuren en alle tekst (behalve het navigatiedeel en de paginavaandel) van de pagina Fotoalbum. Voeg de illustraties van de voorgaande pagina toe aan de pagina. Je vindt deze in de categorie Cartoons.
3.5.3. Nieuwe pagina toevoegen aan web De volgende stap in het uitwerken van de details van onze site is het toevoegen van een pagina aan het web. Je kan een pagina op verschillende manieren toevoegen aan het web: •
Kies in het menu voor Bestand, vervolgens voor Nieuw en tenslotte voor Pagina…;
•
Gebruik de toetsencombinatie Control + N;
•
Klik op de knop
•
Klik op het driehoekje naast de knop
in de werkbalk Standaard. in de werkbalk Standaard en kies voor Pagina.
De drie laatste methodes geven hetzelfde resultaat. Er wordt namelijk onmiddellijk een nieuwe “lege” pagina getoond.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
69
Deze nieuwe pagina bevat reeds een aantal elementen die we reeds eerder hebben besproken. Wanneer we de eerste methode (zie vorige
pagina)
hadden
hadden
toegepast,
we een venster gekregen
waarin we een keuze konden maken tussen verschillende soorten pagina’s. Voorlopig gaan we niet met deze verschillende
mogelijke
pagina’s
werken. Je bekomt hetzelfde resultaat als de andere 3 methodes door de Normale pagina aan te duiden en de OK aan te klikken. 3.5.4. Pagina in de structuur van het web opnemen Een nieuwe pagina heeft voordat we deze bewaard hebben geen logische plaats in de structuur van het web. We kunnen de pagina zelfs bewaren zonder dat deze een deel uitmaakt van de structuur van het web.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
70
Voeg een nieuwe normale pagina toe aan het web en bewaar deze pagina met als naam cv. Ga naar de navigatieweergave en maak de mappenlijst zichtbaar indien deze niet zichtbaar is. (gebruik hiervoor de knop
in de werkbalk Standaard.
Wanneer je een bestand aan de structuur van de site wilt toevoegen kan je dit het best doen door in de navigatieweergave het bestand naar de gewenste plaats te slepen. Je kan de nieuwe pagina eender waar in de structuur van het web neerzetten. Je kan de pagina boven, onder of naast een ander pagina plaatsen. Dit heeft dan als gevolg dat de pagina een buur, kind of ouder is van die andere pagina.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
71
Sleep de nieuwe pagina (met als bestandsnaam cv.htm) tussen Interesses en Fotoalbum in. (rechtse figuur hierboven) De nieuwe pagina heeft een bestandsnaam, maar er is nog geen titel toegewezen aan de pagina. Je kan dit doen door met de rechtermuisknop op de pagina in de navigatieweergave te klikken en te kiezen voor Naam wijzigen.
Wijzig de naam van de nieuwe pagina in de structuur in Curriculum. Open de pagina Curriculum en pas de gegevens aan zoals in onderstaand voorbeeld. Je mag uiteraard je eigen gegevens gebruiken. Bewaar alle bestanden en ingesloten bestanden en sluit het web wanneer je klaar bent.
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
72
3.6. Oefeningen 1.
Maak een nieuw web bestaande uit één pagina. Bewaar dit web op de locatie C:\Mijn documenten\cvo\web x\ibiza\ Voeg aan het web de volgende bestanden toe:
Pas de structuur van het web als volgt aan:
Pas eveneens de titels van de pagina’s aan. Voeg elke pagina een gemeenschappelijke rand toe met bovenaan knoppen. Bewaar het web en sluit het af.
2.
Maak een nieuw web bestaande uit één pagina. Bewaar dit web op de locatie C:\Mijn documenten\cvo\web x\kookboek\ Voeg aan het web de volgende bestanden toe:
Pas de structuur van het web als volgt aan:
Pas eveneens de titels van de pagina’s aan. Plaats op Koken, een kunst, Aperitieven, Salades, Soepen, Groenten, Vis, Vlees, Gevogelte, Dranken en Nagerechten enkel bovenaan een gemeenschappelijke rand met knoppen. A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
73
De pagina’s Voorgerechten en Hoofdgerechten krijgen bovenaan en links een gemeenschappelijke rand met knoppen. In de navigatiebalken bovenaan komt overal de Onderliggende pagina’s onder de introductiepagina. De Bovenliggende pagina wordt niet getoond. Op de pagina’s Voorgerechten en Hoofdgerechten kan je met de hyperlinks aan de linkerkant naar de lager gelegen pagina’s gaan. Bewaar het web en sluit het af.
3.
Maak een nieuw web bestaande uit één pagina. Bewaar dit web op de locatie C:\Mijn documenten\cvo\web x\computerwinkel\ Voeg aan het web de volgende bestanden toe:
Pas de structuur van het web als volgt aan:
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
74
Pas eveneens de titels van de pagina’s aan. Alle pagina’s, die minstens één pagina op een lager gelegen niveau hebben, krijgen bovenaan en links navigatieknoppen. De pagina’s die geen pagina op een lager niveau hebben krijgen enkel bovenaan een navigatiebalk. De navigatiebalk aan de linkerkant bevat, wanneer deze getoond wordt een verwijzing naar de pagina’s op het lager gelegen niveau. De navigatiebalk bovenaan geeft telkens de onderliggende pagina’s onder de introductiepagina en de introductiepagina zelf. Bewaar het web en sluit het af.
4.
Maak een nieuw web bestaande uit één pagina. Bewaar dit web op de locatie C:\Mijn documenten\cvo\web x\energie\ Voeg aan het web de volgende bestanden toe:
A. Camps
FrontPage 2000
Hoofdstuk 3: Kennismaking met FrontPage 2000
75
Pas de structuur van het web als volgt aan:
Pas eveneens de titels van de pagina’s aan. Geef de pagina’s Energie besparen in bedrijf, Elektriciteitsfactuur, Compressoren, Persluchtnet, Verwarmingstechnieken, Isolatietechnieken, K-waarde, Koeltechnieken en Good housekeeping een gemeenschappelijke bovenrand met knoppen. Geef de pagina’s Verlichting, Perslucht, Verwarming, Isolatie en Koeling een gemeenschappelijke bovenrand en linkerrand met knoppen De navigatiebalk aan de linkerkant bevat, wanneer deze getoond wordt een verwijzing naar de pagina’s op het lager gelegen niveau. De navigatiebalk bovenaan geeft telkens de onderliggende pagina’s onder de introductiepagina. Bewaar het web en sluit het af.
A. Camps
FrontPage 2000