Muligheten til å lage en lenke i et dokument som tar deg til et annet dokument, kanskje på et nettverk halvveis rundt om i verden, er uten tvil den eneste viktigste grunnen til at World Wide Web ble oppfunnet. Disse koblingene, kalt hyperkoblinger, er "H" i HTML (HyperText Markup Language). Uten hyperkoblinger ville weben ikke være veldig nyttig. Det ville ikke være søkemotorer, sosiale medier eller bannerannonser (ok, de fleste av oss kunne stå for å se de som går).
Når du lager dine egne websider, skal du lage hyperlinks, og KompoZer har verktøy som gjør det enkelt å legge til linker av noe slag. Eksempelsiden som er vist i denne opplæringen, inneholder lenker til andre nettsteder i fire kategorier, til andre deler av samme nettside, og for å starte en e-postmelding. Jeg starter med en overskrift og fire
H3 overskrifter for hver kategori. På neste side legger vi til noen koblinger. 01 av 05
Opprette en hyperkobling med KompoZer
KompoZer's hyperkoblingsverktøy er tilgjengelig ved å klikke på Link-knappen på verktøylinjen. Slik lager du en hyperkobling:
- Plasser markøren på siden der du vil at hyperkoblingen din skal vises.
- Klikk på Link-knappen på verktøylinjen. Dialogboksen Egenskaper for Link vises.
- Det første feltet du trenger å fylle ut er Link Text-boksen. Skriv inn teksten du vil se på siden for din hyperkobling.
- Det andre feltet du må fylle ut er boksen Link Location. Skriv inn nettadressen til siden som din hyperkobling vil ta brukeren når du klikker. Det er en god ide å kopiere og lime inn nettadressen fra adresselinjen i nettleseren din. Du er mye mindre sannsynlig å gjøre en feil på denne måten, og du vet, i hvert fall når du lager koblingen din, at siden er i live, og at linken ikke er ødelagt.
- Klikk på OK, og dialogboksen Linkegenskaper lukkes. Linken din vises nå på siden din.
På de fleste nettlesere vises hyperkoblingen som standard i blå understreket tekst. Du kan bruke dine egne stiler til hyperkoblinger med KompoZer, men for nå vil vi holde fast med den grunnleggende hyperkoblingen. Det er en god ide å forhåndsvise siden din i en nettleser, og klikk på koblingene for å sikre at de fungerer.
02 av 05Opprette en Anker Link med KompoZer
Det er en annen form for hyperkobling som tar deg til en annen del av samme nettside når du klikker. Denne typen hyperkobling kalles en ankerlink, og området på siden du blir tatt til når du klikker på linken kalles ankeret. Hvis du noen gang har brukt linken "tilbake til toppen" nederst på en nettside, klikker du på en lenke til et anker.
KompoZer lar deg lage ankre som du kan koble til ved å bruke ankerverktøyet på verktøylinjen.
- Klikk på området på siden din der du vil ha et anker. Det vil si hvor du vil at sidevisningen skal bli tatt til når en ankerlink er klikket. For dette eksempelet klikket jeg like før "F" i Favorittmusikkoverskriften.
- Klikk på Anker-knappen på verktøylinjen. Dialogboksen Navngitte ankeregenskaper vises.
- Hvert anker på en side trenger et unikt navn. For dette ankeret brukte jeg navnet "musikk".
- Klikk på OK, og du bør se, og anker symbolet vises på stedet du ønsket ankeret. Dette symbolet vises ikke på din nettside, det er bare hvordan KompoZer viser deg hvor ankrene dine er.
- Gjenta prosedyren for andre områder på siden der du vil at brukere skal kunne hoppe til. Hvis du har mye tekst på siden skilt av overskrifter eller en annen logisk divider, er ankre en enkel måte å navigere på en side.
Deretter vil vi opprette koblingene som tar leseren til ankrene du har opprettet.
03 av 05Opprette sidebeskrivelsen med KompoZer
Nå som du har ankre på siden din, la oss lage koblingene som vil bli brukt som snarveier til de ankre. For denne opplæringen opprettet jeg et 1 rad, 4 kolonntabell under den øverste overskriften på siden. Hver tabellcelle inneholder samme tekst som en av kategorihodene som brukes til å skille linkene på siden. Vi vil lage teksten i hver av disse tabellcellene en lenke til det tilsvarende ankeret.
04 av 05Opprette hyperlinks til ankre med KompoZer
Nå som vi har våre ankre på plass og teksten vi skal bruke til navigering i sidene, kan vi slå de enkle tekstbitene inn i koblinger. Vi bruker Link-knappen igjen, men denne gangen vil det fungere litt annerledes.
- Velg teksten du vil omdanne til en lenke. I dette eksemplet valgte jeg teksten "Favorittmusikk" som ligger i den første tabellcellen langs toppen av siden.
- Klikk på Link-knappen på verktøylinjen. Dialogboksen Egenskaper for Link åpnes.
- I dette tilfellet valgte vi tekst før vi klikket på Link-knappen, så koblingstekstdelen av vinduet er allerede fylt ut og kan ikke redigeres. Klikk på nedpilen i delen Lenkeplassering. Du vil se en liste over ankre som du opprettet i de forrige trinnene. For dette eksempelet velger jeg #music ankeret.
- Klikk på OK. "Favorittmusikk" -teksten i navigeringslinjen blir en lenke som får seeren til å hoppe til den delen på siden når den klikkes.
Du vil legge merke til at hvert navngitt anker i rullegardinmenyen har et "#" tegn foran det. Slik lager du en lenke til et anker i HTML. "#" Foran ankernavnet forteller nettleseren at denne linken tar deg til et annet sted på samme side.
05 av 05Opprette en hyperkobling fra et bilde med KompoZer
Visste du at du kan lage en lenke fra bilder og tekst? KompoZer lar deg gjøre dette ved å bruke bare noen få klikk. Her har jeg satt inn et lite ikonbilde som viser en pil oppover og teksten "TOP" nederst på siden. Jeg skal bruke dette bildet som en lenke for å hoppe tilbake til toppen av siden.
- Høyreklikk på et bilde og velg Bilde- og lenkeegenskaper fra kontekstetiketten. Dialogboksen Egenskaper for bilde åpnes.
- På fanen Plassering vil du se filnavnet på bildet og en miniatyrbilde som allerede er fylt ut. Du bør legge inn litt tekst i tekstboksen Alternativ. Dette er det som vises når du beveger musen over bildet, og også det som leses av en skjermleser når en synshemmede leser nettsiden.
- Klikk på Link-fanen. Her kan du velge et anker fra menyen, akkurat som vi gjorde med ankerforbindelsene. Faktisk blir dette bildet brukt som en ankerlink. Jeg valgte #Links_Of_Interest ankeret som tar oss tilbake til toppen.
- Klikk på OK. Bildet kobler nå tilbake til toppen av siden når det klikkes.
