Category Archives: HTML5
HTML EMail Coding: How to create an HTML email from scratch (Tricks and Tips) – Part 1
You know, some time ago, one of my clients asked me to make an email ad. “No problem” – I said, and made an HTML page with CSS, DIV and with validated XHTML 1.0 code. Then I put the whole thing into Outlook Express, emailed it to myself and got shocked! It looked nothing like the HTML page I just made.
I cruised the web for solutions and suggestions and I managed to find really good information regarding it; however, I could not find a detailed guide for it.
I cannot put all I’ve learned in 1 post, since it takes too much time, and I’ve been trying to do it and notice that it only slowed down my postings. So I’ll start little by little giving you some idea about how to code and HTML email.
So, let’s create an HTML email from scratch. There is a whole new HTML coding way for that.
So, now, here’s how it should be done:
1. Head Section
Just as a regular HTML page. You can change it to XHTML 1.0 validation and keywords and description <meta> if you’d like.
<!--DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Your Title</title>
</head>
2. Body Section – not like a regular HTML or XHTML.
– Don’t use DIVs – some EMail clients just erase them, use good old TABLES.
– Do not set a background image, it will not work either.
– Use <bgcolor> for specifying the background color instead of anything else. For example, it should be “bgcolor=”#000000” rather than CSS styling. And do not shorten the colors like this: #000. Instead use the full color code #000000.
– Do not use email width larger than 640px if you can. Notice how Yahoo or Hotmail shrink the email field by putting their menu on the left and advertising on the right.
<body> <!-- Wrapper --> <table cellpadding="0" cellspacing="0" border="0" bgcolor="#FFFFFF" width="640" align="center"> <tr> <td>Sample text</td> </tr> </table> <!-- Wrapper ends --> </body> </html>
Stay Tuned! More details coming soon!
What Stands On The Way Of Progress of HTML5 and CSS3
I’ll tell you what. It’s quite simple. We, web developers, still have to deal with IE5, IE6, Netscape, Firefox 1.x and so on. What progress are we talking about if we are still in the year 2000. Once we refuse to support all old web browsers, we will encourage the users to finally upgrade. Once we stop feeding them the content for their old unprotected and unsupported browsers, only then the users will feel that they have no choice but to upgrade. Only then we’ll stop wasting time on IE bugs, workarounds and use it on something more useful.
Flash vs XHTML+JavaScript Libraries
The other day, I was working on a banner for one of my clients, and watching my great Flash animation flow made me think about all the hate for Flash and social relief that brought JQuery and Mootools… As a graphic designer and web developer, I must say that Flash is an amazing platform! I use it since it was still Macromedia’s Flash 4.0. It was before Adobe bought it for $3.4 billion (adobe.com) (just to compare, Google paid for Youtube $1.65 billion (techcrunch.com)). My point is that it was a rather huge investment, but it definitely paid off since Flash is now everywhere. Is Flash perfect? No! Of course not! But if you show me another animating software that can do what Flash does, produces lightweight files that are supported by most browsers, I would be delighted.
JavaScript Libraries are definitely a great creation. I love how clean and simple it is. But let’s be realistic – can we really replace Flash with them? For example, can you make realistic clouds that run non-stop through your screen in 150 different colors using them? GIF you say? Imagine how big the file size is going to be. However, I am impressed with what designers and programmers do with JQuery and other Libraries. Sometimes, I cannot tell whether it’s Flash or not. I always right-click the field to see “Flash or not”. Nowadays, mostly not.
I strongly believe that abandoning Flash, we will limit our creativity. If used moderately and professionally, Flash will only make your work more fascinating to look at. There is no need of having a website fully made in Flash – Search Engine optimizer’s nightmare… I can’t even scroll with a mouse wheel through a page… I have to drag some small pointer to see what’s written below… Super annoying. However, the animation part, the colors, the effects – it’s amazing what Flash can do! Great banners, awesome menus. Often, I go WOW when I see some things that designers made with it. For example, I especially like how creatively OK!nteractif made this section of a website for Musee de la Civilisation (Quebec). Also, I like this class of rotating objects – outstanding job! You can make such a cool animation with this technique. By saying NO to Flash, we actually make a big giant step back. Think about it Apple… Your iPad kills creative process! No matter how you feel about Abobe, you should encourage creativity, not drawing it back. If you are so smart, create a non-buggy Flash-like software and make your QuickTime support it.
I stand for a “Reasonable Freedom.” If Flash can make your work more beautiful, but not overload my computer, I say use it with backup JPG image for platforms that do not support it.
– Edited on 10-22-2010 by Nookeen
Nookeen's WP Blog 