speed

Mobile Web Design – Avoiding Universal Errors

This is a guest post by Spinx Web Design. If you want to guest post on this blog, check out the guest post guidelines.

Errors or Mistakes usually happen because of deviation from the standard. When it is about mobile web design, the perception of the designer is usually considered to be the main cause for the mistakes. The mistakes can be minor, small or even big depending upon the effort and money required to resolve it as well as the extent to which the losses occur because of that mistake. Some of the most common errors made by the designers when designing mobile websites are as follows.

1. Necessary Content: The mobile web design should have only the content that is necessary and can be displayed on the mobile screen. It should not be a copy of the content of the website that is designed for the desktop computers.

2. Load: If the mobile website is heavily loaded it may take a longer time to download and this could prove to be an irritant for the visitor.

3. Ignoring HTML5 and CSS3: Coding the mobile website with HTML5 and CSS3 can optimize the speed of downloading. The need of images can be reduced when the coding is done with the help of HTML5. CSS3 coding can offer rounded corners and gradients.

4. Width of the mobile device: When the mobile web designer does not take into consideration the width of the device it is possible that the elements may turn out to be not legible. This may happen because the elements have not been formatted to adjust to the width of the mobile device. This issue can be resolved with a simple HTML coding.

5. Downloading String: If the downloading string is not displayed on the screen of the mobile device the visitor may not know whether the action is being executed or not. The dilemma may compel or tempt the visitor to move to another mobile website.

6. Responsive web design: The mobile web designer should design a responsive website that is not only user friendly but also gets adjusted to the screen size and technicalities of the mobile device.

7. Home Screen: The home screen should be set in such a way that the screen does not look cluttered and illegible.

8. Excess of imports: When the designer uses AJAX framework like MooTools and jQuery, the import of data from the server becomes necessary and this can increase the duration of downloading time.

9. Images: The mobile website should have only the images that are required. Unnecessary images can add weight to the website and this could adversely affect the downloading time.

10. Size of the Finger: The touch screen is now becoming a regular feature of the mobile phones and this means that the mobile web design should be such that it can be navigated through with the help of the finger tips. The icon size should not be very small.

11. Form filling: The mobile web design should have short forms to be filled. If the visitor has to form long forms then it can irritate him/her. On the other hand the forms have to be designed keeping into consideration the facilities offered through the keyboard.

Author Bio: Spinx Web Design is a USA based web design and web development company and organization likes to write content on WordPress and designing,Web2.0, Mobile tips and
tricks, Social Media, Web Design, Web Development etc.

10 Ways To Make Your Blog Load Faster and Save Bandwidth

This post is part of Saturday, Sunday Series for Newbie Bloggers. You can contact me, if you have any questions.

Sridhar

Q. I have been tweaking my blog to make it load faster, but nothing seems to be helping. And eventhough I don’t have heavy traffic to my blog, often times it goes down 🙁 Can you please suggest me something to over come my problem? Am I missing something or is it normal with all blogs. And I am hosting my blog with basic hosting package, so is that the problem?

To make blog load faster
1. Remove any extra widgets you are using on your blog.- Twitter updates, Facebook fan widget etc
2. If you are running banner ads, make sure you host all the images on your domain.
3. Make less http requests from any webpage.
Ex: Instead of using “http://yourdomainname.com/images/123.jpg” you can use “/images/123.jpg” in the img tag.
4. Use less images. Having one or two images for a article helps, anything more will really slow down the site. Use multiple images only if highly necessary.
5. Move all the CSS and JavaScript codes to an external file. And make sure to optimize them – remove extra spaces, delete the useless codes and make the scripts small and smart(good coding).
6. If you have any badges and banners which does not provide any value to your visitors, then remove it mercilessly.
7. Optimize the images that you are using on your blog.
8. Use Gzip compression. Add the following code to your .htaccess file if your web host have content compression (gzip compression) turned off. You can test it using http compression tool.


# Turn GZip compression on (as per http://tr.im/fnn6)
<Location />
# Insert filter
SetOutputFilter DEFLATE
# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html
# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip
# MSIE masquerades as Netscape, but it is fine
# BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won't work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
# Don't compress images
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png)$ no-gzip dont-vary
# Make sure proxies don't deliver the wrong content
Header append Vary User-Agent env=!dont-vary
</Location>

9. Do not make use of lot of javascript codes to track your visitors. Try to stick only to the necessary things. And do not forget to test your sites performance using Webmasters tool.
Goto Webmasters Tool -> Labs -> Site performance.

Here you can see the performance over view graph and lot more information like: Load time of certain pages from your blog, You can install a 1.5MB add-on to evaluate the performance of your pages and get suggestions on how to improve them, it also reports – what is consuming more time to load and what you can do to improve the performance etc.
10. Above all the speed of the servers where you are hosting your blog is very important – without which any tweaking will go in vain.

Bonus tips:
1. Use only the necessory plugins and remove the rest.
2. Do not use Widgets. Use handcoding and put the things into the WordPress theme directly – reducing the number of calls.

Have a backup of your blog, and if you are comfortable: Use DataBase cleanup plugin, Database optimizer plugin, delete the extra post revisions, use static links – this helps very little, if you already have Gzip compression enabled or Super cache plugin enabled.

Final Thoughts from Matt Cutts:

Hosting
Invest in a good hosting company. See to that you are paying atleast 5 to 6 $ per month for your basic hosting package. If you go far a cheaper web hosting, then the problems are mostly obvious. I suggest going with Doreo host, Blue host, Host Gator, MediaTemple etc. And a basic package is all needed in the initial days.

If you are hosting at a decent hosting company, and still facing this problem, then you must consider evaluating your blogs log files. It contains information about what is consuming the bandwidth. You can mail your hosting company support team and can ask them to check it for you and to report the possible problem. In most cases it would be a plugin problem or a faulty code introduced into the CMS. Or sometimes if you are using some automated scripts to handle some tasks, all these could create some problem, if there are some bugs.

A good hosting company should be able to help you with this – if not, you know, its time to move on. And there are plenty of good web hosts to opt.

Happy Blogging!

20 Tips To Optimize Your HomePage

Everybody talks about optimizing the website as a whole, but it is of equal importance to optimize this single, most important page – HomePage (face of your website).

For almost all the websites, the most ranked and visited page is its homepage. So optimizing it makes a lot of sense. If you feel the same, then continue reading..

Here are some of the aspects that you can tweak, inorder to optimize your homepage:

1. Do not show full article on your homepage. If you are showing 10 full articles on your homepage, then it will take a lot of time to load.
And from users perspective, they may not have the patience to scroll down and digg your website looking for good content. Internet is full of information overload and they may just leave your website and go somewhere else.

On the downside, people need to do an extra click to get to the content, if you start showing post excerpts.

2. If you are showing only excerpts on your homepage, then try to limit it to 8 or 10 post excerpts. If you show 20 to 25 post excerpts on your homepage, then the user experience will again be bad.

3. Use less images on your homepage.: Images consume most of the bandwidth. Images can be used wisely to grab the attention, but if we do not take that extra care to optimize the image, then we will surely have to pay for that latter. It would be better to avoid more images on the homepage.

4. Use less advertisements on your homepage or no advertisement on your home page: The best example for this is Google. Google.com is the simplest and most used search engine in the world and still it doesn’t have a ad on its homepage. Get a clue from it.

5. Optimize all the images that you are showing on your homepage, using some image optimization tools.

6. As far as possible, try avoiding if-else programs on your homepage. Ex:- Showing one ad to facebook visitors and other for Search Engine visitors and another for people coming from Twitter!

7. Remove the widgets and badges from the homepage. Retain only the most important.

8. Avoid animated contents from your homepage, inorder to speedup the load time of your pages and to not divert the attention of your reader, from the beginning.

9. Choose a proper webhost, with good uptime, speed of servers and support.

10. Make use of custom Excerpt option in WordPress and make the excerpts on your homepage more meaningful. Create enthusiasm or the need to read more situation to someone who reads the excerpts on your homepage!

11. You can lessen the ads on the homepage and put link or banner to your own interesting articles or categories of articles. This will give the user more options to navigate. And you can engage your reader for more time, showcasing good articles.

12. Remove the digg, tweetmeme and other buttons from the article excerpts. Show them only on the full post, if necessary.

13. Use labels: Label all the things properly on your homepage. Ex: Recent articles, Popular posts etc, for better user experience. Visitors must not feel, as if they have landed in a wild forest!

14. Test your optimized homepage: Testing is the only way to go. Big internet companies like Google rely only on its continuous testing. But Google, Yahoo, Microsoft has a lot of employees for testing. Now how can you do testing with your website/blog? Most of the times, owner of the blog gets blind to many components on the blog, like, the widgets, labeling, etc. So it is a good practice to arrange a party for your friends(who don’t know about your blog) and tell them to surf and give feed back about 2 or 3 websites(one of which is yours!). Keep doing it once in a while. Do not over do it. You may just endup in testing and may forget the main element of the blog, which is content.

15. Menu bar: Most surfers are used to the menu bar placed at the top, than on the sidebar. So it must be clearly placed in a prominent position and do not mix it with your categories and other stuffs.

16. Show navigation menu or main menu both in the header as well as in the footer.

17. Make sure to have “Popular Articles” or “Recommended Articles” list on the homepage. So that first time visitors know where to look at, for the best contents on your blog. And with the best content, they are more likely to stick to your blog.

18. Show your subscriber count or Twitter follower count as a social proof, if you have some significant numbers.

19. As far as possible avoid flash contents from homepage. You may annoy and drag your readers out of your blog even before they read any of your stuffs!

20. Make your website/blog logo clickable and link it to your homepage.

Please share your optimization tips with us. So that everyone of us can improve our website/blogs.

New Look for Webmasters Tool

In 2006, Webmaster Tool began as a way for webmasters to submit Sitemaps.

webmasters-tool-redesign — Webmasters Tool Re-designed

The important aspects in this redesign are:
1. Faster loading.
2. Easier navigation.
3. More search query list, to which our site appeared in search engines.
4. Display thinks in the form of table. Looks very clean and readable.

Over all the redesign is impressive. And there is no major feature added or removed from the previous version.