Intro to HTML Formatting for SEO
Intro to Logical HTML Formatting for SEO
Todays topic is web design—thus HTML—as it relates to Search Engine Optimization (SEO), and thus to marketing your work or business.
Think of on-page HTML formatting for SEO like a newspaper (or even better like an academic research paper). What words/phrases are you emphasizing with formatting and can you reach a reasonable compromise between interesting, colorful, accurate writing and content that people will be able to find when they are searching for that topic online.
For instance a client and friend of mine runs a junk removal business in Columbus, Ohio, she likes the catch of phrase of "de-clutter," but no one searches for the term de-clutter, so for SEO purposes it is a poor word to emphasize. On the other hand, over the weekend I learned, that she was paying for advertising on the keywords ' Columbus Junk ' and although lots of people searched for that over 98% of them were looking for junk yards thus we had to address that also.
It can be hard to figure out what possible phrases are, and are not, applicable when people search for you. One of my favorite tools for help in this department is Google Insights for Search, and it's free.
The rest of this post is a sample for reference so you can see it for yourself. I am also going to make a ScreenFlow video demo about logical HTML formatting so you can watch the demonstrations on my screen and hear my explanations. There will be much more detail and real life examples in it.
Note: At the bottom of this post there are links for 50% off Adobe LightRoom3, CS5.5, and more but they are only valid for a few more days so if interested make sure you make it to the end of this post.
Headline One
Headline Two
Headline Three
Headline Four
Headline Five
Headline 6
Paragraph
This is unformatted text the extra blank area above is an empty paragraph containing only a space.
See the code for more info.
- This
- is
- an
- unordered
- list
- This
- is
- an
- ordered
- list
This is unformatted text; it shows up according to the default rules because no tags are applied to it. To make what would be one big block of unformatted text into what visually looks like 2 paragraphs I had to insert a tag into the code which looks like this: [[<br/>]] That tag (without the double brackets) is a 'break' which is basically the same as hitting enter in a word processor (you'll see that I added a second break tag for spacing/layout purposes too) Ideally 'break' or off-page styling (CSS) should be used to provide spacing, rather than an empty set of paragraph tags.
Also, if you view this in your email, depending on the default settings of your browser the "headline 5" text may be bigger or smaller than the paragraph text. In this program it is, as you can see, smaller, but in most browsers it is bigger. The code for "space" (look for the empty brackets in the code view and you'll notice I inserted 3 of them) [ ] must be inserted into the code anywhere that you want more than one consecutive space.
For more info related to web design visit: W3Schools - Free HTML, XHTML, CSS, JavaScript, XML, ASP, PHP, SQL tutorials with lots of working examples and source code. (While you can pay to be tested for certifications and stuff the actual resources and tools are free and quite good.)
Until Next Time,
You can write me here: Adam[at]BusinessforPhotographers[dot]com
Proprietor of Adam Infinitum