March 24th, 2009 by
Sunil
Couple of days back Microsoft announced Super Preview for Internet Explorer . As a web quality analyst I personally welcome this move from Microsoft. I thought we can check the projects in different browsers with in this software. I downloaded it from Microsoft even though it is available only for trail version. It has 250 MB! I decided to test something. I have opened a site with authentication (we developers, always working with authenticated site because of search engines crawling. It is not a good idea to crawl a site before it developed?). But it never opens with a site with authentication. I think this software supposed to use for web testers and web developers. But it never meets its primary objective.
So, I decided to test with some other live sites. It opened in to two panes, one with internet explorer 6 and another with internet explorer 7. Okay, I could find some differences between two panes. Good. I could easily understand something. I tried to add another browser with add image icon. It is asking for image format! May be ISO image? I am not sure. Any way I couldn’t add another browser to this software. I googled it and found that current version will not support to add new browser!
I checked with my friend who is using windows 7. Immediately he said that it doesn’t have ie6 preview.
Here in this link (http://blogs.msdn.com/xweb/archive/2009/03/18/superpreview-for-internet-explorer.aspx) you can check how funny the developer described these things as ‘known issues’.
I could not understand, what is the primary objective with this software? (It is not supporting other browsers now, other than Internet explorer). For testing Internet explorer alone we can use IETester or vitrual os or we can use desktop sharing method. Why these people rush to release this software and without proper testing? (While installing this software our computer will crash for sometime! And there are many issues. They have agreed these problems in the Blog itself (http://blogs.msdn.com/xweb/archive/2009/03/18/superpreview-for-internet-explorer.aspx))
There are some other software are doing their job well. eg. IETester. In this software you can check ie6, ie7 and ie8! And it is free of cost. Also there are some online testing services are available like browsershots.com, crossbrowsertesting.com and a lot.
March 18th, 2009 by
Sunil
I met Sajeeb long back when I was teaching some educational institutions. He always has a smile on his face. Later I understood that he is a good Cartoonist. He tried his talent not only on the paper but also in the computer. He is popularly known as Khan Pothencode.
Khan Pothencode's Malayalam cartoon
He always has an urge to study new technology. On that time macromedia flash was a new technology. He wants to study that. I haven’t had a better idea of Flash. But I taught him the basics of Flash.
Recently I met him online. He sent this link to me. Keralacatoons.blogspot.com. I think now he is a good flash animator. His creative are listed there. His cartoons are coming with a good sense of humour and provocation.
I wish him all the best.
March 15th, 2009 by
Sunil
Here you go some top websites which uses WordPress as their blog system. It shows the power and popularity of wordpress.
Smashing Magazine
Ajaxian.com
Jquery Blog
Search Engine Journal
NETTUTS
i love typography
Web designer wall
Ford Motor Company – Global Auto Shows
Smashing apps
This list is nothing… but all these sites are entirely different from one another. Some of them are using wordpress blog as their content management system. I think sooner or later it will become a good content management system. It is so powerful and flexible. What do you think?
March 12th, 2009 by
Sunil
Language translation ajax api help you to detect and translate language with in a webpage. It also supports right to left languages like Arabic etc. You can add the translation in your website / blog also. It is very simple and it supports most of the Indian languages. Ohh!! Google rocks!
Google Translation ajax api
Google is providing us to test full code with Google playground. So you can test the code live and play around with to better understand how to use this API. In this ajax playground there is not only the ajax language translation, there are a bunch of utility scripts.
I am not able to describe all the facilities in the Language translation ajax api. A few are listed here
- Language Translation
- Language Detection
- Detection of Unicode font rendering support
- Source Detection during Translation
- Branding
- Transliteration Control with Single Language
- Transliteration Control with Multiple Languages
- Transliteration with Custom Control
- Transliteration Using the Low Level API
Google also providing code snippets that demonstrate access to the service from Flash, Java, PHP.
Google Translation ajax api
View complete documentation from Google documentation
As we know, it is a new service from Google, so there may be some bugs. Google promises that they will fill the holes. If you are thinking about a normal user, I am damn sure that it is very good attempt from Google to help developers as well as a normal user.
Update:
I have updated my comment form with this api. It is working fine. Now you can comment it on some Indian languages and Arabic. Check my comment form now.
March 7th, 2009 by
Sunil
If we think about a blog site, no other blog service will come to our mind. Yes, wordpress is soo popular and powerful in this section. Because it has good flexibility and plenty of options.
Wordpress
If you would like to enrich your blog, you have to install some plugins. There are a lot of plugins are available. Even though I think the below listed plugins are very essential for a good blog site. I am just introducing some essential plugins for WordPress
All in One SEO Pack
All in one SEO pack will optimize your blog automatically. All in SEO pack has a lot of options. I am listing a few here.
- Automatic title - Browser window title very important in the view of Search Engines. By default there is a chance of generating duplicate titles by wordpress. All in SEO pack will overcome this issue by generating titles for each page. Otherwise you can give yourself by a good title.
- Automatic descriptions – All in SEO will generate automatic descriptions if you forget to create the meta description. Meta description is also important in SEO.
- Automatic Keywords - All in one SEO pack can generate keywords from categories or the keywords specified from user.
- Duplicate content - It avoids the duplicate content found on wordpress blogs
It also has some backward compatibility with other plugins like meta data, Ultimate tag warrior and others. So don’t forget to install All in One SEO pack. Download it from http://wordpress.org/extend/plugins/all-in-one-seo-pack/
WordPress Database Backup
It is important that to back up your contents once in a while. WordPress Database Backup plugin will help to create backups of your core WordPress tables as well as other tables of your choice. But all tables should be in the same Databse. There you can download the back up or keep it into the server or your can email the back up.
Download WordPress backup from http://www.ilfilosofo.com/blog/wp-db-backup/
Google Analytics for WordPress
Everyone will be happy to see their stats of their blog. How many visitors came to their site, what content they seen etc. Google analytics help you to find out all these. There are a lot of options. If you are not interesting to edit your themes or you are not much techie to edit the wordpress code, then you have to install google analytics for wordpress. You can download google analytics plugin from http://wordpress.org/extend/plugins/google-analytics-for-wordpress/ . Following are the main features of the Google analytics plugin for wordpress
- Automatically tracks and segments all outbound links within posts.
- Track comment author links
- Tracks links with in comment.
- Tracks blogroll links and downloads etc
- Track AdSense clicks
FeedBurner FeedSmith
Now a days feeds are very important and popular. Many people reading feeds. This plugin detects all ways to access your original WordPress feeds and redirects them to your FeedBurner feed so you can track every possible subscriber. More details available at google
Google XML Sitemaps
Google XML Sitemaps will generate xml sitemap for your blog. XML sitemaps will inform the search engines about their pages on their sites. For download and more information go to http://www.arnebrachhold.de/.
I think these are the important plugins that you have to install immediate after WordPress. If you have any suggestion, please let me know.
March 1st, 2009 by
Sunil
CSS development requires some special treatment when it developing for a CMS website. Usually while creating image gallery, video gallery or some type of sitemap design, it needs some extra care. Otherwise it will become mess up the entire template. Some designs are looks like this…
Image Gallery
This gallery is simple. It has fixed width and height. We can easily style this by putting this code.
ul.gallery, ul.gallery li, ul.gallery p{
margin:0;
padding:0;
list-style:none;
font:12px/16px Arial, Helvetica, Verdana;
}
ul.gallery li{
float:left;
width:80px;
height:80px;
margin:20px 20px 0 0;
}Enough! Your gallery is ready!!
But!!!
Assume that each flower have a lot of description. Or the flowers name is little bit bigger. How we can manage with CSS? if the description is little bit lengthy it may looks like this…
Image Gallery Crapped
Here comes a simple solution to prevent this.
Ul.gallery li{
margin:20px 20px 0 0;
width: 80px;
min-height: 80px;
border: 1px solid #000;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
zoom: 1;
*display: inline;
_height: 80px;
}I am now trying to explain this code a little bit. I hope you are an intermediate level of CSS programmer. So I am not explaining each line of code. You people may be doubtful about the following properties.
display:-moz-inline-stack; what does it mean? Mozilla Firefox2 doesn’t support inline-block at all, but they have -moz-inline-stack which is about the same. That’s why we are using –moz-inline-stack.
The next line code is display:inline-block. As it sees it is an inline block is placed inline (ie. on the same line as adjacent content), but it behaves as a block.
zoom:1 Zoom property is non existent property in modern browsers. But here we are using this for fix has layout problem of Internet Explorer. It will fix the absence of inline-block in Internet Explorer. *display:inline is also needs to fix this.
Hope you know the margin, width, min-height, vertical-align, properties of CSS. And the underscore hack of ie6.
And definitely it is not a valid CSS. But it will work with most of the browsers.
Here goes the final code
CSS
ul.gallery, ul.gallery li, ul.gallery p{
margin:0;
padding:0;
list-style:none;
font:12px/16px Arial, Helvetica, Verdana;
}
ul.gallery p{
text-align:center;
}
ul.gallery li{
margin:20px 20px 0 0;
width: 80px;
min-height: 80px;
border: 1px solid #000;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
zoom: 1;
*display: inline;
_height: 80px;
}HTML
<ul class="gallery">
<li><img src="images/flower-1.jpg" alt="Flower1" width="80" height="80" /><p>Yellow Rose</p></li>
<li><img src="images/flower-2.jpg" alt="Flower2" width="80" height="80" />Red Rose!! waooo it is a nice rose</li>
<li><img src="images/flower-3.jpg" alt="Flower3" width="80" height="80" /><p>Flower</p></li>
<li><img src="images/flower-1.jpg" alt="Flower1" width="80" height="80" /><p>Yellow Rose</p></li>
<li><img src="images/flower-2.jpg" alt="Flower2" width="80" height="80" /><p>Red Rose</p></li>
<li><img src="images/flower-3.jpg" alt="Flower3" width="80" height="80" /><p>Flower</p></li>
<li><img src="images/flower-1.jpg" alt="Flower1" width="80" height="80" /><p>Yellow Rose</p></li>
<li><img src="images/flower-2.jpg" alt="Flower2" width="80" height="80" /></p>Red Rose</p></li>
<li><img src="images/flower-3.jpg" alt="Flower3" width="80" height="80" /><p>Flower</p></li>
</ul>
Download the source code
Loading ...