Photo: Chasing Daisy

Web Design Tools are not enough

Most of the hosting clients offer access to Joomla, WordPress and lot of other blogging or CMS platforms. Apart from these, there are several companies selling their instant website tutorials with WYSIWYG features. Anyone can develop a kick start website by using CMS tools and the available options. All you might think of is to put your Home, About Us, Contact Us, Services, and Products Page. However, your business needs more than these. You can even purchase a great looking theme from different Web Template Market but yet indeed; you will only get an standard structure, which may not reflect your business as the way it should be!

Flash and E-commerce Mania

With ample plug-ins available in the internet from WYSIWYG providers, you will manage to use them with the help of the user guides. You will create galleries for your products, decent looking generic graphics, eventually creating something that looks like a near professional website. Shopping cart plug-ins makes e-commerce appear dangerously easy. It takes professional experience to know whether you are using the right shopping cart format. Are you optimizing your product pages? Small business websites need to compete with peer small businesses and giant counterparts.

So within this competitiveness; you can’t be sloppy with your products selling portal. You can’t just use tools to make a website full of amazing animation and make yourself satisfied thinking – “My website is GREAT!” Well, few thinks like this unfortunately!

It’s not only about design any more. You need to place your content into right place in your website according to content priority for maximizing the visibility to readers. You need to know users browsing behavior. How visitors like to browse? Which types of color combination are best for readability? The tools generating your codes are not always accessible to everyone. Are your codes optimized for Search Engines? How about Social Media friendly website? Are you using semantic codes on your site? Is that accessible on mobile? See, so many questions come in front of you as a prerequisite! Can your tools handle all these issues?

Web Presence with Marketing Psychology

A website that has marketing psychology included in every phase of web designing is a must to eventually win in business. To get this done, you need to have your web designing jobs trusted to an online marketing company specializing in web design for small businesses. Having enough tools does not mean you can provide the best job ever. Of course, with practice you might be able to do it; however, you have more to think of about your real-time business than about web technology. Hire a professional website developer or coder and get busy with your own business.

Importance of Professional Web Coder

A professional coder will guide you though customized options for your business in terms of webpage appearance, the number of columns you need done for your business, colors, headers, background, designs, user-friendly navigation and more. The best of all they will be able to produce unique work.

It is very important to have a good-looking logo for your business. Your logo is second to nothing when it comes to representing your business. The internet is flooded with logo development tools as well. It is best to let the professional designer do the job for you. The designer charges are indeed once in a life time investment for the logo that will go places representing your business. When you work with a logo professional it is worth your investment.

Content is the King

Content is very important to speak your business to your clients. You do not want the language to be too complex. You want the content to speak your product and service in the most effective way. The content development team will take care of your needs.

Your website is more than designs, tags, logo and paragraphs about your business. It is your finest marketing weapon. To make the best use of it, you need an internet marketing company or a we design company. There are so many online services, where you can easily look for these companies or professionals. You can post your projects on Elance, ODesk or from Freelancer too! You can crowd source your new logo design from 99Design. Or buy Premium Web Templates if you are trying to avoid custom website design and development hassle. If you think you need some help from Web Design Experts you can get in touch SME Developers.

Your Turn to Involve

Let us know how you make your website? How these web design tools are helping you growing your business? Which method is best for you? Have you ever purchased any template? Do you know the basics of HTML or CSS? Have you ever tried to build one by yourself? What were the difficulties you faced? Lets start the discussion below. You can also suggest your point of views on our Facebook Page. Bye for now.

Photo Credit: Chasing Daisy

“Semantic Code” – sounds familiar right? The buzz word among web development community. Even if you are not related to web development; I know so many SEO experts who are aware of optimized HTML coding structure. Semantic Code is nothing new. It’s the same old concept of writing good codes and concentrate on content structure. Making the content structured not only with css style but also within codes itself.

In an Example We can easily make a sentence Bold, Big and with different color using css, so that it looks like a Header within a placeholder. So a possible coding style can be like this:

<div class=”head”>
  This is a header of this section!
</div>

This is absolutely a bad practice. Lets say if you have 2 more sub headers, what might be the worst scenario?

<div class=”head”>
    This is a Main Header
<div class=”subhead”>
    This is the subheader
    <p>A paragraph</p>
</div>
<div class=”subhead”>
This is another subheader
<p>Another paragraph</p>
</div>
</div>

I have seen codes written like this too. What’s wrong with this coding style? Sure it will work if you are fine with CSS and give them a good look. All you need is to get the class of each container and give necessary styling elements, browser will be happy to show the website as you want to! But is that should be the way of doing this?

<div class=”content” role=”main”>

<h1>This is the Title</h1>

<h2>This is the first Header</h2>

<p>A paragraph</p>

<h2>Another Sub Heading</h2>

<p>This is another Paragraph</p>

</div>

I am Website Developer was kept aside for few months. We had seen visitors are browsing the website from different locations around the world. Very interestingly most of them are coming from Search Engines! Close to 1000 page views and 700 unique visits each month. Bounce rate was really poor, close to 89%. After hovering these analytical data I thought if people are coming into the site and bouncing back to exit; it means this current website is not enough to keep visitors engaging with the contents. I researched even more on website performance, loading time, usability and overall UI design aspects for the existing site. It turned out to be this website is running below average quality in the blogging industry! Sorry to say that but it’s true.

What was the problem with this blog?

Lack of continuity, poor coding structure on backend, heavy images, poor loading time and articles were not readable at all. Among all these problem lack of continuity was the worst killer! In-fact this can be defined as the main cause which is making this blog unsuccessful.

It had all the elements a blog should have. Social Icons, Share Bars, A Good Commenting system using Disqus, Related Post plugins, Caching plugin, All in One SEO plugins and many others to make the blog perfect. But I was wrong.

While I was working on my other projects like In Quest of Music, SME Developers website using WordPress; I have seen optimized website is one of the key to better usability and user experiences. If your website can ensure a better readability in terms of design and if you can ensure optimal loading time with proper accessibility, your website will be more engaging.

Steps Taken for better User Experiences

Better Typography

You are using the beta version of new IAMWD User Interface. How is it? Can you read it things well? Typography has been given the most priority in this new UI. You will see the content area is the most focused segment here. Every anchor link is identical here. You know those light blue texts are links.

Responsive User-Interface

This website is responsive to browser size. Using 1140 CSS mobile grid system IAMWD can be seen on any smart-phones. We don’t have to use any mobile plugin for wordpress like wpmobile. Type http://iamwebsitedeveloper.com/ on your mobile browser and see what happens. It should fit itself according to your browser size. The current web layout is also well accessible in all browsers with almost same view

Blazing Fast

Yes it is! We tried to keep the coding structure at its finest form and still improving it’s inner structure. The old site was taking 7.80 sec on it’s first load. This new user interface loads within 2 seconds and we are quite sure it will taken less time in future. 

We know we can get even better loading speed after we optimize those JavaScripts too.

Semantic Coding structure

This new layout and it’s prototype is following semantic coding rules for rich browsing experiences. Elements like rel=”author” rel=”me” for social share authorship, OpenGraph markup is on header for social share both on Facebook and Google +

Better Articles for web developers

We are thinking to introduce some new faces in IAMWD. We will like to launch a campaign within article writers to submit there articles on different web related topics, both paid and niche blogging. Credits will be given to each writers and best article contributor will get $15 as a price money. Ya I know very less! but hey just for fun and contributing within a social writing. It will be fun. If any one of you are interested for group blogging please write on our Facebook Page.

Search Engine Optimization is shortly known as SEO that uses for appearing among the top listing on SERP. There are three ways ranking our pages: White Hat,Black Hat and Gray Hat. We will discuss about White Hat methods all over this article on Search Engine Optimization.

To optimize a web page  Internally,There are some criteria which are shown below:

Choosing Domain Name

Each and every web site has its own domain name which is unique. The Domain name represents our website. We have to bear in mind that Domain name should not be long. Domain name is also considered as a keyword.

Using Meta Tag

Search engine doesn’t see as we see a web page .They only can see the code and it is very important to have a clean code. Meta tags are part of our web pages code and they have great importance. Meta tags have thee parts, We are going to discuss those one by one:

• Title Tag

We must include our keyword phrases in the Title Tag and we should set the Title at the top of the page.
The code for Meta Title:<title>HERE IS OUR TILTE</title>

• Description Tag

The Description Tag does not have any effect on SEO and Ranking. We should use Description to make people click on our website. Description Tag is actually say what our site is in short. Description should not be long than 200 words.
The code for Meta Description :<meta name=”description” content=”THIS IS OUR DESCRIPTION” />

• Keyword Tag

Actually, The Keyword Tags have no effect on our On-page SEO and Ranking also. We have to use keyword tag to tell Search Engine for what keywords to Rank over web page. Keyword should not be more than 10 words.
The code for Meta Keyword:<meta name=”keywords” content=”keyword1,keyword2,….” />

Introducing Heading Tag

Placing our keyword phrases into the Heading Tag is another thing we should do that will optimize our On-page SEO. H1 tag is most important and we should also try to include our keyword phrases into our H1 and H3 tag Headings within our post.

Utilizing Page Content

Large content is much better than short content. We have to use keywords in our body content. We must keep in mind,density of a keyword should not be more than 3-5%. Page contents should have Bold,Italic,Underline on our keyword phrase. We will use all 3 but don’t overdo it and will try to use them once in every 100 words.

placing Internal-Linking

For SEO, Internal-Linking is very important. We can build Internal-Linking by using anchor text.
The code for Internal-Linking:<a herf=”http://domainname.com”>Domain Name</a>

Applying Image Alt Tag

Search Engine bot can’t read any image. To overcome this problem we have to use alt tag.
The code for Image alt tags:<img src=”IMAGE FILE PATH” alt=”IMAGE NAME” />

Frankly speaking, i am not an Expert in Search Engine Optimization and still learning. I shared some of my knowledge with you. If you have any query about the topics you can post and also can share your Expertise knowledge with us in our comments section.

What sort of design process do you follow? Modern design process involves so many different structures, work-flows to make things more usable both for clients and designers. Which one is your best fit?

Prototyping, wireframing is not a new concept, we are used to work on UML (Unified Markup Language) before. Hence the conception was vastly used for mid level projects by most of the stablished software development companies that follows international standards. For web developers on small projects most of them really dont bother to adopt the rules of design flow, as it is time consuming. Here we miss the main part.

You should be following few steps before jumping on design implementation. It reduces your overlapping,  tweaking time and alternation; moreover you can easily adopt any future changes if required. That means you are saving your time and saving your clients money.

Lets go through some of the steps:

Get detailed Requirement

While getting requirements from your clients try to get as much details as you can for you next web design project. Sperate them in to different appropriate sections. Point out the key functionalities. Get inner view of information structure, review additional steps necessary for the design. Flag them according to the dependencies and complexity.

Work on Wireframes

Wireframing is the key process that we usually follow to show our clients the basic structure of the website. It dosent include any color or styling just the basic structure to show clients how their website will look like. In this process you will also dig ou the usability issues as well as the user visibility ratio.

There are so many different tools out there. You can do the wireframe on paper or use online tools like Cacoo or Printable wireframing tools.

After you done with the wireframing and information architecture show it to your clients. The followup with your requirements, discuss with the elements usability factors with them. If they are satisfied go with it or if they re not then work on the wireframing again.

Jump on core design Implementation

After you get green signal from your client on wireframed structure, you know how information will be placed within a browser. Now it is time to start on design implementation. Which means styling, giving color effects. Most of the designers use Photoshop or  Fireworks. There are so many different tools on internet to implement a nice, elegant website frame.

Benifits

You will find out benefits if you follow this process. Some of the key points given below:

• Less time
• Gather more confidence from clients
• Alter when necessary without giving much effort
• Quick updates
• Easy to followup
• Reducing cost on both end.
• Re-Usable
• Ensuring usability and UX

I personally follow this process. Still there are so many different terms and technical steps to be followed but to insure the very basic you can start with these steps. It works for me, let me know what you think what steps do you follow?

[Related reading: Speed up wordpress blog by reducing external request ]

Choose perfect heading for your article:

This is in-fact the most important of all. Let me give you a small example. Type this phrase on google “optimize posts for search engines on wordpress”. You will see near about 447,000 results found. use these key words separately on Google Trends. You will see the relevance of each keywords. Here the data is scaled based on the average search traffic of the term you’ve entered. So if you can insure to have perfect heading with defined keywords searched by major traffic then your chance to get hits increases a lot.

Use your title within your posts:

Have you seen this posts already used the title twice? Which means when Google will scan the post it will get more relevance with the title. Try to insert your title phrases you keywords technically so that your search engine hits get a rise.

Be consistent on heading:

Be very consistent while using headings within your posts. If you give your title a tag <h1> then don’t use it again within your post. It is just like writing a thesis or published article. We always keep relevancy on heading there. Like If the title is <h1> then a section heading will be within <h2> and if a section has sub heading they will go with <h3>.

Bold your keywords, give them some weight:

Have you seen I am using bold on this post? If you have a clear look you will see I only bold those words which are relevant to this post topic. It helps robot to get determine proper keywords. because you are matching your giving keywords given on meta tags.

Choose proper keywords:

While choosing your keywords for your meta tag on <head> section try to insert keywords taken from your written posts. Especially those which are marked as bold. In example for this post: keywords should be ‘optimize wordpress’, ‘posts for search engine’,’SEO’,’perfect heading’,’keywords’ etc.

Final Touch

I am not a SEO guru, but a blog writer and website developer I have to use few of these techniques. It works for me. I have seen many of my posts gets higher ranking by using these simple steps. Hope it will work for you if you can use them properly. I would like to thank Mr. Asif Anwar, one of the pioneer on online marketing specialist from Bangladesh;  who gave me initial ideas about these simple steps when i was in London. Now its your turn for discussion. Please reply using our social comments options.

Last one year while working on this blog I have used so many different plugins to make it better, faster and usable. Some of those are really good and still using them and most of them were useless and resource taker. Below I am going to give a list of some good plugins I think you should have installed:

Best wordpress plugins you should have for blog

Akismet

If you want to get rid of spam don’t forget to use this. A life saver to me. I see everyday there are more than 30 spam which were protected already by Akismet itself. It will automatically grab all those spams and will be resolved for you. Install it and forget about spammers. It comes with WordPress installation.

XML-Sitemap

Automatically create and submit your Sitemap on favorite search engines like Google, Yahoo or Bing when ever you will submit any news post, alter update or delete. They will be notified about changes to search engines. Options are pretty straight forward and esy to setup. Install and active then forget about your sitemap issues.

Feedburner

I would recommend to use feedburner feeds as your default RSS. It gives you option to count and manage your subscribers subscribers. It also redirects your visitors towards feedburners feed page when clicked on RSS.

All in one SEO

Best SEO plugins for your blog so far in my count. I really works great for me. Simple easy to handle. Moreover it offers different option to configure your SEO related issues. It also offers a paid plugin which is more robust.

WP Related Posts

Generate a related posts list via tags of WordPress

WP Greet Box

Show a different message to your visitor depending on which site they are coming from. That means if a new visitors referred from search engines like Google it will greet you it will request you to subscribe by RSS mentioning you are a Google visitors. Good to grow your subscriber base but problem is it insert a related JavaScript on header which is a performance issue.

WP Smush.it

Reduce image file sizes and improve performance using the Smush.it API. It makes your post loading time even faster by reducing image size.

Thank Me Later

Automatically send a ‘thank you’ e-mail to those who comment on your blog. This plugin engages the visitor by reminding them to check back for responses or new blog posts.

Twitme

This plugin allows you to automatically post your new posts on the twitter website.

Top Comments Widget

The Top Commentators Widget a sidebar widget to show the top commentators in your WP site. That means you are promoting your commentators which encourage them to comment even more.

WP Super Cache

One of the best plugins to speed up your wordpress page loading time by enabling caching. It generates html files that are served directly by Apache without processing comparatively heavy PHP scripts. By using this plugin you will speed up your WordPress blog significantly.

ShareThis

Lightweight and easy navigated options to install. Let your visitors share a post/page with others. Supports e-mail and posting to social bookmarking sites.

WP-DBManager

Manages your WordPress database. Allows you to optimize database, repair database, backup database, restore database, delete backup database , drop/empty tables and run selected queries. Supports automatic scheduling of backing up and optimizing of database.

Now its your turn

There might be few other plugins which you may find better. Then please let me know on the comments section.

Here are few posts that are most popular of all time since last one year:

• Display Twitter profile picture on wordpress comments
• All about CSS : Useful blog post on CSS3
• Speedup wordpress blog by reducing external requests
• 6 useful posts freelancers should read and follow
• Design a modern twitter icon in photoshop for your website

I know very short list. But I promote to come with more articles and resources in-front of you in coming days. We also like your help to get more visitors base. If you think you can consider to share our site within your network please use the social network bar. You may also like to connect with us with our RSS feeds.

Few days ago I had a meeting with a new client referred by one of my good friend. He told me this guy really in need of some good stuff for his 5 years old company. I was happy thinking, the client is old in the business so may be I do have some chances here to grow with. I met the owner and he had a very clear requirement for his website. It was a medium sized website requirement and I know it will cost him close to $400-$500 (we were discussing in BDT currency) even if i use a ready made module for him with minor customization to ensure performance and functionality. I didn’t ask for any budget but he insisted saying,

I need a custom website that should not match with anyone else and with a low rate -

OK great then what is your expectation? He replied “8000-1000 Taka (close to $114-$142)”; then he also added

“you should give as post support as well within this!!”.

First I didn’t believe what I just heard. It was an awful feeling but I can express that unfortunately. Because I know even the best lowest bidder cant do it considering his hourly work load. That’s why I politely expressed my feelings. he replied

“Who told you that? You designers are giving me this cheap rate!! Here look ….”

- he then passed me few local leaflets which mentioned “$40-$100 dynamic website”. After going through their profile on their website I got the clear view of whole scenerio. I felt sorry for that client because I know he putting $114 in to a bin. I will consider this client as a victim, it is not his fault. It’s those designers who are dumping price by giving bad services to these clients.

Changing rates from first world to third world!

When I started my job as a freelancer back in 2006 from Bangladesh, my first project rate was close to $300 it was a Flash website which was just a little modification of an existing flash website. It took me near about 8-9 days to complete. That time $300 is quite a handsome amount of money in a country like Bangladesh. When I was in the UK for my Masters my idea about website development simply changed. I have seen what is quality. Why people pay for quality things? Why a designer charge that much for a design art or website? I started learning from the beginning. I came to know about usability, user experiences, modern design specification and performance issues related to web design life cycle. Now I always follow rules of good web design practice.


I fixed an ideal hourly rate for me which is average comparing the designers rate in the UK. But as a new-bee in foreign territory getting local job becomes a golden deer for me. So I tried Elance, Freelaner and Odesk as my source for clients. Then I realized the problem Thomas Friedman told us before “World is Really Flat“. Internet and cheap labored countries giving small companies in First world an option to outsource their job in cheaper rate than they used to get within their own country! I saw even though £15 per hour is quite low in UK it is quite high comparatively in India, Bangladesh, Pakistan or any other East European countries. Even $7-$8 is a good rate for them. So sitting down in UK I was shouting at my country men. They are taking my food out from my mouth. They are getting competitive advantages by being low cost designers. it is indeed an advantage. I will not consider it as price or rate dumping, it is just an strategical benefit of cheap labor country.

How designers dumping rates?

I have seen designers on Elance, Freelancer or Odesk job board to dump their price to the lowest. Sometimes a winner of  a custom wordpress template bids with only $35 (yes true its not modification, its a new theme design)!!!! I wonder how on earth it is possible? I get a quick reply too? The same project owner call for help few days later for same project.

So you can see designers are there dumping the rate. But they can only deliver a crap not a good design that works for client or business.I had faced this types of problem on the story described above. New clients are getting convinced by these cheap designers to o for a cheap design. But we know cheap design is not Good enough to deliver your business need.

So are designers cheap to grow?

As a new company my design studio SME DEVELOPERS is charging it’s client with lower rate but not with cheap rate. That means we are not going for cheap rates for cheap  bad work to our clients. You will always see slogans like “Best and Cheap” – dont trust them. From my personal experience a well design and better functionality website comes with time and costs. yes I can reduce or give some discount on project basis. But not with the cheapest price. It is bad for business growth.

If you always try to be the cheapest by delivering whatever to your clients you will grow an image of cheap designer. So when your client will grow and look for better design they will not come to you. They will rather find some one who established his image as “Good Designer” or “Creative Designer“. So even if you are a quality designer you may loose your client in this case.

Finally be careful when you start. You can dump the price to get market share but in long run being cheap designer will not do.

I use shared hosting with IXWebhosting with a package of unlimited hosting and bandwidth (though it is not true. there is nothing called unlimited). Though i use shared hosting ixWebhosting is not bad at all. It deliver a good service for small business anyway. Even it’s price is really good. But if you are looking forward to go for something even better for your wordpress blog then I believe you should consider other available options. As I am hosting 3 different blog with IXWebhosting it is working fine as a small blogger. But still sometimes I face very poor performance issue, because you have to accept wordpress itself is huge resource grabber and it usages external resources if you install such plugins.

To get rid of performance issue you can adopt VPS (virtual private server) or Cloud Servers or even few dedicated shared hosting services for wordpress like BlueHosts. But if you don’t have such resources then you have to optimize your wordpress yourself either going through coding or reducing added resources you use with. Below I am going through few points:

Reduce External Request

I always use YSlow to check how many external requests are their going out from my website or pages on my blog. This blog, IAMWD is taking more than 27 external requests. It is too high. Maximum number can be considered close to 6-8 not more than that. IAMWD is taking this much requests only because its using lots of plugins to make my life easier, but it is bad for loading time. That is why I am working on my themes to include manually processed requests internally so that I don’t have have to use all these plugins. It is always better to have your own personalized template developed by professionals with checking performance entity to insure the best possible optimization within your design.

Remove unnecessary plugins

WordPress.org is giving us a whole world of unlimited plugins. There are so many blogs out there who will let you know about the best plugins existed. But you have to decide which one suits you most. Please consider to remove unnecessary plugins from your dashboard. Most of these plugins uses JavaScript codes and that means more you insert scripts more you are increasing your loading time.

Many out there who dont know how to manually insert plugins code within their template, but if you give some effort you can easily get things done, or outsource your small project tweaking with professionals.

Lets say you are trying to insert different advertisement script offered by different advertising companies like Adsense, BidVertiser, CJ, Click Bank, InfoLinks and many more. Foretunately and unfortunately there are so many of them. Which one to choose then? you will only go for those affiliates, CPC,CPM or other form of advertisement which requires less resources. I am using text links referrals, banner images and Adsense. These programs already reducing my performance a lot. But when tried a script from Info Links my site was close to death. Info Links insert their own links within your inline texts of your contents. The script tries to go through your pages first, initiate which words to target then override with its own tagging link. This whole process takes too much time to make your site a crap. That is why I suggest you to use these advertisement programs with care.

Use Cache

two ways to leverage your cache for wordpress; manually and with plugins. If you are an expert with php and web development then consider manual process, because it gives you total control on what you are doing. Hence, WP Super Cache is one of the best I have ever found to take care of your cache problem. It works really well.

Try to insert manual Social badges

You will see I am using two different social share bar in this blog (yes to share this post within your network!!!). I feel like getting rid of these two bars. Because it is inserting 3 different script on each of my pages with external requests. That is why on my upcoming template (coming very soon) I am considering to include manual badges with only 4-5 major services. I already tested it and works great by reducing upto 70% of times. You can find so many articles on how to add social badges manually on Google.

Conclusion

I will try to elaborate more on my next post on this optmization issue. There are few other factors you need to consider but in this post I only highlighted very basic to reduce external calls for your wordpress blog. As I am testing with my custom template, it becomes easy for me to understand what is really handled inside wordpress. If you have any thing new to share or want to ask any question please let me know on our comments section. And please dont forget to share if you find this helpful.