1 / 9

Semantic Markup and Search Engine Optimization

Semantic Markup and Search Engine Optimization. Joseph R. Lewis Sandia National Laboratories. Doing Justice. What do we do with all that great content work? Treat markup with care Think accessibility Represent your document in markup as the spec intended Use HTML 4.01, XHTML, XML

twyla
Download Presentation

Semantic Markup and Search Engine Optimization

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Semantic Markup and Search Engine Optimization Joseph R. Lewis Sandia National Laboratories

  2. Doing Justice • What do we do with all that great content work? • Treat markup with care • Think accessibility • Represent your document in markup as the spec intended • Use HTML 4.01, XHTML, XML • Separate presentation from design • No presentational markup • Externalize CSS and JavaScript

  3. Markup • How many times have we seen this? • Bad: <p class="heading2"> • Worse: <p style="font-weight:bold; font-size:2em; color:#666;"> • OMG: <b><i><font size=1><font=#666666>… • What about just using <h2>? • This is the tag the spec wants you to use. • This gives common, established, accepted semantic meaning and structure to the document.

  4. Markup Guidelines • Use <p> for paragraphs, not <br><br>. • Use <ul><li> and style with CSS, instead of trying to do custom bullets with images. • Navigation: List of links • Forms: List of choices • Use heading tags. • Top level <h1>, next level down <h2>, and so on, in order.

  5. Guidelines, continued… • Images • Use the alt property appropriately. • Should be a concise yet descriptive representation of the image • longdesc property: URL that points to a detailed description of the image content.

  6. <img> Example Text-Only: Standard browser: Decent altattribute No alt attribute

  7. More forgotten tags • Use <label>, <fieldset>, and <legend> for form elements. • Use <dl>, <dt>, and <dd> for definition lists. • Use <abbr> for abbreviations and acronyms. • Use the title property to expand the abbreviation, i.e. <abbr title="Department of Energy">DoE</abbr>. • <acronym> will be deprecated.

  8. XML • Treat your HTML like XML. • Use XML to take semantic structure up to the next level beyond HTML. • Good support for XML/XSLT in modern browsers and search engines. • Server side parsers are available to assist with backwards compatibility and data manipulation.

  9. How this affects SEO • Use HTML tags as they were intended to be used in the spec. • Search engines are tuned to understand HTML and place weight accordingly (<h1> vs. <p>, for example). • Spiders can crawl for definitions, lists, images, etc, if properly tagged. • Search engines can’t read images or plugins. (Flash can be an exception.) • Orientation is on text, not design.

More Related