CSS, AJAX, Web 2.0 & Search Engines

Man up, ladies and gents. We have one more session to visit.

Danny Sullivan is moderating the CSS, AJAX, Web 2.0 & Search Engines session with panelists Shari Thurow (GrantasticDesigns.com), Jim McFayden (Critical Mass), Ryan Johnston (Critical Mass) Dan Crow (Google) and Amit Kumar (Yahoo! Search).

The Web has evolved as more people are making use of things like CSS, JavaScript and AJAX, and sometimes the engines don’t know what to deal with it.

Up first is Shari Thurow, who suggests the creation after an open bar after the last session of the last day. I am so in agreement with that.

CSS is an HTML addition that allows webmasters to control design parameters such as margins, font/typeface appearance, link appearance, etc. The main reason to use it is because it decreases the download time of a page and makes it easier to control exact positioning of the elements on a page. CSS-formatted text links easily communicate visited/unvisited links.

The disadvantages of CSS are that in order for end users to see the page as you designed them, they have to have the fonts and typefaces you used installed on their computers. (Note: Target your type choices to your target audience). For this reason, don’t put your logo in CSS. Usability testing and focus groups might show that users prefer a font/typeface that is not commonly installed on all computers. CSS-formatted hyperlinks can dominate the content of a Web page, making the content appear unfocused.

CSS can also be used to hide text on a page.

Some SEOs believe that encoding the image in a heading tag will make the alt text appear more important. Don’t do this. It doesn’t make a difference and you may be looked at as a spammer. Badness.

There are legitimate uses to hidden layers. For example, a drop down menu is not spam because the text is clearly meant to be viewed by humans and is easily read.

Should your robots.txt exclude the styles directory from the Web search directory?

Shari says no. The engines don’t want that due to all the misuse of CSS that has gone on. Use CSS but don’t use it to exploit the search engines.

As the Web moves into its second generation, sites are making more use of CSS, AJAX, and other advanced and interactive design techniques. But how are the largely Web 1.0 search engines reacting to this from an SEO perspective?

Ryan Johnston and Jim McFayden are up next. Ooo, a dual presentation. Fancy!

AJAX has become another (overused and annoying) buzzword. Everyone wants it on their site but no one knows what it means. AJAX offers an improved user experience, but you have to make sure you’re still meeting your search engine optimization needs.

AJAX stands for asynchronous JavaScript and XML. It makes Web pages feel more responsive. It’s not a technology but a term that refers to the use of a group of technologies. It gains full power from XML and DOM.

AJAX is not a programming language. There are no downloads or installations. All A-grade browsers are AJAX ready.

AJAX is NOT support by the search engines.

Search engines and AJAX don’t mix: the search engines don’t run JavaScript and can’t see AJAX-delivered content. AJAX created navigation goes nowhere; spiders can’t see the links so they won’t follow anything.

The solution to this is to remember that every page needs to be an HTML page and have its own content on the page. There must be a page the search engines can find and index. All links must already be in the HTML. To know if your site is search engine friendly, turn JavaScript off in your browser and see if you can still navigate your site.

When search engine optimization is imperative to the project, it’s important to make sure you build your baseline application. For those fully supported users, it is important to understand that the AJAX you’re going to use is going to enhance the Web site. Make sure you are testing for all the different types of users.

Jim uses a recent project he worked on for Rolex.com as a case study.

He says that AJAX breaks the normal browser behavior. This means content is not necessarily corresponding to a URL. When you navigate a site designed in AJAX there is no addition to the browser history, no history, no back button, nothing. This has a great potential for spamming or cloaking the search engines and presents a major usability issues. To fix this, create unique page IDs to each page. Use JavaScript to update the URL using a # sign (the engines don’t look past the # sign). Use JavaScript to fake an entry in the browsers history.

Great example of BAD AJAX implementation: Gucci.com
Great example of GOOD AJAX implementation: Amazon.com

On the Gucci site, if you don’t have JS enabled, you see nothing. No content, no site. AJAX should be used as an enhancement, not a requirement. All of your pages must exist as plain HTML.

Dan Crow and Amit Kumar didn’t give presentations but offered rebuttals on things they’ve heard during the session.

Dan confirms that the search engines don’t look past the # sign in a URL. He does say not to rely on the state of play today to be the state of play in the future. Everything presented in the panel is true for today, but he expects in the next few months and years that we’ll see a major shift to where the engines are able to index this content.

Amit re-emphasizes that the engines are working hard to find a way to index JavaScript and says the reason they can’t is their fault.

Lisa Barone is a writer, content marketer & VP of strategy at Overit Media. She's also a very active Twitterer, much to the dismay of the rest of the world.

See Lisa's author page for links to connect on social media.

Comments (5)
Filed under: SEO
Still on the hunt for actionable tips and insights? Each of these recent SEO posts is better than the last!

5 Replies to “CSS, AJAX, Web 2.0 & Search Engines”

I think it doesn’t how one tries to hide tricks from search engines.
It I surely come out and the site will start going down.

Shari,
Yes, I left the company at the beginning of this year. Sometimes it makes sense to move on. As for the training you provided, there was actually much more after you. We brought on another firm for 6 months or so to help us out.
As I wrote before, I set up an experiment to test out the h1 and image thing we’re talking about here. So far the results are inconclusive, but there is some slight evidence that the alt attribute is picked up so I’m going to continue experimenting.
I do realize now that I forgot to include an image without an H1 around it so I’ll be updating my post.

Marios-

I remember when you worked for another company. Funny thing happens when I train and consult people — they end up leaving the companies after the company has paid for their training.

Just because you see a legitimate reason for putting an h1 around a graphic image isn’t exactly well..it is just your opinion.

Search engines have volumes of data that no one outside of the companies have access to, and they have made it clear many times over that putting an h1 tag around a graphic image is not going to improve that alt text’s relevancy. Search engines do not use the alt attribute to determine relevancy on text-based documents.It’s been that way for a long time.

I would not have put it in my presentation if I did not verify my information.

Using an h1 around an image header seems perfectly valid to me. It tells search engines that the image is being used as a heading and the alt text is where the heading copy is specified. If you look at a cached version (in Google) of a page that uses this technique, you’ll see that the heading appears larger i.e. the h1 style is applied to it.
I happened to do an experiment at the end March on this very topic: http://www.searchgrit.com/seo-for-images/
Of course, a text header would be better and even the sIFR Flash technique should be considered, but sometimes there are other constraints that simply require an image header.

Wow – that’s fast. We haven’t even returned to Canada from NYC yet! Thanks for attending Lisa – any more feedback about the presentation?

–ryanj
http://www.ryanj.org

LEAVE A REPLY

Your email address will not be published. Required fields are marked *

Serving North America based in the Los Angeles Metropolitan Area
Bruce Clay, Inc. | PO Box 1338 | Moorpark CA, 93020
Voice: 1-805-517-1900 | Toll Free: 1-866-517-1900 | Fax: 1-805-517-1919