Filter By:

SEO Friendly Design – Part 5: Readability & coding

Continuing our discussion of search engine friendly design considerations I offer you part 5 of a 6 part series on SEO friendly design:


SEO is important but with a little style and effort you can get the job done without compromising the “vibe” of your site. Presentation in web design is everything and people do not visit or link to sites that are hard to read and do not please the eye.

I’m sure you’ve seen the culprits in the past where people have clearly “tried” to optimize their site for specific keywords and you’ve asked yourself as you’re reading through the text “Has this person made it through high school English?”. Words seem to be out of place and overused, possibly repeated in places where they’re not necessary. Below is an example of what I’m referring to. (Reminder, this is bad so I’ll keep it short)

As an SEO friendly designer, SEO friendly design is important to my SEO friendly design campaigns because SEO friendly design is the way to design an SEO friendly page.

Man, I hope I don’t get penalized for stuffing my page with keywords but I had to illustrate my point! Hopefully I’ve driven my point home about what not to do. If you write content like the aforementioned text above, people will think you’re an idiot and they’ll never return. That’s even if they find you in the first place because Google hates content like this. Their spiders are smart and becoming smarter every day. They KNOW this is not a normal way of speaking and they know that words are being overused in one sentence.

The most important thing to note is that humans will not enjoy reading content like this so don’t do it. Take the time to write great content, use your keywords in the page title, the article title, the first sentence, sprinkle them throughout as needed and try to finish up the article with your keywords. Just make sure to write naturally and do not use words to the point where they sound unnatural.

Manhandle your code

If you have a talent for manipulating your website code, take some time to learn CSS and HTML because it provides very precise control over the layout of your pages. CSS/HTML is easy to learn and with a little bit of reading you’ll go a long way. Even if you have no interest in learning code you should take the time to learn the absolute basics like the break tag, paragraph tag, how to make a link, etc. and then retain a quality programmer to help you manipulate the code on your pages as needed.

When designing a page that’s SEO friendly, design your page so it makes sense visually but maintain control of the code behind the scenes. A good programmer with SEO skills will know how to do this so make sure to ask when hiring.

One of the first things you can do is minimize programming code at the top of the page. Search engines only index a certain number of lines on your page so you want your content to be the focus. If you have a lot of javascript on your page or fancy scripts running for this and that, take the time to put this code in an external file and link to it with one line of code.

The thing you should consider is positioning your content and keywords toward the top of the page. In the old days of table-based HTML layouts, you were somewhat stuck regarding the order of the code on your page. If you had a header, a left column for navigation and then your content on the right, this is the order that the code appeared on the page. So depending on the amount of code required to pull this off, the actual content of the page might appear hundreds or even thousands of lines down and possibly never get indexed. This is not true with CSS.

With CSS you can place elements on the page any way you want and with precision. You can also order this code on your page and it will still render properly when the page is viewed in a browser. You an essentially place your header at the bottom of the code but based on the CSS code you can position it as the first thing on the page.

My point in telling you all this is to get you to place your CONTENT first in your code so it all gets indexed. CSS is the vehicle that allows this so take the time to learn what’s possible or insist that your designer program your pages with CSS and place your content block at the top of the HTML code.

Lastly, make sure to properly label your graphic elements. Search engines can’t read images so they have to rely on HTML code to determine what the image contains. If you have an image of a rooster on your page, use the alt tag in the image code to label this image as alt=”rooster”.

You may also consider naming the image file name in a way that is descriptive. For obvious reasons it’s a much better practice to name your rooster image as rooster.jpg instead of image1b.jpg. The latter means nothing to the search spiders and it probably doesn’t mean much to you either. Label your images in a clear way and it will help the search spiders learn about your page content and it will surely keep you sane as you manage the files within your site.

Share this:
About Chris Auman:

Chris Auman is a veteran digital marketer with over 25 years of experience in the trenches. As Sanctuary’s founder and President, Chris has successfully guided online marketing efforts for companies large and small.

Learn more about Chris.

Related Articles:

Articles, News, Videos, Podcasts and more! Subscribe for our Academy newsletter for updates and future benefits.

Security Icon

Your privacy is a priority. View our Privacy Policy.

The Academy is a service of Logo