SEO in Web Design
Over the past decade, the website has increasingly become the front door for businesses. For a long time, that meant putting resources into making the coolest looking website possible.
However, that led to a growth of supremely talented designers who didn’t pay much attention to SEO in web design. Header tags were strictly used as design elements, and headers and nav were packed with flash and images.
In his book Content Chemistry, Andy Crestodina notes,“The first three spots in Google searches get 58.4% of all clicks…Ranking first drives almost three times as much traffic as ranking second.”
What is the use of a beautiful website, if you can’t get anyone to see it? What if the best chef in the world opens a restaurant, but no one knows where it is ? Therefore, it’s imperative for designers and programmers to learn the basics of SEO.
Find a Good SEO Site Crawler
There are many free tools you can use to crawl your website and find SEO errors. One I can recommend is Screaming Frog SEO Spider (note that you do have to download this program into your computer) or the MozBar add-on for Chrome.
These free programs will crawl your website just like a search engine would and give you information on how your site ranks and what issues it has with regard to search optimization.. Important items for optimization include:
Page Meta Titles
Each page of a site must have a unique meta title. Make sure your primary keyword for that page is at the front of the meta title and the website name is at the back. This is what appears in the tab at the top of the browser.
Bad: AllRecipes | Chicken Fried Steak
Bad: Chicken Fried Steak-Recipes-Steak-Chicken | AllRecipes
Page descriptions do not affect your search results, but they appear under the link when it is posted on Facebook or shows up in Google results. It is what entices someone to click the link.
Make a specific description for each page in your site so users know where a link will take them. This will also help you avoid being penalized by Google–your website cannot have duplicate meta descriptions on any pages; each page’s meta description must be unique.
Well written meta descriptions can also help reduce bounce rate–people leaving your site after only visiting one page–by giving searchers a very clear idea of what they will find when they visit the page. A high bounce rate can hurt your site‘s search rankings
<h1> and <h2> Tags
Header tags are not just for formatting text – they tell crawlers, “This part of the page is really important and has keywords that should show up in search results. You can only have one <h1> – if you designate more than one <h1> tag, the crawler will only read the first one. You can have more than one <h2> tag. Check out this video about how to use header tags.
Image Alt Text and Title
An SEO crawler can also tell you if your images are optimized for search. Take a look at this post I wrote about optimizing images for search.
If you haven’t heard about schema, it’s time to familiarize yourself. Schema was established in 2011 and is a way for search engines to better understand your site.
Now, it is rumored that an upcoming Google algorithm update will lower the rankings of websites that are missing schema markups in search results.
Furthermore, schema is an important part of local SEO that you will need to get into Google’s local pack.
Now Your Site is Ready for Search
Remember that design is important, but you have to optimize to allow users to find the beautiful sites that you have created. Now back to work!