Alt Om mailto: Koblinger

0
21

Du kan lage en hage utvalg anker-lenke (<a>) åpne opp en ny e-post. La oss ta en liten reise inn i denne funksjonen. Det er ganske lett å bruke, men som med alt web, det er mange ting å vurdere.

Den grunnleggende funksjonaliteten som

<a href=”mailto:someone@yoursite.com”>kontakt Oss</a>

Det fungerer!

Men vi umiddelbart kjøre inn en håndfull av UX problemer. En av dem er som å klikke på denne linken overraskelser noen folk på en måte de ikke liker. Sorter av den samme måte å klikke på en lenke til en PDF-fil åpnes en fil i stedet for en web-side. Le sukk. Vi får til det i en bit.

“Åpne i ny fane” noen ganger gjør saken.

Hvis en bruker har sin standard e-postklient (f.eks Outlook, Apple Mail, etc.) satt opp til å være en native app, betyr det ikke egentlig rolle. De klikker på en mailto: link, at programmet åpner opp en ny e-post er opprettet, og den oppfører seg på samme måte enten du har prøvd å åpne koblingen i en ny fane eller ikke.

Men hvis en bruker har en nettleser-basert e-post-klienten er satt opp, det betyr noe. Du kan For eksempel tillate at Gmail til å være din standard e-handler på Chrome. I så fall, link oppfører seg som en hvilken som helst annen kobling, at hvis du ikke åpnes i en ny fane, side vil viderekoble til Gmail.

Jeg er litt på gjerdet om det. Jeg har veid i åpne lenker i nye faner før, men ikke spesielt om å åpne e-poster. Jeg vil si jeg lener seg litt mot å bruke target=”_blank” på e-post linker, til tross for mine følelser på å bruke det i andre scenarier.

<a href=”mailto:someone@yoursite.com” target=”_blank” rel=”noopener noreferrer”>kontakt Oss</a>

Legge til et emne og kropp

Dette er noe sjeldent å se for noen grunn, men mailto: koblinger kan definere e-post emne og kropp innhold som godt. De er bare søkeparametre!

mailto:chriscoyier@gmail.com?subject=Important!&kropp=Hi.

Legg til kopi-og blindkopi-støtte

Du kan sende til flere e-postadresser, og til og med kopi (CC), og blindkopi (BCC) til folk på e-post. Trikset er mer søkeparametre og komma-skille e-postadresser.

mailto:someone@yoursite.com?cc=someoneelse@theirsite.com,another@thatsite.com,me@mysite.com&bcc=lastperson@theirsite.com

Dette nettstedet er forferdelig hendig

mailtolink.me vil bidra til å skape e-post lenker.

Bruk en <form> for å la folk craft den første e-post

Jeg er ikke sikker på hvor nyttig dette er, men det er en interessant kuriositet at du kan gjøre en <form> gjør et FÅ, som i utgangspunktet er en redirect til en URL-adresse — og denne adressen kan være i mailto: format med spørringen params befolket av innganger! Det kan også åpnes i en ny fane.

Se Penn
Bruk en <form> for å gjøre en e-post til Chris Coyier (@chriscoyier)
på CodePen.

Folk liker ikke overraskelser

Fordi mailto: koblinger er gyldig anker-lenker som alle andre, de er vanligvis utformet akkurat det samme. Men å klikke på dem klart og tydelig gir svært ulike resultater. Det kan være verdt å indikere mailto: koblinger på en spesiell måte.

Hvis du bruker en faktisk e-post adressen som koblingen at det er sannsynligvis en god indikasjon:

<a href=”mailto:chriscoyier@gmail.com”>chriscoyier@gmail.com</a>

Eller du kan bruke CSS til å forklare med et lite emoji-historien:

[href^=”mailto:”]::etter {
innhold: “(&#x1f4e8;&#x2197;&#xfe0f;)”;
}

Hvis du virkelig misliker mailto: koblinger, det er en nettleserutvidelse for deg.

https://ihatemailto.com/

Jeg grave hvordan det ikke bare blokkere dem, men for å kopiere e-postadressen til utklippstavlen, og forteller deg det er hva det gjorde.