Så här skapar du en hyperlänk med KompoZer

Möjligheten att skapa en länk i ett dokument som tar dig till ett annat dokument, kanske på ett nätverk halvvägs runt om i världen, är förmodligen den enda viktigaste orsaken till att World Wide Web har uppfunnits. Dessa länkar, som heter hyperlänkar, är "H" i HTML (HyperText Markup Language). Utan hyperlänkar skulle nätverket inte vara mycket användbart. Det skulle inte finnas några sökmotorer, sociala medier eller bannerannonser (ok, de flesta av oss kunde stå för att se dem gå).

När du skapar dina egna webbsidor, kommer du att vilja skapa hyperlänkar, och KompoZer har verktyg som gör det enkelt att lägga till länkar av vilken typ som helst. Provsidan som visas i denna handledning innehåller länkar till andra webbplatser i fyra kategorier, till andra delar av samma webbsida och för att starta ett e-postmeddelande. Jag börjar med en rubrik och fyra

H3 rubriker för varje kategori. På nästa sida lägger vi till några länkar. 01 av 05

Skapa en hyperlänk med KompoZer

KompoZers hyperlänkverktyg öppnas genom att klicka på länkknappen på verktygsfältet. Så här skapar du en hyperlänk:

Placera markören på sidan där du vill att din hyperlänk ska visas.
Klicka på länkknappen på verktygsfältet. Dialogrutan Egenskaper för länk visas.
Det första fältet du behöver fylla i är länk textrutan. Skriv in texten som du vill se på sidan för din hyperlänk.
Det andra fältet du behöver fylla i är rutan Länsläge. Skriv in webbadressen till sidan som din hyperlänk tar användaren när den klickas. Det är en bra idé att kopiera och klistra in webbadressen från adressfältet i din webbläsare. Du är mycket mindre benägna att göra ett misstag på det här sättet och du vet, åtminstone när du skapar länken, att sidan lever och den länken är inte trasig.
Klicka på OK och dialogrutan Länkaregenskaper stängs. Din länk kommer nu att visas på din sida.

På de flesta webbläsare visas hyperlänken som standard i blå understruken text. Du kan ange dina egna stilar till hyperlänkar med KompoZer, men för närvarande kommer vi att hålla fast vid den grundläggande hyperlänken. Det är en bra idé att förhandsgranska din sida i en webbläsare och klicka på länkarna för att se till att de fungerar.

02 av 05

Skapa en ankarlänk med KompoZer

Det finns en annan typ av hyperlänk som tar dig till en annan del av samma webbsida när du klickar. Denna typ av hyperlänk kallas förankringslänk, och området på sidan som du tas till när du klickar på den här länken heter ankaren. Om du någonsin använt länken "back to top" längst ner på en webbsida klickar du på en länk till ett ankare.

KompoZer låter dig skapa ankare som du kan länka till med hjälp av Anchor-verktyget på verktygsfältet.

Klicka på området på din sida där du vill ha ett ankare. Det vill säga, där du vill att sidvisaren ska tas till när en ankarlänk klickas. För det här exemplet klickade jag precis före "F" i Favoritmusikhuvudet.
Klicka på Anchor-knappen på verktygsfältet. Dialogrutan Namngivna ankringsegenskaper visas.
Varje ankare på en sida behöver ett unikt namn. För detta ankare använde jag namnet "musik".
Klicka på OK, och du bör se, och ankarsymbolen visas på den plats som du ville ha ankret. Denna symbol kommer inte att visas på din webbsida, det är bara Komposer visar dig var dina ankare är.
Upprepa proceduren för andra områden på sidan där du vill att användarna ska kunna hoppa till. Om du har mycket text på sidan separerad av rubriker eller någon annan logisk delare, är ankare ett enkelt sätt att navigera på en sida.

Därefter kommer vi att skapa länkar som tar läsaren till de ankare du skapade.

03 av 05

Skapa sidnavigering med KompoZer

Nu när du har ankar på din sida, låt oss skapa länkar som kommer att användas som genvägar till de ankare. För denna handledning skapade jag en 1 rad, 4 kolumn tabell under sidans topprubrik. Varje tabellcell innehåller samma text som en av rubrikrubrikerna som används för att separera länkarna på sidan. Vi kommer att göra texten i vart och ett av dessa tabellceller en länk till motsvarande ankare.

04 av 05

Skapa hyperlänkar till ankare med KompoZer

Nu när vi har våra ankare på plats och den text som vi ska använda för sidnavigering in, kan vi göra de här enkla textbiten till länkar. Vi kommer att använda länksknappen igen, men den här gången kommer det att fungera lite annorlunda.

Markera texten som du vill bli en länk till. I det här exemplet har jag valt texten "Favoritmusik" som ligger i den första tabellcellen längst upp på sidan.
Klicka på länkknappen på verktygsfältet. Dialogrutan Egenskaper för länk öppnas.
I det här fallet valde vi text innan vi klickade på länkknappen, så länktextdelen i fönstret är redan fylld och kan inte redigeras. Klicka på nedåtpilen i avsnittet Länsläge. Du får se en lista över de ankare som du skapade i de föregående stegen. För det här exemplet väljer jag #music ankaret.
Klicka på OK. Texten "Favoritmusik" i navigeringsfältet blir en länk som gör att tittaren hoppar till den sektionen på sidan när den klickas.

Du kommer att märka att varje namnget ankare i rullgardinsmenyn har ett "#" tecken framför det. Så här skapar du en länk till ett ankare i HTML. "#" Framför ankare namnet berättar webbläsaren att den här länken tar dig till en annan plats på samma sida.

05 av 05

Skapa en hyperlänk från en bild med KompoZer

Visste du att du kan skapa en länk från bilder såväl som text? KompoZer låter dig göra detta med bara några klick. Här har jag lagt in en liten ikonbild som visar en uppåtriktad pil och texten "TOP" längst ner på sidan. Jag ska använda den här bilden som en länk för att hoppa tillbaka till början av sidan.

Högerklicka på en bild och välj Bild och länkegenskaper från kontextetiketten. Dialogrutan Bildegenskaper öppnas.
På fliken Plats ser du filnamnet på bilden och en miniatyrvy som redan är fylld i. Du bör ange lite text i Alternativ textrutan. Det här är vad som visas när du flyttar musen över bilden, och även vad som läses av en skärmläsare när en synskadad person läser webbsidan.
Klicka på fliken Länk. Här kan du välja ett ankare från menyn, precis som vi gjorde med ankarlänkarna. Faktum är att den här bilden används som en ankarlänk. Jag valde #Links_Of_Interest ankaret som tar oss tillbaka till toppen.
Klicka på OK. Bilden kopplas nu tillbaka till början av sidan när den klickas.