Architect Marketing Course 2012 – Course Outline
Level 2 Part B – On-page optimization – HTML Tags

On-page optimization – HTML Tags (Title, Meta, H, ALT etc.) & URL

Copyright 2012 – Eric Bobrow
All rights reserved – do not reproduce or distribute

Thank you for visiting the Internet Marketing for Architects Course website.

The video lessons and certain other materials are available for members only. If you would like to watch the training video on this page, please login to the website.

If you are not already a member, please visit the following page for more information and to sign up for the Internet Marketing for Architects Course

Eric Bobrow, Creator of the Internet Marketing for Architects Course

Click the video preview image to start playback. Controls (pause, play, scrub forward or rewind back, volume, full-screen, etc.) will be visible when you hover your mouse over the video after it has started playback. You may watch it at full-screen by clicking the small icon in the bottom right. To download the video as an MP4 file, right-click the DOWNLOAD link and choose Save Target As or Save Linked File As or a similar command (this varies by browser).

Please post your comments and questions at the bottom of this page. Thanks!

— Eric


Introduction and Agenda

On-page optimization focuses on the development of content and materials on your website pages that improve their performance in the search engines. It also should be coordinated with and include making the content more visually appealing to contribute to the visitor experience.

The job of a search engine like Google or Bing is to show a list of relevant sites and pages in response to a search query

How does Google see your page?



Let’s take a look at the page “source code” using the browser

Brief examination of the structure of HTML – Head, Body, Div, P tags

Using Firefox Firebug or developer tools in other web browsers



These tags are organized in a hierarchy (higher level ones containing lower level items, much like an outline for a paper or a talk).

The “Head” of the page sets up the environment, describing the page and its style and resources

The “Body” is the actual page content – what you see in the browser

Unlike an outline, headlines or “section headings” do not “include” or contain the body copy (subpoints) below them.

DIV containers often are used to control and style entire areas of the page, such as the heading including navigation menus, sidebar, main body, and footer.


Certain tags in the Head are used by the search engines to determine the focus of the page – and to decide for what searches this page is relevant

<Title> is what is seen at the top of the browser window, and what will be shown as the heading for a search engine listing

  • <title>SARCO Architects Costa Rica – Green Architecture and Design-Build</title>
  • <title>Modern Architect, Los Angeles Architects</title>
  • <meta id=”OGTitle” property=”og:title” content=”Modern Architect, Los Angeles Architects”> [OG stands for Open Graph protocol, used by Facebook]

<Meta> is a general tag for describing your page to the search engines; this element can be used for several purposes. Each Meta tag has a “name” which declares the attribute, and “content” which defines the value of that attribute.

  • <meta name=”Description” content=”Description of your site”>
    <meta id=”MetaDescription” name=”description” content=”Los Angeles Architecture firm specializing in modern residential and commercial designs”>
  • <meta name=”keywords” content=”keywords describing your site”>
    <meta id=”MetaKeywords” name=”keywords” content=”modern architect, los angeles architects, modern architects, los angeles architect, architecture firms, modern architecture firms”>

The “Description” is often used by the search engines to summarize the page in the listing. If this is absent, then Google will pull an excerpt from the page content itself, which may or may not be a good summary and/or an attractive one for a potential visitor. NOTE: it’s important for you to control this by creating a description yourself.

“Keywords” are categories that the page is stating are important and relevant to the content. It is widely believed that this is no longer used in page ranking by Google, as it has been abused and manipulated. Google now looks at the actual page content to determine relevancy to search requests.




HEADLINES – H1 through H6

Various tags in the body of the web page are used by the search engines to determine what the page is about

Headlines are a major factor here; they are arranged in a priority list from H1 (most important) to H6 (least). In general, most website styling will make these distinct headline levels appear different, with H1 the largest and H6 the smallest and least prominent.

Headlines also organize page content for visual clarity for the visitor

  • DEMONSTRATION: Setting text into H1, H2 and H3 in WordPress


Styling of headlines can be controlled precisely by “CSS style sheets” to look whatever way one wishes

CSS = Cascading Style Sheets; the style declared at a “top level” is used unless a lower level declaration overrides it; this allows precise control


NOTE: Since there are so many H tags, it is possible to use them creatively in page layout with regards to SEO.

Example: a list of cities or specialties can have each item in an H3 or lower tag, but be styled subtly (not jumping out at the visitor) while still declaring their importance to the search engines [show website example]



Pictures are placed with the IMG tag, and may have attributes such as the ALT tag that describe the image

ALT tags were originally used for low-bandwidth (e.g. dialup) connections, allowing visitors to see a place-holder with the ALT description, and then decide whether they wanted to download the image

The search engines use the ALT tag as part of their analysis to see what the page is focused on – it is important to fill in the ALT tags for all photos on your website so that the images “count” towards the content analysis

A caption may be placed under or next to an image using a tag

A TITLE tag will show up when hovering the cursor over an image or link

  • Demonstration: setting up an image with ALT and other tags
  • Show actual <IMG> code with ALT attribute



When you change the look of text using a Bold or Italic style, this is noted by Google as an important statement of emphasis

The preferred HTML tags for this are STRONG and EM (short for EMphasis), and they can actually be styled in different ways – perhaps coloring them differently

These tags should be used sparingly to avoid cluttering the page

  • Demonstration: using Bold and Italic styling



  • It is suggested that you focus each page other than the home page on one keyword phrase, or a small number of keyword phrases that are related
  • Each page has a “job” to do – a focus
  • Make sure the content relates to this topic, and includes the keywords multiple times in as natural a way as possible
  • Ideally, 200 or more words on the page, giving the visitor useful information
  • Note: You can get a word count in most word processors.

Enhancing the page for SEO:

  • Add in Headline tags with these keywords
  • Use one or more images, and add ALT tags with keywords
  • Bold the words at least once on the page if possible
  • Set up the URL to include the keywords – in WP this is the permalink or slug
  • Set Title, Description and Tags for the page as a whole

WordPress Plugins to Aid SEO

  • Some themes provide support for SEO directly
  • All in One SEO is a good free plugin that allows you to control page Title, Description, Tags, etc.
  • SEO Blog Kahuna is a commercial plugin that we have a developer license for that gives you an SEO “score” – with built-in tips for what to do to improve your score
  • XML Sitemap is a tool to help Google find all the pages in your site, and notify Google whenever anything is updated
  • Demonstration: Optimizing a page, improving the SEO score



Let us know how you feel! (No comments so far)

You must be logged in to post a comment.

No comments yet