Hvordan lage HTML-e-post: trinnvis guide

E-postlister er en viktig del av markedsføringskampanjer. Opprett e-poster for dem på mange måter ligner utviklingen av enkle websider. Samtidig bør det ta hensyn til noen viktige forskjeller. Spesielt vil sende HTML-e-post være effektiv bare hvis de er laget på riktig måte i teknisk forstand, og deres innhold og stil nå målene dine. I dette tilfellet er det en oppfatning at en lekmann ikke kan takle denne oppgaven. Denne artikkelen gir detaljert trinnvise instruksjoner, hvordan du skriver og hvordan du kan sende HTML-e-post.

Funksjoner av etableringen

Det moderne mennesket mottar daglig et gjennomsnitt på 5-6, og noen ganger opptil 10 e-post. Dette betyr at du bare har mindre enn et sekund, for å ha tid til å trekke oppmerksomheten til mottakeren, før det går til lesing av følgende korrespondanse. Ellers vil sende HTML-e-post være helt ineffektiv, og du bare bortkastet tid.

En av nyanse som øker sjansene dine for å tiltrekke seg oppmerksomheten til potensielle kunder eller andre målgruppen er etableringen av korrespondanse, som er tilpasset mobile enheter. Tross alt, de fleste av dem som det er rettet til å vise e-post, sannsynligvis bruke dem oftere enn stasjonære datamaskiner og bærbare datamaskiner.

For dette formålet kan brukes, for eksempel "responsiv design" lett tilpasser seg skjermstørrelsen.

Hva bør være brevmalen

Når oppsettet av dokumentet, skal sende korrespondenter, skal oppfylle følgende krav:

• Det bør gjøres ganske smal, altså. E. I størrelse skal ikke overstige området 500-600 piksler som gir korrekt visning av tekst og annet innhold på enheter av enhver type.
• Du må bruke en stor nok skrift for all tekst informasjon samt iOS-enhet HTML-post vil være ubehagelig å lese hvis skriftstørrelsen på minst 13 piksler.
• Elementer som du kan klikke på for å gjøre, bør være stor nok og isolert fra de nærmeste lenker. I dette tilfellet, kan mottakeren lett aktivere dem på første forsøk.

trening

Før utviklingen av HTML-brevet, bør du lage en av stasjonene en ny mappe og gi den navnet, for eksempel "Nyheter". I tillegg må du laste ned og installere Dreamweaver CS3. Dette produktet fra Adobe er en ganske enkel verktøy utforming nettsider og er godt egnet for utvikling av en mailin bokstaver i HTML-format.

Opprette og lagre et dokument

Før du skriver teksten i brevet, må du:

• åpne ganske populære program-designer HTML-e-post Dreamweaver CS3 (DW);
• opprette et dokument ved å velge en type "Transition HTML 4.01»;
• lagre filen med filtypen «no.html»;
• i toppmenyen for å finne den editeringskommando;
• fjerne flåtten fra check-box "Bruk CSS i stedet for å kode HTML».

Trinnvis veiledning

Nå, la oss se hvordan å lage HTML-e-post. For å gjøre dette:

• Konsekvent åpne menyen fanen "Sett inn" og "Table" og utsette de nødvendige parametrene i tabellen. For eksempel, linjen - 2 kolonner - 1, Bredde - 700, overskriften - toppen. Grensene kan settes, og du kan gjøre uten dem, angi 0.
• Danner meldingshodet. Siden HTML-brevet ment for et større antall stønadsmottakere, så bruk operatøren [FIRST_NAME], for å erstatte navnet på ønsket mottaker.
• I nedre vinduet "Egenskaper" sette opp de nødvendige parametrene for font, størrelse og farge på tittelen tekst og bakgrunnsfarge.
• "Exit" fra header-feltet. På bunnen av skjermen for å flytte markøren salgsopsjoner "Sentrert" og "I midten".
• Sett forberedt tekstmelding eller "skrive" den rett i DW-programmet ved å velge type og skriftstørrelse, og justering av teksten på siden.

Opprette hypertekstlenker

Vi vil prøve å gjøre HTML-brevet mer profesjonelle og avanserte. Med dette målet i skjul innhold hyperkoblinger. For å gjøre dette, velger du det stedet i teksten, som ble valgt som en hyperkobling. I venstre hjørne skal være "åpne" riktig ikon og sette inn en link fra rulleboksen øverst på skjermen. I dette tilfellet, ikke glem å sette en hake i avkrysningsboksen «_blank», for å åpne lenken i et nytt vindu, og mottakeren etter at showet har ikke mistet tilgang til hoved brevet.

Hvordan sette inn bilder

Vanligvis et brev i HTML-format fullkontaktdetaljene, gjerne med et bilde av forfatteren eller relevant tematisk bildet. Den kan lastes ned fra Internett eller ved å laste ned på internett, som du vil trenge nettadressen til bildet. Dette gjøres best ved en av de gratis tjenester.

Å utstede en slik fin avslutning:

• settes inn i bunnen av meldingen, inn i en annen base tabell 3 og kolonner 0 parameter for grensepiksel;
• sette markøren i tabellen, hvor de ønsker å se på bildet;
• tegn i det nedre vinduet, "midt" og "øvre kant" for hver seksjon;
• velge fra toppmenyen fanen "Insert";
• klikker på inskripsjonen "Image" i hurtigmenyen lime inn den kopierte kontaktadresse;
• trykk «OK» to ganger.

gjennomgang

Nå som du vet hvordan du gjør HTML-brev, bør du sørge for at mottakeren vil se det i riktig form. For å oppnå dette, før du sender du ønsker å se arbeidet ditt i Dreamweaver CS3 nettleser. For å gjøre dette, klikk på ikonet med en globus i midten toppmenyen. Dersom stedet for bokstaver dukket opp på skjermen, abrakadabra, bør du sette i nettleseren din innstillingene avtokodirovku.

koding

Fra "Project" delen og gå til koden del - "Code". I vinduet som separeres og kopier alt som ligger mellom kodene og . Lagre filen. Deretter setter du inn HTML-kode.

Sende HTML-e-post

For å gjøre post åpne "Smartresponder" (SR). deretter:

• velge eller opprette en ny e-post ved å fylle ut strengen "navn" og "ta opp avsenderen."
• fylle line "tema i brevet";
• mark i øvre venstre meny HTML-kode;
• embed kode kopiert til programmet DW-kode i et stort felt "Source";
• kontrollere riktigheten av visnings hjelp av et verktøy "Oversikt";
• Sletter tekstversjonen av brevet;
• teste det for spam, ved hjelp av riktig knapp ved siden av "Send" -knappen.

Flere populære maler

Ved hjelp av et rammeverk bidrar til betydelig akselerere prosessen med å skrive og gjøre det mer tilgjengelig for utbygger, som bare har forstår det grunnleggende å lage web-dokumenter. De mest populære mønstre:

• Cerberus. Dette settet av såkalte responsive maler for å lage brev, vanligvis vises i en mobilapplikasjon Gmail og i Outlook. Den lar deg bruke HTML-kode blokker, enten alene eller ved å kombinere dem.
• Ink - høster e-post, e-post som er nesten universelle og kompatibel med alle enheter og klienter.
• Virkelig enkel HTML e-mal. Malen kan du opprette postbrev er svært enkel og rask. Men de har en veldig enkel design i form av en søyle, som trådte i en oppfordring til handling.

Hvordan sette inn HTML i en

La oss nå vurdere et litt annet problem. For å sette inn HTML-kode i en e-post, for eksempel Gmail bruker, som i eksempelet nedenfor, nettleseren Google Chrome, bør du:

• Klikk på knappen «F12», eller velg riktig sekvens av kommandoer i menyen;
• i det åpne vinduet til kundens gjeldende koden side gmail finne et sted hvor må settes inn i HTML-brev, lage et høyreklikk og velg «Rediger HTML».
• lim inn HTML-kode;
• trykker på en kombinasjon av to taster «Ctrl» og «Enter».

For samme formål kan du laste ned lett ispolzovnii Mozilla Thunderbird program. Med den kan du lage et brev, deretter velger du først "Sett inn" og deretter "HTML" og lim på adressekode.

instrumenter

Vordpressovsky e-nyhetsbrev plugin lar deg profesjonelt styre nyhetsbrev og abonnenter. Og og da, og en annen er gjort direkte gjennom WordPress admin panel. Dette forholdet gir full kontroll og helt gratis, som ikke kan, men glede seg.

Et annet enkelt verktøy - Bulletproof bakgrunnsbilder, som er et enkelt verktøy som lar deg få koden for bakgrunnsbildet skapt av bokstavene. Det kan hjelpe deg med å få korrespondanse vakrere. For registrering av brevet bør ganske enkelt inn nettadressen til bakgrunnsbildet du likte, og forbeholder oss farge, og hvorvidt disse parametrene brukes på hele kroppen av HTML-poster eller de er bare ment for en av tabellcellene. Resultatet er en ferdig kode som du ønsker å kopiere og lime inn i malen.

Nå som du vet hvordan å sende HTML-e-post. Etableringen er ikke spesielt vanskelig, spesielt hvis du bruker ferdige maler der nettet er ingen mangel. Derfor, selv de som ikke har spesielle kunnskaper kan lett takle denne oppgaven.