HTML & CSS aloittelijoille

HTML & CSS aloittelijoille (Osa 12): Hyperlinkkien määrittely (2)

Kaikki oppaan videot HTML ja CSS aloittelijoille

Voit asettaa sähköpostiosoitteisiin hyperlinkkejä. Ennen kuin näytän, miten se toimii, muutama huomautus. Henkilökohtaisesti en ole ystävä sähköpostilinkkien kanssa. Parempi vaihtoehto ovat ennemmin lomakkeet. Jos nimittäin sähköpostisovellusta ei ole asennettu tai se ei ole määritetty nykyiselle käyttäjälle, sähköpostilinkit eivät toimi kunnolla. Loppujen lopuksi teidän on kuitenkin itse päätettävä, haluatteko käyttää sähköpostilinkkejä vai lomakkeita. Kattavammat tiedot lomakkeista seuraavat tietenkin tämän sarjan jatkossa.

Kun sähköpostilinkkiä napsautetaan, vierailijalle avautuu yleensä sähköposti-ikkuna.

HTML & CSS aloittelijoille (Osa 12): Linkkien määrittäminen (2)

Tämä ei kuitenkaan ole taattua. Käyttäjän on itse tehtävä tarvittavat asetukset. Jälleen kerran: sähköpostilinkkien ratkaisu ei siis ole ihanteellinen. Silti tällaista linkkiä voi tarvita silloin tällöin. Tässä siis syntaksi:

<a href="mailto:kontakt@psd-tutorials.de">kontakt@psd-tutorials.de</a>



Kuten näette, kyseessä on aluksi perinteinen hyperlinkki.

HTML & CSS aloittelijoille (Osa 12): Hyperlinkkien määrittely (2)

Keskittävää tässä kuitenkin on, mikä arvo annetaan href-attribuutille. Kohde alkaa aina mailto:lla, jonka jälkeen tulee kaksoispiste. Tähän liittyy haluttu sähköpostiosoite.

Kun käytätte sähköpostiviittauksia, olkaa tarkkana, mitä merkintänne siitä tulee. Parasta on aina antaa myös vielä kerran sähköpostiosoite. Näin käyttäjät, joille linkkiä napsauttamisen jälkeen ei tapahdu mitään tai sähköpostisovellusta ei avaudu, voivat kopioida osoitteen ja lähettää teille sähköpostiviestin.

Kun määritätte sähköpostilinkkejä, teillä on myös muita mahdollisuuksia kuin vain vastaanottajaosoitteen antaminen. Huomioikaa, että tässä kuvatut asiat eivät ole standardoituja HTML-standardeja, mutta suurimmalta osalta selaimista niitä tuetaan.

Aluksi voit suoraan määrittää Cc-vastaanottajan.

<a href="mailto:kontakt@psd-tutorials.de?cc=info@psd-tutorials.de">kontakt@psd-tutorials.de</a>



Kirjoittakaa tähän päävastaanottajan osoitteen perään kysymysmerkki. Tähän liitetään cc ja yhtäläisyysmerkki, jonka jälkeen tulisi olla osoite, johon näkyvä kopio sähköpostista lähetetään. Vaihtoehtoisesti voitte myös kirjoittaa bcc. Tässä tapauksessa annettu osoite siirtyy Bcc-kenttään, ja sähköposti lähetetään näkymättömänä kopiona kyseiseen osoitteeseen.

Haluatteko antaa ennalta määritellyn aiheen, se on myös mahdollista.

<a href="mailto:kontakt@psd-tutorials.de?subject=Post%20an%20PSD-Tutorials.de">kontakt@psd-tutorials.de</a>



Kirjoitatte haluamanne aiheen perään subject. Jotta tämä toimisi, aiheessa ei pitäisi käyttää välilyöntejä tai ne tulisi erikseen maskata merkkijonolla %20.

Halutessanne voitte myös määrittää sähköpostitekstin tai osan siitä. Tähän käytetään parametria body.

<a href="mailto:kontakt@psd-tutorials.de?body=Hallo%20PSD-Tutorials.de">kontakt@psd-tutorials.de</a>



HTML & CSS aloittelijoille (osa 12): Hyperlinkkien määrittely (2)



Tässä pätevät samat asiat kuin aiemmin subject-osuuden yhteydessä kuvattuina.

Tiedostojen tarjoaminen ladattavaksi

Kun haluatte tarjota verkkosivustollanne tiedostoja ladattavaksi, voitte tehdä sen luonnollisesti. (En käsittele tässä oikeudellisia näkökohtia). Tämä on toteutettavissa erittäin helposti. Määritellään hyperlinkki ja annetaan kyseinen tiedosto kohteeksi.

<a href="buch.zip">Lataa kirjan tiedostot</a>



Tässä tapauksessa kohteena on zip-tiedosto. Kun hyperlinkkiä napsautetaan, selain yleensä tarjoaa latausvalikon tai lataa tiedoston suoraan.

HTML ja CSS aloittelijoille (Osa 12): Hyperlinkkien määrittely (2)



Sitä kautta voitte ladata tiedoston. Loppujen lopuksi selaimet kuitenkin päättävät, miten ilmoitettujen tiedostojen kanssa toimitaan.

PDF-tiedostot yleensä näytetään suoraan selaimessa, kun kyseistä linkkiä napsautetaan. Tämä on useimmissa tapauksissa varmasti hyväksyttävää. Saattaa kuitenkin olla, että haluatte tarjota PDF-tiedostoja ladattavaksi. (Tietysti käyttäjät voivat napsauttaa linkkiä hiiren oikealla painikkeella ja ladata tiedoston. Toisaalta ei pidä olettaa, että kaikki sivuston kävijät tietävät tästä mahdollisuudesta).

HTML5:ssä voitte todellakin merkitä hyperlinkit latauslinkkeinä. Tähän käytetään attribuuttia download.

<a href="ebook.pdf" download>Lataa</a>



Attribuutin varustettu linkki lataa tiedoston - olettaen aina, että selain tukee attribuuttia - lataa tiedoston.

Oletusarvoisesti tiedosto tallentuu samalla nimellä kuin alkuperäisessä tiedostossa. Tämäkin on varmasti useimmiten hyväksyttävää. Saattaa kuitenkin olla, että haluatte antaa ladatulle tiedostolle toisen nimen. Myös tämä on täysin mahdollista. Käytetään taas attribuuttia download. Tähän attribuuttiin määritellään haluttu nimi.

<a href="ebook.pdf" download="dk.pdf">Lataa</a>



Jos selain tukee tätä mahdollisuutta, se käyttää latauksessa annettua nimeä download-attribuutille.

HTML & CSS aloittelijoille (Osa 12): Hyperlinkkien määrittely (2)

Määritä loogisia suhteita

Attribuutti, joka voi olla kiinnostava liittyen hyperlinkkien määrittämiseen, on rel. Tämän attribuutin avulla voidaan ilmoittaa, millaisessa loogisessa suhteessa hyperlinkki on viittauskohde. Selaimet voisivat esimerkiksi käyttää tätä tietoa osoittimiin hiirellä hyperlinkkien päällä liikuttaessa. Tällä hetkellä ne eivät kuitenkaan tee sitä. rel-attribuutilla ei siis ole näkyviä vaikutuksia.

<a href="zwei.htm" rel="next">seuraava</a>



rel-attribuuttiin on saatavilla seuraavia arvoja:

alternate – Linkki vaihtoehtoiseen versioon dokumentista.

author – Linkki dokumentin kirjoittajaan.

bookmark – Dokumentin pysyvä kirjanmerkkilinkki.

help – Linkki ohjetiedostoon.

license – Linkki tekijänoikeustietoihin.

next – Linkki seuraavaan dokumenttiin.

nofollow – Ilmoitetaan, etteivät hakukoneet saa seurata linkkiä.

noreferrer – Selain ei lähetä HTTP-Referrer-otsikkoa.

prefetch – Dokumentti ladataan välimuistiin.

prev – Linkki edelliseen dokumenttiin.

search – Linkki dokumentin hakutyökaluun.

tag – Avainsana, joka kuvaa dokumenttia.

Tällä tavoin voidaan siis tarkemmin kuvailla viittauskohteen ja hyperlinkkien välistä suhdetta.