Build­ing SEO tem­plates is about effi­ciency. SEO peo­ple are hard-nosed peo­ple. We need to spent our time as effec­tive as pos­si­ble. The SEO tem­plate is one way in achiev­ing that objective.

Mak­ing web­sites and design­ing web­sites should be made faster and eas­ier. You came here because you hope the time it takes to read this post will make you a more capa­ble per­son in what­ever area you want to be more capa­ble in. Using nam­ing con­ven­tions in both your css and web­site tem­plate does just that.

I promise you up front. You won’t find any­thing like this any­where else on the web. That means you can be ahead of your competition!

What I’ve done is opti­mized the css. A stan­dard css file can lit­er­ally have hun­dreds of lines of code. A great deal of time mak­ing a web­site will be spend edit­ing css. What a good seo tem­plate should do is min­i­mize the time search­ing for the right code so you can max­imise your seo efforts or just have a nice web­site up and run­ning faster. E.g. hav­ing a css template.

Step 1: Build­ing a CSS template

You can skip this step and just down­load the seo tem­plate. What I will do here is what’s in the included css tem­plate file.

• Color Pro­file: Are you one of those peo­ple hav­ing your web­site col­ors on post-its. Not any­more. Put the hex codes in the Color Pro­file sec­tion and they’re there for eternity.
• CSS Reset: Min­i­mize Browser Com­pat­i­bil­ity issues related to CSS with Meyerweb’s CSS Reset
• Main Styles: Header tags, para­graphs, lists, all stan­dard HTML com­pli­ant tags go here
• ID’s
• Nav­i­ga­tion
• Images
• Classes: When design­ing for one of the major CMS’s like Word­Press or Joomla you tend to edit your CSS after instal­la­tion because a CMS can add a lot of classes to your HTML. Sep­a­rate them from the rest because they are over­ruled by ID’s.

Step 2: Using a CSS nam­ing convention

The seo tem­plate uses the same nam­ing con­ven­tion. If you don’t like the one I use in the web­site tem­plate use your own as long as you use one. This way you can quickly edit the CSS because you tar­get the right rule. The main rea­son I never use Tem­plates even if they look frig­gin’ fan­tas­tic is because I’ll spent way too much time fig­ur­ing out the CSS and HTML.
The seo tem­plate has the fol­low­ing nam­ing con­ven­tion in its HTML and CSS

#header;
#header_container;
#logo; #nav

#ban­ner;
#banner_container

#con­tent;
#content_container1;
#content_container1 #product_left
#content_container1 #product_mid1
#content_container1 #product_mid2
#content_container1 #product_right
#content_container2;
#content_container2 #product_left
#content_container2 #product_mid
#content_container2 #product_right
#content_container3;
#content_container3 #product_left
#content_container3 #product_right
#content_container4;
#content_container4 #product_left
#content_container4 #product_right

#footer;
#footer_container1;
#footer_container1 #category_left,
#footer_container1 #category_mid1,
#footer_container1 #category_mid2,
#footer_container1 #category_right
#footer_container2;
#footer_copyright_left
#footer_copyright_right

You don’t have to be a genius to under­stand what’s being said here and that’s the whole point. I know this is so sim­ple that it’s effec­tive­ness is often over­looked, but remember:

Com­mon sense is not com­mon practice.

No related posts.