How to look good in any browser - 2

In my last post , How to look good in any browser - 1, I listed out three simple things you can do to improve the quality of your blog. In case you get some errors in the first validation below are some common errors and how to overcome them. Most of these are simple things that anyone can fix and some of them require a little bit of work but the effort is worth it because in the end you get a high quality fast loading blog.

Tags not properly closed

This is one of the most common errors I found in my theme and one of the easiest to fix as well. This happens for tags like <img> and <br> where you don’t necessarily have to close them to work.

eg -

<img src=”rumbling/images/feed.gif” alt=”feeds” width=”70″ height=”25″> ( wrong )

<img src=”rumbling/images/feed.gif” alt=”feeds” width=”70″ height=”25″/> ( correct )

Unencoded ampersands(’&’) sign used in url’s

Another easy to fix error. This is a problem I found in many widgets like MyBlogLog widget and the RevResponse resource center widget. Although its very easy to fix it can be a headache if you have lots of plugin’s with url’s pointing to different locations. All you have to do is instead of just using & sign used the fully qualified syntax &

eg -

data=”"http://rumbling=rumblinglankan&color1″ ( wrong )

data=”"http://rumbling=rumblinglankan&amp;color1″ ( correct )

Usage of flash or flash widgets

This is not so easy to fix but there are plenty of tutorials out there which gives you all the steps you need to present your flash widgets in the standard way. If you are using the RevResponse and using the flash widget to show it in your blog then you will have some trouble validating your blog. The problem with there flash widget is they use the <embed> tag which is not valid XHTML transitional. But don’t worry you can display the same thing in a more efficient manner while making your blog XHTML transitional. I’ll show the code before and after the validations so you can see for yourself how this can improve your efficiency.

Before

<object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase=”http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0″ width=”160″ height=”300″ id=”color test” align=”middle”><param name=”allowScriptAccess” value=”sameDomain”/><param name=”wmode” value=”transparent”/><param name=”movie” value=”http://img.tradepub.com/images/bimages/160×300catselect_scroll.swf?ptnr=rumblinglankan&color1=0CB204&color2=80F342&textcolor=FFFFFF&lcolor1=0CB204&cat=&catnum=0″ /><param name=”quality” value=”high” /><param name=”bgcolor” value=”#ffffff” /><embed src=”http://img.tradepub.com/images/bimages/160×300catselect_scroll.swf?ptnr=rumblinglankan&color1=0CB204&color2=80F342&textcolor=FFFFFF&lcolor1=0CB204&cat=&catnum=0″ quality=”high” bgcolor=”#ffffff” width=”160″ height=”300″ name=”color test” align=”middle” allowScriptAccess=”sameDomain” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” wmode=”transparent” /></object>

After

<object type=”application/x-shockwave-flash”
data=”http://img.tradepub.com/images/bimages/160×300catselect_scroll.swf?ptnr=rumblinglankan&color1=0CB204&color2=80F342&textcolor=FFFFFF&lcolor1=0CB204&cat=&catnum=0″ width=”160″ height=”300″ align=”middle” ><param name=”allowScriptAccess” value=”sameDomain”/><param name=”wmode” value=”transparent”/><param name=”movie” value=”http://img.tradepub.com/images/bimages/160×300catselect_scroll.swf?ptnr=rumblinglankan&color1=0CB204&color2=80F342&textcolor=FFFFFF&lcolor1=0CB204&cat=&catnum=0″ /><param name=”quality” value=”high” /><param name=”bgcolor” value=”#ffffff”
/></object>

As you can see its mostly the embed tag that is removed but there are some more changes as well.The technique used here is the flash satay method which is a very popular method of embedding flash widgets while keeping to the standards.The article has very comprehensive details on how to remove certain tags and clearly explains the reasons for doing that action.

Not closed <div> ,<ul> or <li> tags

Easy to fix but hard to pick errors. This is mostly got to do with improper coding of your theme. But if you are getting these kinds of error without any plug-ins then I suggest you choose another good theme. If you love your theme too much to throw it away then its best to contact the developer and ask for some clarification.Luckily for me this theme didn’t have any problems at all.

Above mentioned are some of the errors I got and the steps I took to fix them.If you got any different error feel free to share the error and if possible the solution to it in the comment section.I will update the post with errors shared in the comment section.Next post of the series will look into validation your style sheet.