Hoe maak je een hyperlink met KompoZer

De mogelijkheid om een ​​link te maken in een document dat je naar een ander document brengt, misschien op een netwerk halverwege de hele wereld, is misschien wel de belangrijkste reden dat het World Wide Web is uitgevonden. Deze links, genaamd hyperlinks, zijn de "H" in HTML (HyperText Markup Language). Zonder hyperlinks zou het web niet erg nuttig zijn. Er zouden geen zoekmachines, sociale media of banneradvertenties zijn (ok, de meesten van ons zouden kunnen opstaan ​​om die te zien gaan).

Wanneer u uw eigen webpagina's maakt, wilt u hyperlinks maken en heeft KompoZer hulpmiddelen waarmee u eenvoudig links van elk type kunt toevoegen. De voorbeeldpagina die in deze zelfstudie wordt weergegeven, bevat links naar andere websites in vier categorieën, naar andere delen van dezelfde webpagina en om een ​​e-mailbericht te starten. Ik begin met een kop en vier

H3 rubrieken voor elke categorie. Op de volgende pagina zullen we enkele links toevoegen. 01 van 05

Een hyperlink maken met KompoZer

De hyperlinkhulpmiddelen van KompoZer kunnen worden geopend door op de knop Koppelingen op de werkbalk te klikken. Om een ​​hyperlink te maken:

1. Plaats uw cursor op de pagina waar u uw hyperlink wilt weergeven.
2. Klik op de knop Koppelen op de werkbalk. Het dialoogvenster Link Properties verschijnt.
3. Het eerste veld dat u moet invullen, is het vak Linktekst. Typ de tekst die u op de pagina wilt plaatsen voor uw hyperlink.
4. Het tweede veld dat u moet invullen, is het vak Koppelingslocatie. Typ de URL van de pagina die uw hyperlink de gebruiker zal geven wanneer erop wordt geklikt. Het is een goed idee om de URL van de adresbalk van uw browser te kopiëren en te plakken. U maakt op deze manier veel minder snel een fout en u weet, tenminste op het moment dat uw link wordt aangemaakt, dat de pagina in leven is en die link niet verbroken is.
5. Klik op OK en het dialoogvenster Koppelingseigenschappen wordt gesloten. Uw link verschijnt nu op uw pagina.

In de meeste browsers verschijnt de hyperlink standaard in blauwe onderstreepte tekst. U kunt uw eigen stijlen toepassen op hyperlinks met KompoZer, maar voorlopig houden we vast aan de standaard hyperlink. Het is een goed idee om een ​​voorbeeld van uw pagina in een webbrowser te bekijken en op de koppelingen te klikken om te controleren of ze werken.

02 van 05

Een ankerlink maken met KompoZer

Er is een ander soort hyperlink waarmee u naar een ander deel van dezelfde webpagina kunt gaan wanneer u erop klikt. Dit soort hyperlink wordt een ankerkoppeling genoemd en het gebied van de pagina waarheen u wordt geleid wanneer u op die koppeling klikt, wordt het anker genoemd. Als u ooit de koppeling "Terug naar boven" onderaan een webpagina hebt gebruikt, klikt u op een koppeling naar een anker.

Met KompoZer kunt u ankers maken waarnaar u kunt linken met behulp van het hulpmiddel Anker op de werkbalk.

1. Klik op het gebied van uw pagina waar u een anker wilt. Dat wil zeggen, waar u wilt dat de pageviewer wordt gebruikt wanneer op een ankerlink wordt geklikt. Voor dit voorbeeld heb ik net voor de 'F' in de kop Favoriete muziek geklikt.
2. Klik op de knop Anker op de werkbalk. Het dialoogvenster Eigenschappen van benoemde verankering wordt weergegeven.
3. Elk anker op een pagina heeft een unieke naam nodig. Voor dit anker heb ik de naam "muziek" gebruikt.
4. Klik op OK en u zou moeten zien, en het ankersymbool verschijnt op de plek waar u het anker wilde hebben. Dit symbool verschijnt niet op uw webpagina, het is net hoe KompoZer u laat zien waar uw ankers zijn.
5. Herhaal de procedure voor alle andere gedeelten van de pagina waar u wilt dat gebruikers naartoe kunnen springen. Als u veel tekst op de pagina hebt, gescheiden door koppen of een andere logische scheidingslijn, zijn ankers een eenvoudige manier om een ​​pagina te navigeren.

Vervolgens maken we de koppelingen die de lezer meenemen naar de ankers die u hebt gemaakt.

03 of 05

De paginanavigatie met KompoZer maken

Nu u ankers op uw pagina heeft staan, laten we de koppelingen maken die worden gebruikt als snelkoppelingen naar die ankers. Voor deze zelfstudie heb ik een tabel met 1 rij en 4 kolommen gemaakt onder de bovenste kop van de pagina. Elke tabelcel bevat dezelfde tekst als een van de categoriekopteksten die worden gebruikt om de links op de pagina van elkaar te scheiden. We zullen de tekst in elk van deze tabelcellen een link naar het overeenkomstige anker maken.

04 van 05

Hyperlinks maken naar ankers met KompoZer

Nu we onze ankers op hun plaats hebben en de tekst die we zullen gebruiken voor het invoeren van paginanavigatie, kunnen we die gewone tekstblokjes omzetten in koppelingen. We zullen de Link-knop opnieuw gebruiken, maar deze keer zal het een beetje anders werken.

1. Selecteer de tekst die u in een koppeling wilt veranderen. In dit voorbeeld heb ik de tekst 'Favoriete muziek' geselecteerd die zich in de eerste tabelcel boven aan de pagina bevindt.
2. Klik op de knop Koppelen op de werkbalk. Het dialoogvenster Koppelingseigenschappen wordt geopend.
3. In dit geval hebben we tekst geselecteerd voordat we op de knop Koppeling klikten, dus het gedeelte Tekst koppelen van het venster is al ingevuld en kan niet worden bewerkt. Klik op de pijl-omlaag in het gedeelte Koppelingslocatie. U ziet een lijst met de ankers die u in de vorige stappen hebt gemaakt. Voor dit voorbeeld selecteer ik het #music-anker.
4. Klik OK. De tekst "Favoriete muziek" in de navigatiebalk verandert in een koppeling waardoor de kijker naar die sectie op de pagina springt wanneer erop wordt geklikt.

U zult opmerken dat elk benoemd anker in het vervolgkeuzemenu een "#" -teken ervoor heeft. Dit is hoe je een link naar een anker in HTML zou maken. De "#" voor de ankernaam vertelt de browser dat deze link je naar een andere plaats op dezelfde pagina brengt.

05 of 05

Een hyperlink maken vanuit een afbeelding met KompoZer

Wist je dat je zowel vanuit afbeeldingen als tekst een link kunt maken? Met KompoZer kunt u dit doen met slechts een paar klikken. Hier heb ik een klein pictogramafbeelding geplaatst met een naar boven wijzende pijl en de tekst "TOP" aan de onderkant van de pagina. Ik ga deze afbeelding gebruiken als een link om terug te gaan naar de bovenkant van de pagina.

1. Klik met de rechtermuisknop op een afbeelding en kies Eigenschappen afbeelding en koppeling uit het contextlabel. Het dialoogvenster Afbeeldingseigenschappen wordt geopend.
2. Op het tabblad Locatie ziet u de bestandsnaam van de afbeelding en een miniatuurweergave al ingevuld. U moet wat tekst invoeren in het tekstvak Alternatief. Dit is wat verschijnt als u met uw muis over de afbeelding beweegt, en ook wat wordt gelezen door een schermlezer wanneer een persoon met een visuele beperking de webpagina leest.
3. Klik op het tabblad Koppeling. Hier kunt u een anker uit het menu kiezen, net als bij de ankerlinks. In feite wordt deze afbeelding gebruikt als een ankerlink. Ik heb het #Links_Of_Interest-anker geselecteerd dat ons terug naar de top zal brengen.
4. Klik OK. De afbeelding wordt nu gekoppeld aan de bovenkant van de pagina wanneer erop wordt geklikt.