HTML-filstorlek

HTML-filstorlek är storleken på den .html-fil som faktiskt skickas. Denna filstorlek inkluderar inte storleken på de inkluderade bilderna, eftersom dessa skulle länkas från denna html-fil och laddas ner när de öppnas.

Den maximala storlek vi rekommenderar är 100 kB, eftersom allt över detta kan leda till problem med leverans och visning. Gmail kommer till exempel att klippa din html vid 102KB. Klippningen döljer slutet av ditt e-postmeddelande och kan förstöra din layout.

De flesta e-postmeddelanden bör lätt komma in under 50KB. Ibland kan dock komplexa progressiva förbättringar eller en stor mängd kampanjinnehåll resultera i en större filstorlek. Om detta inträffar finns det ett antal sätt att minska storleken på din HTML-fil.

• Clean your code. Email is constantly changing and we see a lot of templates with outdated code in them. A quick clean up can save a few KBs.

• Don’t over code. Some templates we see have extra code that simply isn’t needed. Den worst offender is adding additional table elements. Most layouts can be achieved with 5-10 tables, but we often see code with 30-40 tables. Fewer tables also has the added benefit of making your code easier to read.

• Flytta en del kod från HTML till CSS. It’s not yet safe to move all your styles to CSS, but if done correctly moving some inline styles to embedded styles can help reduce code.

• Förenkla din design. Another option is to go back till design stage. Single column emails use a lot less code.

• Minifiera din kod. Minifying code will remove unnecessary spaces and comments. This can have a huge effect but be careful as many ESPs enforce a maximum line length that could force a new line and break the code.

• 
  

Externa tillgångar Storlek

Extern tillgångsstorlek är storleken på alla dina bilder och externa stilmallar. Eftersom externa storlekar är sällsynta kommer vi att fokusera mer på bilder för tillfället.

If you’re using background images and media queries then it’s possible in certain environments not everything will be downloaded for every user. But, remember even if you define display:none;  on an <img>  element, it will still download. There is currently no way of stopping this.

Den maximala storleken för de flesta bilder är 100 kB, men om du har en stor högupplöst bild eller en animerad gif kan den gå upp till 500 kB. Det handlar dock mer om den totala storleken, som vi kommer att täcka i avsnittet om fulladdad e-poststorlek.

Det finns massor av resurser som hjälper till att komprimera bildstorlekar:

• ImageOptim – on Mac, or as a web service

• Cesium – on Windows

• CDN –  Many CDNs have image optimization built in. Some will even adjust the compression depending on the bandwidth available.

Här är några andra tips som vi rekommenderar:

• Se till att du använder det lämpligaste formatet, .jpg för foton, .gif för grafik och .png för när du behöver alfa channels

• Förenkla din design. Gå tillbaka till designstadiet och använd färre bilder, mindre bilder eller enklare bilder som kan komprimeras till mindre storlekar.

Fullt laddad E-post Storlek

Detta är den kombinerade storleken på allt när e-postmeddelandet öppnas och allt laddas ner. Detta kan variera beroende på i vilken miljö e-postmeddelandet öppnas.

Det största problemet här är den tid det tar för e-postmeddelandet att laddas. Du kommer sannolikt att testa dina e-postmeddelanden på ett kontor med en mycket snabb anslutning, men många av dina mottagare kanske använder mobila enheter med en långsam 3G-anslutning.

På en bra uppkoppling skulle ett e-postmeddelande med en total storlek på 1 MB laddas på bråkdelen av en sekund och verka omedelbart för användaren. Men på en 3G-anslutning kan det ta mellan 2 och 14 sekunder att ladda hela e-postmeddelandet. Och om din målgrupp sannolikt har en 2G-anslutning kan nedladdningen ta ett par minuter.

Detta är också ett potentiellt problem för användare med restriktiva dataabonnemang som måste ta hänsyn till varje MB de laddar ner. Detta är särskilt viktigt i utvecklingsländer.

Ett par saker du kan göra för att hjälpa till:

Firstly, look at all the recommendations we mentioned regarding html and image size optimization
If you have the time it’s always good to experiment with code and test what is really needed and what you can leave out. Experiment with images and try different ways to compress them. Make sure your email looks good and makes sense without images, so your users can start looking at your email while they wait for the images.

Att sätta ihop allt

Med filstorlekar, som med många andra saker, handlar allt om kompromisser. Du kanske gör några A/B-tester och upptäcker att stora högupplösta bilder fungerar bra. Du kanske upptäcker att mycket detaljerat innehåll fungerar bra. Du kanske upptäcker att komplex interaktivitet fungerar bra. Men när du sätter alla tre i en enda kampanj - kan du se att saker börjar prestera dåligt.