Effective Search Engine Optimization for Web Designers

Many clients ask their web designers to optimize their website to increase visibility with search engines and to attract more visitors. Some designers and agencies offer specific SEO (search engine optimization) services and others want nothing to do with SEO. Most clients that ask for a search engine optimized website understand very little about what is involved in SEO and what it takes to achieve top rankings for competitive keywords.

Because web design and SEO are closely related, it’s a topic that designers are frequently asked about, but there is often a lot of gray area about what is the responsibility of the designer and what is within the designer’s power. While many clients want the designer to create a website that ranks well and attracts targeted visitors, SEO is really an ongoing process that involves much more than the design and coding of the site. Things like keyword research, content development, and link building are also critical aspects of optimizing a website for search engines, and typically these are all ongoing processes.

Although SEO involves much more than just design, there is still a lot that the designer can do to set the foundation for an optimized website. If the designer creates a search engine-friendly site any future and ongoing SEO efforts will have a greater impact. In my opinion, web design and SEO are separate services, and a designer cannot create a truly optimized website without other pieces to the puzzle. The designer should create a search-friendly site and educate clients on what else will need to be done (such as content development and link building) in order to effectively optimize the site for searches.

In this post we’ll take a detailed look at the subject of web designers and SEO and many of the issues that are involved.

What is the Designer’s Responsibility in Terms of SEO?

As was mentioned in the intro, the designer should create a website that is search engine-friendly and will set the foundation for all other SEO efforts. What does it mean to be search engine-friendly? Essentially the term recognizes that design and coding of a site only has so much impact on search engine rankings. A search-friendly site will make it easy for search engines to find the content, determine what the site and pages are really about, and allow the site to rank as high as possible based on the content of the site. However, a search-friendly website needs more work to be truly optimized for search engines. For a detailed look at what makes a website search engine-friendly see How to Create Search Engine Friendly Websites by Cape Cod SEO. We’ll take a detailed look at some of the specifics later in this article.

In addition to building a search-friendly site, the designer should also discuss the subject of search engine rankings with the client to explain what else needs to be done on top of having a search-friendly site, and also should work with the client to identify keywords and phrases to help the client reach the right visitors. In some cases the client will already have identified the words and phrases they want to target, but some clients may not have even considered this before hiring a designer.

Why Does SEO Matter to Designers?

If web design and search engine optimization are really two different services, why should SEO matter to designers? For starters, some designers and agencies offer both services, so naturally there will be some overlap and SEO must be taken into consideration during the design process.

Even for those designers that do not offer specific SEO services, clients hire a designer to get results. While the client’s opinion of the designer will certainly be impacted by the visual appeal and aesthetics of the design, what most businesses really want from a new website design is impact. If it’s an e-commerce site, they will want to sell more products. If it’s a blog, they will want more traffic, subscribers, and interaction in the comments. If it’s a service-oriented business, they will want more inquiries and ultimately more customers/clients that are generated from the site.

If a designer wants to keep clients happy and pick up more referral business, the designer should be equally concerned about the results that are achieved through the site as the visual appeal of the design. Regardless of the type of website being designed and developed, search engine traffic can help to achieve the desired results.

Since search engine traffic is so instrumental in the success of client websites, the designer should be well versed in building search-friendly websites and should give each site a chance to rank well. Otherwise, the designer may create sites that look great but ultimately wind up as a disappointment to clients.

The SEO Limitations of a Designer

Although the design and development process is critical to establishing a solid foundation for search engine optimization, there is only so much that can be done by the designer. Assuming the designer is not also providing services for content development, link building, and social media marketing, the chances of a site ranking well for highly competitive search phrases based solely on the work of the designer/coder are very slim. If the site is already well established in its industry and has considerable number of quality inbound links it will have a chance to rank well, otherwise, building a search-friendly site is just the start.

Web designers are frequently asked by clients to create an optimized website that will rank highly for their targeted search phrases, but unfortunately there is no magic wand that a designer can wave to achieve top rankings without other work. The design and coding of the site is simply one piece to the puzzle. The designer should educate clients on the basics of SEO and what will need to be done to achieve top rankings, or should help the client to identify less-competitive search phrases that may be achievable with a search engine-friendly site and some basic content development.

What Designers Shouldn’t Do

Because the design and coding of the site is really the foundation of SEO, it is important for setting things up properly, but it’s also important to not do anything that could cause this foundation to be unstable. Black hat SEO (anything that attempts to deceive the search engines and violates Google’s guidelines) may help a client to achieve better rankings in the short-term, but could seriously harm the site in the long run. Designers should have a basic understanding of SEO and what could potentially harm the rankings of their clients in order to avoid these situations.

Additionally, designers should avoid making promises like “I can create a site for you that will rank on the first page of Google for X keyword.” Particularly if the designer is providing just design and coding services and not additional SEO services, there is only so much that the designer can control and promises like this will often be difficult to keep. When clients ask for a site that will achieve specific search rankings, the best thing to do is to explain what is involved in optimizing a website, offer your help for the services that you provide, and recommend someone else for specific SEO-related services if there are parts that you do not offer.

Effective SEO for Web Designers

Now that we have discussed the role of the designer in the SEO process and why search traffic should be considered by designers, we’ll take a look at some specific things that designers can do to create a search-friendly site for clients. For the purposes of this article, references to web design are intended to include front end development (HTML/CSS coding) as well as visual design.

1. Thoroughly Discuss the Topic of SEO with Clients and Help Them to Determine Which Keywords Should be Targeted

At the start of any design project it is helpful to discuss the topic of search engine optimization with clients. This is helpful for a few key reasons: 1) If the client has unrealistic expectations about a designer being able to create a site that will rank highly, it is helpful to educate them on the breadth of SEO and the role of design as one aspect, and 2) The designer and the client need to work together to determine what search phrases should be targeted and how the site should be optimized. The client always knows their business and customers better than the designer, so it’s critical that they are involved in determining what search phrases should be targeted.

2. Basic Keyword Research

If the client has not considered or is not sure what keywords and phrases they want to target, the designer can assist them by doing some basic keyword research to determine which phrases searchers are using, what related phrases are also possibilities, and how much competition exists for these phrases. There a lot of tools and software available for keyword research, but the Google AdWords Keyword Tool is sufficient for basic research (and it’s free). With this tool you can enter some words or phrases, receive data on the number of searches that are done on a monthly basis for them, see the level of competition for AdWords (which is often representative of the level of competition for organic search results as well), and receive a list of suggested or related phrases.

Even if the client has already identified the phrases that they want to target, it’s not a bad idea for the designer to do some basic keyword research anyway. There may be other words and phrases not identified by the client that could be better in terms of number of searches or competition for rankings. Additionally, if clients have identified targeted phrases without doing any research it may be helpful to show them the level of competition that they will face by targeting these phrases and how that compares to the level of competition for other similar phrases.

3. Discuss Page Titles with Clients to Create Optimized Titles

The most important on-page factor for SEO is the page title. Ideally, page titles should include the targeted words and phrases in order to provide the best match when someone searches for the targeted word or phrase. Titles can include other text in addition to the targeted phrases, but the targeted phrase should be included in the title. Of course, each page on the site should have its own title and can be intended to target a different search phrase. For example, a photographer’s website may have a homepage with a title that targets the phrase “Philadelphia photographer” and secondary pages could target separate, but related, phrases like “Philadelphia wedding photographer” or “Philadelphia landscape photographer”.

Because page titles are so influential in search rankings, designers should discuss them with clients (at least on key pages) and use the keyword research to aid in determining what should be used for the titles. For clients that use WordPress, designers can install the All in One SEO Pack plugin that will allow users to control page titles on any pages and posts that they create.

4. Clean Code

Part of having a search friendly site is using clean code that makes it easy for search engine spiders to crawl the pages. If search engines have a hard time determining the content of a page it is unlikely to rank very well (see What Beautiful HTML Code Looks Like from CSS Tricks for an example of good code). CSS-based layouts makes it much easier to keep the HTML code clean by separating the content and the design, as opposed to table-based layouts.

5. Keep Primary Content High in the Code

The main content of a page should be located as high as possible within the HTML code of the page. Within the body, the header content will typically appear first, but the main content of the page should appear above sidebar content. Even if the sidebar is shown to the left of the content on the screen, a CSS-based layout can be used so that the content is still placed above the sidebar content in the code. Keeping the main content higher means that search engine spiders will find it quicker and they’ll have an easier time recognizing what they page is truly about.

6. Use Headers and Sub-Headers Appropriately

Heading tags (such as h1, h2, h3, etc.) should be used to indicate headers and sub-headers within pages. While it is possible to achieve the same look by setting font weight, style, or size without using header tags, the header tags indicate importance and structure for search engines. They make it easier for search engines to know what is being emphasized on the page, and they can help the designer to be able to target specific phrases.

7. Use Internal Links to Help Visitors and Search Engines Find the Important Content

Throughout this article we have talked about link building as an important part of SEO. Attracting links from other high-quality sites to pages on your own site (or your client’s site) is a critical part of achieving high search engine rankings, but internal links (a link from one page to another page on the site site) are also important. In general, search engines will assume that the pages that have the most internal links pointing towards them are most important. For instance, if every page on a site includes a link to a particular page that includes detailed information about a product, it would be logical to assume that the product detail page is pretty important.

Using internal links effectively can make it easier for search engine spiders to crawl through the site and find all of the content/pages, plus effective internal linking will make a site easy to use and navigate for visitors, which is ultimately more important than search engine rankings.

8. Use Appropriate Anchor Text

The anchor text (the clickable text in a link) is also important for search engine rankings, both from internal and external links. For the purposes of this article we’ll stick with internal links, since that is what the designer can control. Ideally, anchor text should match up with the targeted phrases or at least include them within a larger phrase of anchor text.

Using keywords and phrases in the anchor text helps to indicate to search engines the topic of the page that is being linked to. For optimization purposes it is better to use keyword-rich anchor text as opposed to “click here”.

9. Set Up a Sitemap

There are two different types of sitemaps and the each have their own purpose. XML sitemaps or Google sitemaps are not intended to be used by human visitors, rather they exist to help search engines find all of the important content of a site. An XML sitemap makes it easier for the search engine spiders to crawl the site and it reduces the chance of a spider missing a certain page and not including it in the index. WordPress-based sites can use the Google XML Sitemaps plugin to automate the process, and for other types of sites you can use a tool like XML-Sitemaps.

HTML sitemaps are intended to be used by human visitors as a way to find specific content on the site, however, they also have an SEO-related purpose. While HTML sitemaps are primarily intended for human visitors, they also provide an opportunity to use internal links to point towards all of the important pages of a site. When the search engine spiders find the sitemap they will be able to easily crawl through the site using the sitemap and the links in the sitemap can help the search engine to determine the important pages on the site (for large sites that don’t include a link to every page on the sitemap).

10. Use Friendly URLs

The URL of a page can have some impact on its search engine rankings, so it is best to use keywords or phrases within the URL. The ideal URL will include the important words or phrases that will tell both human visitors and search engines what the page is about without being ridiculously long. Very long URLs make it harder for users to copy and paste, email, and write down, and search engines also prefer shorter URLs.

Hyphens or underscores are often used as a way to separate words in a URL. This can make it easier for visitors and search engines to read the URL and determine the keywords. Most content management systems will allow you to have some control over the URLs that are created.

11. Use Alt Text on Images

Images and photos used on pages should include alt text for describing the image. The primary purpose of alt text is for accessibility and usability purposes, including screen readers for handicapped users. With effective alt text it is possible to know the purpose or the point of an image without even seeing it. For SEO purposes, keywords or phrases can be used in the alt text for a small boost. Alt text shouldn’t be used strictly for SEO purposes at the expense of usability, but it is helpful to use targeted words or phrases in the alt text when possible and appropriate.

12. Canonical Re-Direct

Search engines view http://example.com and http://www.example.com as two different pages (one has www and one does not). A canonical re-direct is helpful because it indicates to search engines which version of the page is preferred and eliminates the need to view them as two separate pages. Without a canonical re-direct search engine rankings may suffer. A re-direct can be setup in the .htaccess file, see 301 Redirects and www/non-www Canonical Problems.

13. Minimize Page Load Time

Page load time is important for user experience, and also in recent months Google has indicated that it will become more influential on search engine rankings as well. Minimizing load time is a rather large topic that could justify an article of its own (see How to Minimize Load Time for Fast User Experiences) but we’ll quickly look at a few issues here. Things like images, audio and video, as well as calls to a database will increase load time of pages. In general, the connection speed of most internet users has increased in recent years so larger page files and slower loading pages are not as big of a nuisance to most visitors today. However, it is still helpful to optimize files and use tools like YSlow to determine what can be optimized further.

Conclusion:

While design is only a part of the SEO process, there are a number of on-page factors that a designer can, and should, control in order to build a search-friendly website. In situations where clients have unrealistic expectations for what a design can accomplish without efforts for building links or adding optimized content, the designer should communicate with the client to educate them on the basic factors that determine search rankings and what needs to be done in order to rank well for competitive phrases. Feel free to share your own opinions and experiences in the comments.

Published June 9th, 2010 by

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads. Visit WPEngine.

Join Our Newsletter!

Subscribe to our weekly newsletter chalked full of useful tips, techniques, and design goodies. We have 20,000+ loyal readers and counting! We’ll even send you a free e-book (Freelance Designer’s Guide to Multiple Income Streams) and a $10 discount on our most popular product the Freelance Starter Kit.

43 Responses

Comments are now closed on this post.

  • James Macfie, June 9, 2010

    Excellent article – I think even pointing prospective clients to this page will help most designers in their cause to educate clients aswell.

  • Aurora Designs, June 9, 2010

    very good topic and very detailed article, I am blown away with all this detail, I personally perfer to mke flash websites how ever it is important that every designer include flash alternate content using swfobject or any other to make their website more seo friendly.

    thank you.

  • Laira, June 9, 2010

    a very nice and useful article..Thanks for sharing this one….

  • Jack harris, June 9, 2010

    Very nice blog!! The experts at Ranking Solutions have in-depth knowledge and up-to-date information about search engine industry and endeavour to meet the mission and vision of clients. We offer our proven Search Engine Optimisation tactics to help you gain competitive ranking in search engines.

  • Vandelay Website Design, June 9, 2010

    James,
    Thank you. I hope the articles proves to be useful for your clients as well.

    Aurora,
    Yes, the subject of Flash designs was not specifically covered here but SEO is important (maybe even more so) in those cases.

  • Aric, June 9, 2010

    Excellent advice. I have a couple situations where I had to explain to a client that I as the designer can only do so much. The rest of the necessary items needed for good SEO need to be considered in the content. Since I am not the content creator, the client needs to take that over.

    Now I am able to cite a source when a new client asks me why I can’t make their site 100% SEO friendly. I can only do 45%, the rest is up to them.

    All good tips, and things I will be writing up a checklist for.

    Cheers

  • Kory, June 9, 2010

    Thanks for sharing the information about canonical re-directs and the importance of internal linking. The part about the one page everything links to being the most important was an eye opener.

  • Eric Schiller, June 9, 2010

    Interesting coincidence, I’ve been writing a post on this very same topic all afternoon, and then just found this one a bit ago. I like the angle you took, offering web designers ideas in how to do better SEO for their clients. My post specifically goes into the mistakes shows examples, and how they can be fixed, instead of offering a guide for designers. Great minds think alike I guess. Here’s my post: http://blog.inkd.com/resources/the-top-12-seo-mistakes-designers-make

  • Grace, June 9, 2010

    This is a great guide for web designers! As an internet marketing strategist, I always stress to my clients that a great design will help their conversion rates tremendously. With, or without SEO.

    And while there some things web designers can do, like minimizing page load times, using search engine friendly URLs and keywords, things like link building and content promotion are beyond the scope of their job.

    and @Aurora – it is a general rule of thumb to avoid building Flash websites, because by nature, they are not search engine friendly. Of course, if your client isn’t relying on Google to bring in traffic or sales, then Flash is perfectly acceptable.

  • Stacy Timber, June 10, 2010

    Very Useful information , this is both good reading for, have quite a few good key points, and I learn some new stuff from it too, thanks for sharing your information..

  • Nice article. I’ve been doing SEO for a long time and have an SEO blog at MA-SEO-Company.com that has a few good articles you might like as well. I always enjoy sharing information, because knowing SEO is like knowing “God”, and Google and God both start with “Go”, so they’re not too far apart, at least lexigraphically.

  • amanda pixen, June 10, 2010

    What a great article! It’s very detailed. I think it’s very useful to web designers.

  • Vicky Mohring, June 10, 2010

    Fantastic article and just at the right time as have a client who wants seo included in their site so this is really helpful!

    With regards to ‘keeping primary content high in the code’ can anyone point me in the right direction as to how to go about this? Any examples on how to get the main content to appear above the side bar would be much appreciated. Have recently moved from tables to css and div tags so still learning!

  • marianney, June 10, 2010

    great article, thank you! i’ve tagged it in my delicious account for future reference. it’s nice to have some “backup” and good explanations to give to clients on why you can’t do 100% of their SEO work for them, but as web designers we still need to do as much as we can up front.

    one thing however, you mention “Hyphens or underscores are often used as a way to separate words in a URL.”
    in fact, only hyphens should be used in URL’s for now and not underscores. the main reasons being:
    1. Google was built by programmers. They thought of underscores as joining words.
    2. Hyphens do a good job of separating words. Underscores are often not seen, and users wonder if it’s a space or an underscore, because links get underlined.

    for more info on this and where i got the quotes from: http://pixelposition.com/hyphens-underscores/

  • Mal Milligan, June 10, 2010

    On-page SEO is half the battle and web designers can do a lot of the heavy lifting if they want to… it does not take very long for a small site. That includes all the steps mentioned above. I would suggest NOT leaving the meta titles and meta descriptions blank… or putting the same title tag on every page. Those are the 2 most common mistakes I’ve seen in the last 9 years. The other helpful SEO list items I would add include verifying the site with Google WebMaster Tools, and it’s equivalent in Yahoo and Bing. Also having more than 300 or 350 words per page is a good idea. Regards everyone. Mal

  • Richard, June 11, 2010

    Thank you, I’m a newbie. This guide is really useful

  • Smashing Buzz, June 13, 2010

    nice article with detailed information. thanks for sharing

  • Kliky, June 13, 2010

    Should mention that when doing a redesign, you should always analyze the incoming links create 301 redirects to any new page names. If there is a single page responsible for a large portion of a site’s traffic it might be worth leaving the page content alone (first do no harm).

  • Hi,
    Thanks for sharing this great and resourceful post, I really like to read you information your all tips are too useful for all post readers. We see many SEO companies they all are providing Internet marketing services but they have no guarantee for his services but we are guaranteed to give our best to our clients.

  • Freelance Website Design, June 14, 2010

    Heck yeah! Awesome information; reading everything you have here. SEO is tricky and so involved, but we’d love to get to the point of being able to not only produce a search-friendly website, but also provide search engine optimization as an additional service. Thanks for the great info.

  • Danny Foo, June 14, 2010

    A question popped into my mind halfway through the article.

    Is the web designer responsible for the client’s SEO?

    Can you design SEO? I’ll answer that question with a, no. And I’m saying this because, isn’t a website designer’s job to design a website which communicates the client’s products/services best?

    In my humble opinion, SEO is all about content. So when I think about this, are website designer’s the copywriters too? Yes, we can create a semantic website but is SEO really a designer’s responsibility when creating the client’s website?

    Just my 2 cents of thought. :)

    • Vandelay Website Design, June 14, 2010

      Danny,
      I agree with you that SEO and Design are two separate services and the design is not necessarily responsible for SEO. However, that doesn’t mean that the designer shouldn’t consider SEO. Without building the site to be search friendly, the designer could damage the site’s changes of ranking well later.

  • Niklas, June 14, 2010

    Very nice article, some really good recommendations. As an SEO consultant it is often hard to explain to clients why I can’t give them the perfect result they are asking for. And it’s always because their site doesn’t have some of the most basic On-page support. This article should help them understand what I am talking about. I wish every company creating a new website would force their webdesigner to read this post before creating the actual site.

  • WebDesigner, June 14, 2010

    Thank you for these important things to remember !!!

  • Web Templates, June 14, 2010

    I am a firm believer that designers must have a basic understanding of SEO. There are so many design items that could impact the sites ability to rank well. I’m not saying the designer must do the SEO, but they need to understand how it works so that they can cater their design to work well when SEO is implemented.

  • Nikunj, June 14, 2010

    Nice article, implementing basic SEO is must for every website.

  • Adomas, June 15, 2010

    Great article for making a point for my colleagues/clients :)

  • Saratoga Web Design, June 15, 2010

    Well done, this article is very helpful! Having an amazing web site is one thing, having an amazing web site with proper SEO techniques really advances the site!

  • CodeMyConcept, June 15, 2010

    This is going on my bookmarks right now!
    incredibly detailed and useful, not only as a guide for ourselves but to educate people on what matters about SEO

  • ff-webdesigner, June 16, 2010

    I’s say it is most important to us as webdesigners to make it clear that about 50% of the ranking of any web page comes straight out of the content. Thus: Make your customers think about what terms the’d like to be found with. Let them order all that in groups of 1-5 keywords in an excel file. Assign pages to any of the line. Use these words about 3-4% each of the total word count on every page.

  • Design Maker India, June 18, 2010

    Its really great article. I have recently started SEO but i have one problem that my website is not staying in one position can you please guide me why this so?. I appreciate your comments.

  • SEOP Inc., June 25, 2010

    Great post. Web designers should at least know the basics of SEO so that they can work easier with SEO and the demands for the website to be optimized. These tips are very helpful because these are the essentials as far as on-page SEO, which is where the designer gets involved. Thanks for sharing.

  • www.knowbuzz.com, July 5, 2010

    It simply means that effective seo is impossible. Right ?

  • naylon, July 16, 2010

    What a great article! It’s very detailed. I think it’s very useful to web designers.

  • searchlackey, July 27, 2010

    Very nice article. Thank you very much for the information. SEO is very involved and at times can get complicated.

  • Josefina Agüello, August 27, 2010

    The designer should only be responsible for semantic code, applicable meta data, and to a lesser extent, keyword usage.

    As far as a link-building/link-baiting strategy and content creation… If a designer were to take on such a role, I would think it would come at an additional cost that is rather substantial, since it would be more of a long-term support-type contract rather than a one-time design/development job.

    Josefina Argüello – primero en google

  • Karen Cioffi, October 24, 2010

    Found this a bit late, but glad I did. I’m not a designer, but I do my own sites and this information is great. Thanks!

  • Stacy Renee, January 22, 2011

    Very cool, I am just starting to learn about search engine optimization, so I am reading every article I can find, thank you very much for yours.

    Stacy Renee

  • Stuart, March 6, 2011

    Fantastic post and very informative for both new and old SEO’s, every day is a learning day in SEO :-)

  • Judith @ Define Blogging, March 17, 2011

    This is the first time I read a post about SEO from the designer’s point of view, and I find it really interesting. Most of the stuff mentioned is the bread and butter for SEO’s, but it’s great that designers can also make use of these powerful tips. Good job!

    Judith Baker

  • Ruben Licera, April 14, 2011

    Great post . There truly has been a ton of changes over the last year that have shaken up the way many SEO’s optimize and rank websites. It will be interesting to see what happens this year as Google continues to tweak their algo to “week out more spam sites” and clean up the SERPs.

  • Jenni, July 12, 2011

    I suggest we should bring the main content higher in the page source code to get more ranking in SERP.

  • Marcus Slinger, February 19, 2013

    I have to agree with all of the points that you have made in the post, SEO and website design are very closely related and you have to ensure that the two are combined together in synergy. This makes sure customers are both attracted to the site and find it in the first place.