search-friendly web development @ ruby|web conference 2010

57

Upload: luigi-montanez

Post on 20-May-2015

1.088 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 2: Search-Friendly Web Development @ Ruby|Web Conference 2010

Search Engines

65.8% 2.3%

11.0%

3.8%

17.1%

comScore July 2010 Rankings

Google AOLBing AskYahoo

Page 3: Search-Friendly Web Development @ Ruby|Web Conference 2010

Why?

Page 4: Search-Friendly Web Development @ Ruby|Web Conference 2010

“SEO Expert”

Page 5: Search-Friendly Web Development @ Ruby|Web Conference 2010

== “Spammer”

Page 6: Search-Friendly Web Development @ Ruby|Web Conference 2010

“Many of the so-called SEO professionals are not much more than modern snake oil salesmen. They game and manipulate the system for their own intentions.”

“SEO is not a legitimate form of marketing. It should not be undertaken by people with brains or souls.”

Page 7: Search-Friendly Web Development @ Ruby|Web Conference 2010

“I'm not an SEO expert, but [it] seems like SEO is something spam sites do. If you are trying to create a high quality destination site, just write good content and let Google do its job.”

- Sachin Agarwal, CEO Posterous

Page 8: Search-Friendly Web Development @ Ruby|Web Conference 2010

“Let FastCGI do its job”.

Page 9: Search-Friendly Web Development @ Ruby|Web Conference 2010

On average, 40% of traffic comes from organic search*

Page 10: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 11: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 12: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 13: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 14: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 15: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 16: Search-Friendly Web Development @ Ruby|Web Conference 2010

“Not my audience!”

Page 17: Search-Friendly Web Development @ Ruby|Web Conference 2010

luigimontanez.com

Page 18: Search-Friendly Web Development @ Ruby|Web Conference 2010

“Experts” Not Needed

Page 19: Search-Friendly Web Development @ Ruby|Web Conference 2010

Professional Practices• User-Centric Design

• Test-Driven Development

• DRY and Maintainable Code

• Server Performance

• Client-Side Performance

• Search Engine Considerations

Page 20: Search-Friendly Web Development @ Ruby|Web Conference 2010

Six Simple Rules• Can’t outsmart Google (or Bing or Y!)

• Follow Google’s advice

• Obey conventions and standards

• Stay away from hacks

• Think like a search engine

• Think like a searcher

Page 21: Search-Friendly Web Development @ Ruby|Web Conference 2010

Search Engine Pipeline• Crawling

• Indexing

• Ranking

Page 22: Search-Friendly Web Development @ Ruby|Web Conference 2010

<crawling>

Page 23: Search-Friendly Web Development @ Ruby|Web Conference 2010

Discovery• Links to your pages from other sites

• Links to your pages from within your site

• Your sitemap.xml

Page 24: Search-Friendly Web Development @ Ruby|Web Conference 2010

sitemap.xml• Tell search engines exactly what you

want them to crawl

• sitemaps.org

• Limit: 50,000 URLs, 10MB

• Can specify multiple sitemaps with a sitemap index

Page 26: Search-Friendly Web Development @ Ruby|Web Conference 2010

Generating sitemap.xml• Write it by hand, stick it in public/

• Build a controller, action, and route entry to respond to ‘sitemap.xml’. Use XML Builder to generate the entries. Cache it.

• Importantly: Strive for 100% coverage.

Page 27: Search-Friendly Web Development @ Ruby|Web Conference 2010

robots.txt• Exclusion rather than inclusion

• robotstxt.org

User-agent: *Disallow: /profile

Page 28: Search-Friendly Web Development @ Ruby|Web Conference 2010

Be nice to the crawler• Be performant. Fast server response.

Fast page load. Compress files. Use if-modified-since header.

• Non-www vs. www - pick one.

• Ensure unique content. Use <link rel=”canonical”/> where approriate.

Page 29: Search-Friendly Web Development @ Ruby|Web Conference 2010

</crawling>

Page 30: Search-Friendly Web Development @ Ruby|Web Conference 2010

<indexing>

Page 31: Search-Friendly Web Development @ Ruby|Web Conference 2010

Don’t sabotage it• Don’t use a 302 redirect when you

mean a 301 redirect.

• Make sure images, video, Flash, Silverlight, and AJAX are accessible.

• See the Google Webmaster Central Blog for details.

• Account for crawlers with region-specific content.

Page 32: Search-Friendly Web Development @ Ruby|Web Conference 2010

</indexing>

Page 33: Search-Friendly Web Development @ Ruby|Web Conference 2010

<ranking>

Page 34: Search-Friendly Web Development @ Ruby|Web Conference 2010

<title>• Most important element to search

engines

• Think long and hard about it

• Keywords! Think like a searcher.

• Best format: Page Title | Site Name

Page 35: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 36: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 37: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 38: Search-Friendly Web Development @ Ruby|Web Conference 2010

URLs• Override to_param for pretty URLs.

• Dashes are word separators, underscores are not. Use dashes.

• International domains are treated as such.

Page 39: Search-Friendly Web Development @ Ruby|Web Conference 2010

<meta>• <meta name=”description” content=”...” />

• Make it unique for every page. Use content_for.

• Shown to users, doesn’t affect ranking.

• <meta name=”tags” ... /> is ignored

Page 40: Search-Friendly Web Development @ Ruby|Web Conference 2010

Headings and Content• <h> tags should be used appropriately.

• Page content should match what the <title> and <h> tags refer to.

• Limit use of text-indent:-9999px and display:none in CSS.

Page 41: Search-Friendly Web Development @ Ruby|Web Conference 2010

Rich Snippets• Microformats, RDFa, Microdata

Page 42: Search-Friendly Web Development @ Ruby|Web Conference 2010

</ranking>

Page 43: Search-Friendly Web Development @ Ruby|Web Conference 2010

Tools• Google Webmaster Tools

• Bing Webmaster Tools

• Yahoo! Site Explorer

Page 44: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 45: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 46: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 47: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 48: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 49: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 50: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 51: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 52: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 53: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 54: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 55: Search-Friendly Web Development @ Ruby|Web Conference 2010
Page 56: Search-Friendly Web Development @ Ruby|Web Conference 2010

Four Takeaways• Think like a searcher

• Optimize your <title>s

• Use Google Webmaster Tools

• Read the Google Webmaster Blog

Page 57: Search-Friendly Web Development @ Ruby|Web Conference 2010