When SEO and Web Development Collide
This YouMoz entry was submitted by one of our community members. The author’s views are entirely their own (excluding an unlikely case of hypnosis) and may not reflect the views of Moz.
SEO and Web Development were once thought off as two separate tasks, recently there has been a lot of talk that suggests that both developers and SEO’s need to communicate better. I myself work in the SEO industry but I am also a developer so when developing websites I know exactly what needs to be done and how to do it. The talking point among SEO’s at the moment seems to be website speed and how Google will use this in its algorithm. Website speed looks like it would be a solid addition to the Google algorithm as having websites that take forever to load at the top of the rankings does not give a good user experience.
Another ranking factor that marries both web developers and SEO’s is clean source code, for example making sure that all the correct tags are listed within your head tags and having your content display within the first one or two lines of your body tag.
Website Speed
Let’s look closer at website speed; there are many ways to reduce the load time of a website, some more effective than others. The best place to start is with resources loaded by your homepage; this means JavaScript files, CSS and Images. Ask your developer nicely to reduce the amount of white space within the JavaScript and CSS files and reduce the number of each to a maximum of two files, which will reduce the number of server calls.
Reducing the number of server resource calls will have a major impact on how fast your website loads, a browser can only download 4 resources from the same domain, so the more server calls there are the longer a website takes to load. This brings me to my next point, any resources which are not called within the head of your website could be placed on a sub domain, and this allows for your resources to be downloaded in parallel and in turn knocks a good chunk off the load time.
When it comes to Images, 20% of images I’ve seen being used can be replicated using simple CSS borders and background colours. Images that can’t be replicated should be resized to the exact size they will be displayed at and have their file size cut to as low as possible.
Before and After Optimisation
Clean Source Code
When it comes to source code Web Developers and SEO’s have a different idea of what they should see, the majority of Web Developers like to see the source code replicate what they see displayed within their browser whereas SEO’s like to see the content being loaded straight within the first few lines of the body tag.
Another change that is important is the last modified header; I believe this should be entered on every page as it tells search bots if your content is fresh or not, something that we all know Google loves. Adding the last modified header to your pages is easy as most CMS systems record the last edited time of the content within the database so it’s just a case of calling the data with a few lines of code.
When developing a website the mark-up I usually go for is:
<head>
<title></title>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<meta http-equiv="last-modified" content=""/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href=" " type="text/css" rel="stylesheet" />
<script src="" type="text/javascript"></script>
<meta name="robots" content="" />
</head>
<body>
<div>
<h1></h1>
<h2></h2>
<p></p>
After the content I usually code in my navigation then my footer, but I display my navigation at the top for users by using absolute positioning. This setup allows the search bot to get right into the most important part of your website – your content, missing out the rubbish usually seen before it.
By working closely with your developer there is no reason why any of these suggestions I’ve made can’t be auctioned. Just remember to respect your developer and he/she will respect you.
Comments
Please keep your comments TAGFEE by following the community etiquette
Comments are closed. Got a burning question? Head to our Q&A section to start a new conversation.