Let’s talk about well-written code when it comes to search engine marketing.It's too easy (when using WYSIWYG editors) to get caught up in bloated code due to library items while developing includes. In most cases, designers are building out the includes in their own pages. With WYSIWYG, this causes the JavaScript that are generated to handle image rollovers and such to be added to the includes page, and on-load event handlers to be added to the body tag of the library item or include as well.
So what's the problem? The problem occurs when you pull the library items into your templates to be used throughout the web design. The library items already have html opening and closing tags and body tags, when you drop them into your pre-built templates, you have two sets of html tags in your code. In some cases, I have seen up to four sets of html tags inside one page.
Code bloat is a Search Engine Optimization nightmare just waiting to happen. Imagine the robots (or search engine crawlers) coming through your site and reading through 100 lines of well-written code that uses external .css and .js pages to include event handlers and styles versus a page that has over a thousand lines of code to do the same thing. And, to top it off when, you use JavaScript and CSS stylesheets (if you do not externally include them) these will be in the head tag of your html, (for non-web pros that’s the behind-the-scenes beginning of the page) forcing the robots to read through tons of gibberish that they do not want or need before getting to your good stuff, the well-written keyword copy that you spent so much time creating.
In a lot of cases, these robots will get sidetracked and move out of your pages before they get a chance to index them. Basically, all of your hard work and research is thrown out by poor web design practices.
How do you know if your site is being held hostage by bloated code? Launch your website in the browser and view your source code. Do you see more than one body tag? More than one set of opening and closing html tags? Do you have a hundred or so lines of code at the beginning of your pages that have nothing to do with your site’s content, only CSS and JavaScript? If so you have been exposed to bloated code.
What steps do I take to get back on the right track?To fix the problem, you need to get all the jumbled code out of your pages. Use external JavaScript and CSS for everything. There is never a reason that CSS or JavaScript need to be in your page versus in an include page. When building out your includes or library items, there should be no opening and closing html, head or body tags, only table data. What I suggest for new guys starting out is to build all your navigations and whatever else you will be using as includes or library items in one complete working template at first. Then go back and cut out the sections that you want to use as includes and library items.
If you do this correctly, you will see that all of your on-load body event handlers have been added to the main template page and not your library items.
It takes practice to get it perfect, but once you do, you will see the difference in your code and in your search engine listings.