Sometimes, I don’t get along really well with web designers – for the good that is. We contradict more than agreeing on ideas in design concepts, UI, layout planning etc. Designers are very adamant people and they’re really very possessive about their work. We SEO’s are perceived to be people who downgrade their work, and thieves who steal their credits – and it’s true.
Sometimes we really do. After all that hard work with pixels, one fine a day an SEO jumps in, does his “magic tweaks” and the CEO is very happy for the SEO. Yeah just the SEO. So I think designers have all the rights to envy us haha
Anyways, in my opinion the best web designers are the ones who also take into consideration the SEO concepts while they design. It’s not difficult, and if you do that in first place right from the scratch, no SEO is going to rip off your design later.
Tip No. 1
- Study and read everything possible about advanced SEO techniques right from the start of your project.
Tip No. 2
- Always keep in mind that designs are cool, but what is equally important is the code that goes behind it.
Tip No. 3
- Always keep the code optimized, check for W3C compliance right from the start.
Tip No. 4
- Follow the basics, titles, meta tags are still important if not ignored, so keep space for them.
Tip No. 5
- Keep a horizontal directory structure, don’t go too deep with them, the search engines likes easy access to any file in the quickest time.
Tip No. 6
- When you name the files and directories, keep it descriptive and simple. Keep away numbers and weird characters.
Tip No. 7
- Images better be optimized for size, and quick loading. If you can’t keep away from loading that fancy graphic, mix it with the page elements. Don’t make them look blunt.
Tip No. 8
- Make room for a lot of text. As you already know, search engines love text, lot of them.
Tip No. 9
- Flash files are cool. And Search engines have found better ways to crawl and index them unlike old times, but that doesn’t mean you can use them extensively blocking access to relevant text info. So if you are keen on using flash, keep alternate text versions ready.
Tip No. 10
- If you have dynamic content, make sure you keep it simple and split to parts. Also, make sure you have optimized static pages for your primary keywords.
Tip No. 11
- Always do a bit of competition analysis. See what your competition is, if they have a minimalistic design you don’t want to have a flash design, and leaving no room for improvement. Stalk your competition.
Tip No. 12
- Many web designers make the mistake of using a template through out the site and many a times this includes repeating the same title or similar page titles all over the site. Get over this, use descriptive page titles everywhere possible.
Tip No. 13
- Keep the page titles to 65 characters or less in count. Nothing wrong is going over it, but you could avoid a spill over.
Tip No. 14
- The meta descriptions are supposed to be mini ad-copies that should be descriptive of what the page is about. Don’t keep them the same for all pages.
Tip No. 15
- Keep the JavaScript away from navigation menu. Navigation menu is a good resource for gathering information about what your site is about, and using javascript can make it less crawlable by the engines.
Tip No. 16
- Use CSS based navigation if you want fancy effects. Pretty much all of the javasript stuff can be done on CSS, in a more search engines friendly way.
Tip No. 17
- Use the header tags effectively. Don’t limit yourself with H1 and H2. Use H3, H4 and beyond and use it wisely on the page.
Tip No. 18
- Use strong tags wisely. Don’t let them stand out like bolded text, within the content, style it down to show up as normal text within the content.
Tip No. 19
- Use the footer effectively. Of course, you can use it for all your TOS/Legal stuff, but also use it to link to the important pages on your site. It helps.
Tip No. 20
- Identify the most important pages on your site as seen by the search engines, and leverage them to promote other resource pages.
Tip No. 21
- Link well internally, and use descriptive anchor text instead of “click here” and “check this out” like phrases.
Tip No. 22
- Use al tags, Title tags on images and use descriptive filenames. They help search engines find more information about them.
Tip No. 23
- Use a SEO friendly layout, at least one that does not block or hinder the crawling of crucial areas on your site.
Tip No. 24
- Find out the important areas on your website, like the content rich area in the center and keep them above the fold. Not only helps the engines but the user as well.
Tip No. 25
- When designing dynamic pages, try to stick to pages with descriptive URLs and not the one with session ids and other parameters. Google can still get it’s head around them, but its good if you can stick to SE friendly, descriptive ones.
Tip No. 26
- When dealing with CMS’s there might be instances where you have to keep the page URL the default way with the extra parameters. Use URL rewrite mod to re write the most important pages URL’s to SE friendly form.
Tip No. 27
- When using AJAX, load the modules in parts split across pages and not in one single page. Although this defeats the purpose of using AJAX in the first place, you might be able to provide more information to the search engines using other on site SEO parameters.
Tip No. 28
- If you want to block any particular area on your site from the reach of Google spiders, use either Robots.txt commands, or else set up a login access. This is the safest way to block crawlers from spidering vital information.
Tip No. 29
- Keep the meta descriptions descriptive and precise to about 150 characters.
Tip No.30
- Use an SEO simulator to test your design through out the process. And make sure no part of the design blocks/hinders any part of information being accessible to the search engines.
So essentially, web designers got to ensure that while their designs are unique and eye-catchy, making sure that there is enough information available in the form of text is always recommended, and leveraging this information by using all the possible SEO metrics in a healthy and balanced way to cater to the search engines is the right way of designing a search engine friendly web design.
Having said that, please remember that there is no right and wrong way of doing things. You got to understand your requirements, your resources and make a tailor made strategy that works for your niche. And that’s what is really important.
SEO Auditor Features - Complete SEO audit - Competitor Analysis - Report generation Try it today ! |
Link Assistant Features - Easy Link Building - Finds link partners - Get backlinks regularly Try it today ! |
Rank Tracker Features - Rank Check reports - 558 Search Engines - Keyword Research Try it today ! |
Possibly related SEO & Social Media Articles
Great post, Mani!
Good pointers
Reply
Well summarized. Nice list for future reference.
Reply
How does javascript hurt seo? “using javascript can make it less crawlable by the engines” This is simply not true since modern javascript libraries like jquery and mootools rely on css classes to apply effects. With or without the js active, the navigation would look exactly the same to a crawler.
Reply
Mani Karthik
Replied:
Josh, agreed, I shoudl’ve clarified. Using JS on navigation menus, or critical areas like it can slow down or completely block those part of information nfrom crawlers. you can try it with any site crawler testing tool. using JS on sites are fine so long as they don’t hinder information form being accesed by search engines.
Reply
Paul R
Replied:
Good Point, thanks for clarifying.
Reply
[...] 30 Web Design SEO Tips for Web Masters [...]
Great tips money. A couple of other things I would expect is the relevant usage of the meta tags built in (e.g. Robots) instead of having to use a plugin for that.
And extending #25 and #26, one needs to make sure that the URL portion that immediately follows the domain name is something descriptive and keyword enriched. It shouldn’t be a number or GUID etc.
Reply
Yeah.. these are exhaustive and useful tips for seo while at the design phase. I already follow some of these where I have direct control in my blog.
Reply
[...] 30 Web Design SEO Tips For Designers [...]
Nice lists, I’ve already used some tips here, now it’s time to apply some new tips. Thank you.
Reply
Great post!
Reply
Hi,
Interesting post, Good tips.
Its always best to keep the navigation part neat and simple rather than using complex codes into it. Basic HTML nav should be good enough.
Cheers,
Eddie Gear
Reply
Well, this is pretty great stuff. I am certainly getting a lot out of it.
However, I want to mention something…
In my experience working with a variety of designers of different calibers… the really great ones don’t have enough time to spend familiarizing themselves with “everything advanced SEO” — this is just asking a bit too much from a designer.
A designer needs to be concerned with usability and making the site as appealing to the viewer as possible.
Their time is much better spent studying everything “advanced design” at the start of their project.
If they are ALSO expected to be studying the vast array of SEO knowledge out there… wow. I mean, speed of implementation is out the door.
What you are discussing here really should be handled by a “project manager” — someone to work between designer and SEO specialist.
A manager should lead the designer in a myriad of ways, including NAMING directories and whatnot. The manager should make the design decisions to compliment what is needed for SEO.
I own a design business and I play manager to all of this, over-seeing the entire process. I lead the entire project and would never trust a designer to have to know these things.
Another added benefit of a manager is they typically move things along a bit faster… well, a good one does, at least.
My projects move along pretty swiftly orchestrating it this way.
All-in-all this list is great for those who don’t have the luxury of a manager. Again, I got A LOT out of it and will be passing it on to partners and associates.
Thanks
Erin
Reply
Mani Karthik
Replied:
Good thoughts there Erin. I agree, it works best when the SEO/SEO’s and the Design team work in sync. A project lay out with time frame and metrics defined will even more smoothen the process, and a project manager to manage the entire process is definitely “the” way to get things done on time. Its also important that the manager knows a bit of both sides.
The basic idea is that if web design team and seo work together, there are alwasys better results.
Reply
[...] 30 Web Design SEO Tips for Web Masters – Daily SEO blog Great SEO tips! (tags: design webdesign webdev webmaster) [...]
[...] Desinging made easy 30 Web Design SEO Tips for Web Masters – Daily SEO blog Marci Shimoff’s simple web design solution for authors with multiple .. The newbie guide to [...]
This is the second blog I have read on this topic.I am floored I never read this before. Thank for sharing.
Reply
hi..
Well That’s a pretty good list.
I follow most of them, but cane to know more of them through this list, surely would follow them.
In all great post.
Thanks..
Reply
Very Nice tips for seo based web designer. Is java script menu makes slow the web crawling rate? what’s the alternative, only css menu?
Reply
Nice points, thanks mani.
Reply
Great points Mani. It really helps to keep these in mind in the beginning rather than handing the design off to an SEO afterwards. It saves a lot of time and mess. And usability has no value until the site can be found to be used.
Reply
SEO Tips South Africa
Replied:
I can’t agree with you more, Stephan! You have to do this from the beginning, as trying to patch a site afterwards can be quite an exercise!
Reply
This post really serves to highlight the fact that you have to ensure your design meets with the necessary criteria for the search engine spiders to “see” your content. What they can’t see, the search engines can not offer to the world! W3C standards are good to adhere to.
Reply
Hey Mani,
thanks for these nice tips.
You haven’t talked about Ajax, I have used lot Ajax on my site. How does it effect SEO.
And also I have seen many sites which tops on Google uses lot of Meta tags. Normally used are only “description”, “keywords”, but there are other like “classification”, “abstract” etc. Does these also help in SEO.
thanks
Reply
Hi, Thanks for the SEO tips, I learnt many new things reading your SEO tips list.
Reply
Nice points, thanks mani
Reply
As a designer and SEO expert I like to read your post as it states the need of good design interms of SEO.
Reply
Great article – I’ve just started getting into SEO and intend to offer my clients better google ranking etc.
I’ve always designed my sites to the best specs and checked the markup and w3c ( and the css).
the tips you give above will make a good checklist for me to use going forward. Thank you
Reply
regarding the tip 27, i dont see it right. this is because when we talk about the link age from external page to internal page, google seo is always represent a very serious, and remarkable effort to deal with this.
by the way, this is the best seo article i seen before, except 27
Reply
Very nice info mani..Thanks
Reply
Nice post dude.. It would help designers to Keep in mind SEO factors while designing. Good learning for all.
Reply
great post man..
Reply
[...] Bron: 30 webdesign seo tups for webmasters Relevante items20 Web design tips…Webdesign Kapeljosie: waarom usability belangrijk is…Webdesign Kapeljosie: over Usability… [...]
This post is quite useful
I just wonder if joomla is more seo kindly than other?
Reply
[...] 30 web design seo tips for web masters (also true for bloggers). 4b) How to market your blog in 2007 (its true in 2009 and will be true in [...]
Personal experience on the SEO-Webdesigner conflict. I am one of the lucky persons having done a lot of web design before going for 2 years in expert SEO consulting before getting back in web design.
When getting back in this I understood the SEO implications and I started web designing sites with an SEO oriented objective. It actually worked out very well. My way of using and integrating CSS also changed in that sense.
It is a great experience and a really useful eye-opener.
Reply
Hi! Great summary!
But I have a few objections…
Tip 3
http://www.Seomoz.org “Expert opinion survey” acutally came to the conclusion that W3C compliance is NOT that important…
TIp 28
also add “nofollow” and “noindex” – sufficient in many cases
Reply
[...] Read The Entire Article [...]
great list thank you
Reply
Thanks mani for goor points
Reply
Mani excellent points!
Reply
Thanks Mani for these tips. I really like this summery and facts regarding SEO friendly web design. Great work and keep it up dear!
Reply
30 web design #SEO #Search Engine #Optimization tips for webmasters http://tinyurl.com/czuyto
Reply
Great blog. Clean and full of awesome SEO information. I will be back and have added you onto my feed.
A pleasure…
Thank you.
Reply
30 Web Design SEO Tips for Web Masters http://tinyurl.com/czuyto
Reply
nice post, all tips are search engine friendly as well as user friendly. good job.
Reply
[...] 30 Web Design SEO Tips for Web Masters – Daily SEO blog Very important for any designer to remember, or be reminded of. As I finally get closer to starting the redesign of my blog, this is great info to have around (tags: business tips webdesign seo) [...]
Great tips !!!
Thanks for a really good and well written articles.
Reply
Thanks for sharing these useful tips!
Reply
Great selection of Websites, some really nice designs! I’m currently working on a new website. You really helped me out here. thx
Reply