Hotspots

We hadden reeds gezien hoe we een koppeling maken voor een afbeelding.
Maar we kunnen deze afbeelding ook verdelen in verschillende koppelingen.
Dit noemen we hotspots.
Elke hotspot heeft zijn eigen koppeling.
Bijvoorbeeld, in onderstaande afbeelding heb ik een foto met een kaart van de Benelux in de indexpagina.
Elk land heeft zijn eigen pagina in de sitemap.
Voor elk land uit de Benelux wil ik een koppeling naar hun pagina.
Selecteer hiervoor eerst de afbeelding in de indexpagina.
Wanneer deze is geselecteerd hebben in het Eigenschappenvenster drie tekengereedschappen, en één aanwijzergereedschap.
Het eerste tekengereedschap is de “Rechthoekige hotspot”.
Het tweede tekengereedschap is de “Ovale hotspot”.
En het derde tekengereedschap is de “Veelhoek-hotspot”.
Om een Rechthoekige hotspot te tekenen selecteer het gereedschap, en klik en sleep je over de afbeelding in het document. Om deze te linken aan een pagina selecteer je de hotspot, en klik en sleep je met de knop “Wijzen naar bestand” naar het document dat je aan deze hotspot wil koppelen.
Hetzelfde doe je wanneer je een ovale hotspot wil tekenen.
Om een Veelhoekige hotspot te tekenen selecteer het gereedschap, en klik je de verschillende punten in de afbeelding. Telkens je klikt wordt er een selectiegreep (blokje) toegevoegd.

Het zwarte pijltje gebruiken we om de hotspot te verplaatsen, of door te klikken en te slepen met de selectiegrepen, aan de rand van de hotspot om deze te wijzigen.
Een tweede manier om je hotspot te verwijderen is deze te selecteren, en te klikken op de pijltjestoetsen op je toetsenbord.
Om een tweede hotspot toe te voegen moet je de eerste de-selecteren. Anders denkt Dreamweaver dat je nog steeds bezig bent met de eerste.

In het vak “Toewijzen” geef je de hotspot een naam.
In het vak “Alt” geef je een omschrijving van dat deel van de afbeelding in.
Klik de knop F12 om je pagina te bekijken in de Browser.

Benoemd anker invoegen

Een benoemd anker is een koppeling naar een specifieke locatie op een pagina.
Zo is bijvoorbeeld deze koppeling, “go back to top“, een benoemde ankerkoppeling.
We kunnen benoemde ankers toevoegen op gelijk welke plaats in de pagina, zelfs in een andere pagina.

Een benoemde ankerkoppeling bestaat uit twee delen.
Het eerste deel is het benoemd anker invoegen op de plaats in je pagina waarnaar je wil koppelen, en het tweede deel is een koppeling maken naar dit benoemd anker.

Om een benoemd anker toe te voegen plaats je eerst de cursor in het document waar je dit benoemd anker wil hebben.
Klik de knop “Benoemd anker” in het tabblad “Algemeen” van de werkbalk “Invoegen”.
Dit opent een dialoogvenstertje waar je dit benoemd anker een naam geeft.
Klik de knop OK.
Het eerste deel is al gedaan.
Nu het tweede deel.

Selecteer de tekst, of de afbeelding, in je document waarop je de koppeling wil maken.
Klik en sleep met de knop “Wijzen naar bestand” naar het zojuist geplaatste benoemde anker.
Wanneer dit anker zich op een plaats bevindt in het document dat niet zichtbaar is, hou je de cursor, terwijl je de knop “Wijzen naar bestand” ingedrukt houdt, tot bijna tegen de rand van het document.
De pagina zal automatisch beginnen scrollen.
Wanneer je aan het benoemd anker bent gekomen laat je de muisknop los.

De schrijfwijze van een benoemde ankerkoppeling is steeds de ankernaam voorafgegaan door een hekje (#)
Dus heb je geen zin om gebruik te maken van de knop “Wijzen naar bestand”, kan je simpel een hekje typen plus de naam van het anker in het vak “Koppeling”. Deze naam moet wel correct getypt zijn, anders zal de Browser deze niet kunnen vinden.

Wens je een koppeling te maken naar een benoemd anker op een andere pagina, typ je de pagina, gevolgd door het hekje en de naam van het benoemd anker. Bijvoorbeeld TV.html#LCD

Een tweede manier om een koppeling te maken naar een anker is de knop “Hyperlink” te klikken in het tabblad “Algemeen” van de werkbalk “Invoegen.
Dit opent een dialoogvenster waar je door te klikken op het naar benedenwijzend pijltje naast het vak “Koppeling” alle ankers gebruikt in deze pagina kunt selecteren.

E-mailkoppeling

De laatste koppeling die ik ga bespreken is een E-mailkoppeling.
Mochten er onder jullie nog mensen zijn die niet weten E-mailkoppeling is, wel dat is een koppeling wanneer er wordt op geklikt, het standaard email-programma geïnstalleerd op de computer van je bezoeker.

Een e-mailkoppeling kunnen we op een aantal verschillende manieren toevoegen.
Op welke manier je het ook doet, ik bedoel dan de e-mailkoppeling toevoegen, het eerste wat je moet doen is de afbeelding of tekst selecteren in je document waar je de koppeling wil toevoegen.

Een eerste manier is het tabblad “Algemeen” te selecteren in de werkbalk “Invoegen”, en te klikken op de knop E-mailkoppeling.
Dit opent het dialoogvenster E-mailkoppeling. Wat had je gedacht.
In het bovenste vak is de tekst die was geselecteerd in het document reeds ingevuld, en in het onderste vak typ je het e-mailadres.
Klik de knop Ok.
Dat was alles.

Wanneer je nu de codeweergave opent kun je zien dat een koppeling naar een e-mailadres ook in een tag wordt geplaatst. En dat het e-mailadres wordt vooraf gegaan door de tekst “mailto:”.
Onthoud dit mocht je in de toekomst je de e-mailkoppeling op de derde manier willen ingeven.

Een tweede manier om een E-mailkoppeling toe te voegen is zoals altijd eerst de tekst te selecteren, en te klikken op de knop “Invoegen” in de menubalk, en te kiezen voor E-mailkoppeling in het drop-downmenu. Dit opent hetzelfde dialoogvenster dan op de eerste manier.

De derde en laatste manier is door de tekst mailto: te typen gevolgd door het e-mailadres in het vak “Koppeling” van het Eigenschappenvenster.

Cursussen

• Downloading iPad Apps
• Lesson 1: Introduction to Publisher
• Lesson 65: File Formats