# Something About Email HTML

(First of all moti please cover photo pe hasna mat, khana khaane jana tha mummy bula rahi thi toh jaldi se edit karke daala hai)

Moti, patayyyyyyyyyyyyyyyyyyyyyy Email HTML kitnaa different cheej hai. Mujhe laga tha ki normal HTML ki tarah, email ka HTML bhi ham bana sakte hai. But nahiiii...

Ye example dekh ha moti...

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672938310451/3c08dab2-aebf-486e-96cb-326ea1c17e13.png align="center")

Dekh ri hai, isme sabb kuch ya toh center aligned hai, ya fir left aligned hai. And ye dekh moti, mobile view iska.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672938510914/60087d6e-c574-4d37-a594-8705c5ae33c8.jpeg align="left")

Ye dekha, thoda bhi responsive nahi hai moti.

Patay kyu?

Kyuki YE SABB TABLES KE ANDAR BANA HAI.

Ham kabhi bhi email ko normal HTML divs and spans me nahi likhte. Ham Hamesha tables use karte hai. Mai toh literally pagal ho gaya tha ye info jaan ke.

Patay Email template banana bohot hii jyada time consuming kaam hai.

Hame literally har ek cheej ko table ke andar rakh ke "INLINE STYLING" karna padtaay patay moti. 😂🤦‍♂️

Maine ek course kiya literally 4 ghante 51 min ka on "Responsive Email Design" ye wala [**plurasight**](https://www.pluralsight.com/) se.Ye URL hai [Responsive HTML Email Design](https://www.pluralsight.com/courses/responsive-html-email-design) and ye attatched photo hai moti.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672939147200/64719d6b-2282-47ed-95dc-136d9235a875.png align="center")

Maine sirf yehi nahi. Iske saath kayi saare articles padhe. Baaki sab phuddu the, bas ye 2 sexy the ...

**1\.** How to Code a Responsive Email from Scratch

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672939293392/c992ea5a-92ca-4bfc-87dd-ad28d3edee4b.png align="center")

URL: [https://litmus.com/community/learning/24-how-to-code-a-responsive-email-from-scratch](https://litmus.com/community/learning/24-how-to-code-a-responsive-email-from-scratch)

1. Creating a Future-Proof Responsive Email Without Media Queries
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672939382034/8497ed98-732f-4e93-bc89-365d3c545eb4.png align="left")
    
    URL: [https://webdesign.tutsplus.com/tutorials/creating-a-future-proof-responsive-email-without-media-queries--cms-23919](https://webdesign.tutsplus.com/tutorials/creating-a-future-proof-responsive-email-without-media-queries--cms-23919)
    

Meko ek aur ye template code mila patay, thankgod vo plurasight ke code se, jisse ki banana start kar paaya mai. Ye hai vo template code ka URL: [https://codepen.io/collection/XqrRrn](https://codepen.io/collection/XqrRrn) .

Ye dekh ke mai atleast chalu toh kar paaya. Still kaafi time consuming job hai

Patay hame &lt;td&gt; ko hii styling karna hota hai. And &lt;tbody&gt;, &lt;thead&gt; ye sab redundant hai email code me.

Mujhe patay code kidhar karna pada ye Email ka HTML? ... **Email on Acid** karke ek website hai. Vo log ke paas online email renderer hai aur 5 full device test dete hai vo log. Ye uska URL hai: [https://www.emailonacid.com/](https://www.emailonacid.com/)

Ye dekh moti...

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672940211992/1b27fe55-f295-460b-87f7-79acdec584b0.png align="center")

Isme project name and preview pic ko hide karna pada kyuki it wasn't something I wanted to keep private.

It's a great tool. Literally helped me a lot.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672940330900/71df9755-ed98-4db9-8c24-43d006eded06.png align="center")

Aisa code and preview aaju baaju me hotaay. And moti, this is not normal HTML rendering, it's EMAIL HTML rendering.

Literally jo tester log hote honge Email Template test karne wale, unki toh waat lagti rahegi na. Bhaii sexy tool hai ye, isme testing bhi ekdam easy hota hai.

Patay, ek NON Email Friendly design se start kiya tha maine, vo sab kuch kachre me daal ke chalu karna pada wapas.

Aur patay, literally koi bhi styling ya koi bhi tag use karne se pehle check karna padta tha ki EMAIL HTML Remderers vo cheej support karte hai ki nahi.

Ye website hai sexy si ... Can I Email karke (url : [https://www.caniemail.com/](https://www.caniemail.com/) )

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672940566638/c47784db-6012-48a7-8c12-0965c1d212f0.png align="center")

Yaha par har ek tag, attribute ye sab search karke code karna pada.

At last ek professional looking email HTML bana mera.

Tu saath hoti toh teko itneeeeee passionately batata na moti, te lifeless keyboard bc. Nevermind. Tere imagination se baat karke bhi thoda dil ko shaanti mil jaati hai. Chalo, khana khaane jaata hu mai. Loveya Moti. Loveya Divya. ... Lolll I really hope no one reads this.
