Hur man skapar och skickar e-post till nyhetsbrev gratis

Det finns många betalade alternativ som tillhandahålls av många e-postleverantörer, men om du kan skicka en från din Gmail, Yahoo, Hotmail och något annat gratis e-postkonto kan du boka mer av din budget på andra objekt.

Om du letar efter bättre hanterade nyhetsbrevstjänster med verktyg för att övervaka din e-postkampanj, gå med betaltjänsten, men om du bara vill skicka ett nyhetsbrev till några vänner kommer du att älska denna handledning.

Vi hjälper dig att spara din egen nyhetsbrevsmall som en HTML-mall och börja skicka dem, med hjälp av CampaignMonitor.

Börja med e-postmall i Photoshop

Om du har en uppfattning om vad du vill ha nyhetsbrevsmall för att se ut, kan du börja jobba med Photoshop. Annars kan du hämta en mall från många gratis mallleverantörer. Det finns ingen specifik bredd och längd på en e-postmall, men för att se till att den är kompatibel och läsbar i alla e-postmeddelanden utan raster, föreslår vi att du anger breddstorlek på högst 650px. Det finns dock inga begränsningar på höjder, så parametern är upp till dig.

E-postmall

Du kan vara så kreativ som du vill med din e-postmall, men tänk på att med mer kreativa element som ingår, kommer det att bli mer arbete med att skära varje element. Mallen som vi ska använda har bara några enkla element: en rubrik, foto, rader och text, till fördel för denna guide.

Val av teckensnitt

Du kan definitivt använda vilken typ av font som helst på din Photoshop. Men om du skapar ett nyhetsbrev är det lämpligt att använda webbfonter som Times New Roman, Arial och Georgia. Annars använder du dina speciella typsnitt, men spara dem som bilder, snarare än som text.

Försök att begränsa att spara för många bilder i din mall, eftersom det bara kommer att göra det större och därmed ta längre tid att ladda.

1. Slipa din e-postmall

I den här guiden använder vi en redigerad version av gratis e-postmall av CampaignMonitor. Ladda ner det här för att följa denna handledning.

Nu när du är redo med din e-postmall, öppna den med Photoshop, välj Skär verktyg och börja skära varje element i mallen.

I denna process måste du skära varje enskilt utrymme, text, rad och bild.

När du skär en text, se till att du väljer den exakta storleken, lämna inte något extra utrymme i textområdet. För tomma utrymmen, skiv dem i en stor skiva, men skilj dem i rutor.

Nästa verktyg som du behöver använda med Photoshop är Slice Select Tool. Använd det här verktyget för att fixa varje enskilt skivat element i din mall. Se till att varje linje är ansluten, lämna inget tomt område utan att skära dem.

Med skivverktyget zoomar du in din mall och kontrollerar varje enskild skiva du skapade. Se till att varje linje är ansluten och fixerad.

Resultatet kommer att se ut så här.

2. Spara som HTML-mall

När du är redo med din skivade mall, gå till Arkiv och välj Spara för webb och enheter.

Ett fönster med spara alternativ kommer att dyka upp. Dubbelklicka först på ditt bildelement och namnge det så att du enkelt kan känna igen bildfilen när den sparas. Klick ok efter att du har namngivit dem.

Nästa i det övre högra hörnet av popup-fönstret ställer du in bildtypen som JPEG från rullgardinsmenyn. Kvaliteten kan ställas in på 60 eller 80. Om du ställer in kvaliteten till 100 kommer bildkvaliteten att vara maximal men det kommer att göra din mall tung.

Klicka nu på Spara knappen längst ner i fönstret.

Ett nytt popup-fönster kommer att visas. Här väljer du destinationen där filen ska sparas på, och ändrar sedan formatet till HTML och bilder och ställa in skivor till Alla skivor.

Därefter, under inställningar rullgardinsmenyn, välj Andra.

Ett annat popup-fönster visas under html avsnittet, se till att valen under "Formatering" är som nedan; gör samma för avsnittet "Kodning".

Nu från html rullgardinsmenyn, välj skivor, och välj Slice Output till Generera tabell och ställa in kolumnerna som följande.

Nu från skivor, gå till Spara filer på nedrullningsmenyn, gå ner till avsnittet "Optimerade filer" och kolla Lägg bilder i mapp och ange bildmappens namn. Standardbildsmappen kommer att vara "bilder". Klicka sedan 'OK'.

Om du klickar på OK kommer du tillbaka till föregående popup-fönster, klicka nu Spara.

När du har tryckt på Spara-knappen öppnar du platsmappen där du sparade filen till och du kommer att se html- och bildmappen som innehåller skivade bilder som redan sparats för din e-postmall.

Öppna .html-filen i din webbläsare, så ser du att ditt nyhetsbrev har konverterats till en HTML-mall.

3. fixa HTML, ändra textbild till webbfonter

I slutet av följande steg får du den slutliga e-postmallen i HTML-format.

Alla element i HTML-nyhetsbrevet sparas i bilder, som inkluderar all text. Nu behöver du konvertera textbilderna till webbfonter. För att göra det, öppna ".html" -filen med HTML-editoren. I det här exemplet använder jag Dreamweaver.

Klicka på rubriken och kolla på den markerade HTML-filen.

HTML kommer att vara något så här;

Ta bort varje rad som är markerad, alternativt, klicka på huvudbilden och tryck på delete. När du har raderat ser du området fyllt med standard bakgrundsfärg.

Gå nu tillbaka till Photoshop, kolla rubrikens rubrikdetaljer. Du måste få typsnittstyp, färg och storlek.

När du har fått information om teckensnittet anger du rubriktexten i rubrikens rubrikområde och innehåller också teckensnittsuppgifterna. I mitt exempel är min rubrik HTML som följer:

ABC Nyhetsbrev

HTML-linjen ovan har "stil" inkluderad. Det är här du definierar din bakgrundsfärg, teckensnittsfamilj, teckensnittstorlek samt brevavstånd. Försök fylla i textutrymmet med lämpligt brevavstånd och teckenstorlek; se till att det inte bryter din mall.

Nu behöver du repetera samma process för varje text i din mall. Se till att alla textbilder omvandlas till webbfonter och undvik onödiga bilder i HTML.

Nästa är valfri, men du kan ställa in nyhetsbrevet i centrum, lägg till justeringen i

sektion.

För att granska din sista mall öppnar du ".html" -filen i din webbläsare;

Du kan också hämta den sista mallen här för din referens.

4. Skicka HTML som nyhetsbrev via Gmail

Nu är det lite trick för att få dig att skicka din HTML-e-post direkt från Gmail. För att få det gjort måste du faktiskt ladda upp nyhetsmappen till din webbserver, men om du inte har en, kan vi få det gjort med Dropbox istället.

Använda Dropbox Public Folder

Om du registrerade ditt Dropbox-konto före 1 augusti 2012 kan du följa stegen nedan.

1. Registrera ett gratis konto med Dropbox och installera sedan appen till din dator eller Mac så att du kan hoppa över uppladdningsprocessen över webben. Låt appen ladda upp till dig.

   

2. Den e-postmall du skapade sparades i en mapp. Kopiera mappen och klistra in den i offentlig mapp som finns i din Dropbox (Dropbox> Offentlig).

   

3. Hitta nu din .html-fil i mappen, högerklicka och välj Kopiera Public Link.

   

4. När du väl har valt "Kopiera allmän länk" sparas länken i datorns minne. Klistra in den här länken i din webbläsare och öppna den som en webbsida.

   

5. Du måste kopiera innehållet i detta nyhetsbrev, så använd ditt tangentbord och tryck Ctrl + A för att välja allt och sedan Crtl + C för att kopiera hela innehållet (för Mac, använd Cmd + A för att välja allt och Cmd + C för att kopiera)

6. Öppna din Gmail, klicka Komponera För att få ett tomt email, klicka med musen i textfältet och tryck sedan på Ctrl + V för att klistra in nyhetsbrevet i fältet E-postinnehåll. Mac-användare kan trycka på Cmd + V

   

7. Ditt nyhetsbrev visas nu som ditt e-postinnehåll. Skriv in ämnet och e-postadressen och skicka ut ditt första nyhetsbrev!

Använda Site44 App

Eftersom Dropbox inte längre har Public Folder-funktion för Dropbox-användare som registrerade efter den 1 augusti 2012, kan du prova Site44, en app som gör Dropbox-mappar till webbplatser.

1. Besök Site44 och logga in med Dropbox för att komma igång.

   

2. Tillåt Site44 att ansluta till ditt Dropbox-konto. I de flesta fall måste du verifiera din e-postadress.

   

3. Klicka på "Klicka på en ny webbplats" för att starta.

   

4. I avsnittet "Använd en site44.com-domän", skriv in ditt föredragna mappnamn för den här webbplatsen i din Dropbox och klicka på "Skapa". I det här fallet använder jag "mynewsletter"som mitt mappnamn. Därefter accepterar du användarvillkoren för att fortsätta.

   

5. Nu har Site44 skapat nya mappar för webbplatsen i din Dropbox.

   

6. Kopiera newsletter.html och bildmapp som du skapade tidigare till mynewsletter.site44.com Dropbox-mappen.

   

7. Öppna webbläsaren och gå till http://mynewsletter.site44.com/newsletter.html.

   

8. Du måste kopiera innehållet i detta nyhetsbrev, så använd ditt tangentbord och tryck Ctrl + A för att välja allt och sedan Crtl + C för att kopiera hela innehållet (för Mac, använd Cmd + A för att välja allt och Cmd + C för att kopiera)

9. Öppna din Gmail, klicka Komponera För att få ett tomt email, klicka med musen i textfältet och tryck sedan på Ctrl + V för att klistra in nyhetsbrevet i fältet E-postinnehåll. Mac-användare kan trycka på Cmd + V

   

10. Ditt nyhetsbrev visas nu som ditt e-postinnehåll. Skriv in ämnet och e-postadressen och skicka ut ditt första nyhetsbrev!

Slutsats

Så länge HTML-mappen för nyhetsbrev fortfarande sparas i din Dopbox Public-mapp, kommer din mottagare att kunna se ditt nyhetsbrev korrekt, men när du har tagit bort mappen kommer länken att brytas och mottagaren kommer bara att kunna se text. Jag hoppas att du kan följa denna handledning om hur ett grundläggande HTML-nyhetsbrev kan skapas med Photoshop och sedan skickas i HTML-formulär via Gmail. Om du har andra sätt, dela med resten av våra läsare.