SEO for Developers

re al
v
SEO For Developers
SELECT
*
WHERE
clue
>
0;

Date: February 29, 2012
Author: Chris Le (@djchrisle)

1

$
whoami
{
name:

“Chris
Le”,

twitter:

“@DjChrisLe”,

occupation:
[

“Internal
app
developer”,

“Project
management”,

“Technical
SEO
support”

]
}

If you build it, they will come is a lie 3

re al
v
SEO For Developers
How SEO changed the way I develop


4

#
header.html.erb
<h1> </h1>
....

#
acme.css
h1
{

background-‐image:
‘/img/acme_logo.png’;

background-‐repeat:
no-‐repeat;
}

@djchrisle 7

#
investments.html.erb
<a
href=”#watchlist”>
<div
id=”container”></div>
<script>

$(“#watchlist”).click
(function()
{
//
=>
sets
loadThis
to
“watchlist”

var
loadThis
=
$.param.fragment($.param.querystring);

$(“#container”).load(“/content?get=”
+
loadThis);

}
</script>

#
content_controller.rb
class
ContentController
<
ActionController::Base

respond_to
:html

def
index

@content
=
Content.find_by_name(params[:get]

respond_with(@content)

end
end

@djchrisle 8

http://www.acme.com/investments#positions
http://www.acme.com/investments#watchlist
http://www.acme.com/investments#menu1

@djchrisle 9

Best Practices

• Modularize & reuse code
– DRY principals (Don’t Repeat Yourself)

• Abstract template and view from logic
– Independently change stuff - no problems

• Use async JS loading to reduce load
– Lower server costs
– Fast load time (aka: “site speed”)

@djchrisle 10

http://www.domain.com/about-‐us/blog/post
http://www.domain.com/blog/post

@djchrisle 11

Q: What is SEO?
A: Help the RIGHT
customers find YOU.
12

require
'anemone'

Anemone.crawl("http://www.example.com/")
do
|anemone|

anemone.on_every_page
do
|page|

puts
page.url

end
end

Bank.account
<<
Profit!

@djchrisle 17

Title tags

@djchrisle 20

#
header.html.erb
<title><%=
@company.name
%></title>

@djchrisle 22

#
header.html.erb
<title><%=
@company.name
%>
<%=
@page.title_tag
%></title>

@djchrisle 23

#
header.html.erb
<title><%=
@company.name
%>
<%=
@page.title_tag
%></title>

#
schema.rb
create_table
“Page”

t.string
“title_tag”

...
end

#
page.rb
Class
Page
<
ActiveRecord::Base

belongs_to
:category

def
title_tag

title_tag.defined?
?
super()
:
self.category.name

end
end

@djchrisle 24

puts
Page.find(1).inspect

{

title_tag:
“Experienced
Ruby
Programmers
in
Philladelphia”,

content:
“...”
}

@djchrisle 25

Title matches
keyword
+ is what user
is looking for

My Company | Experienced Ruby Programmers in Philadelphia

26

<h1> tags

@djchrisle 27

#
post/index.html.erb
<h1><%=
@post.title
%></h1>

@djchrisle 28

#
my_page.html.erb
<h1> </h1>
....

#
acme.css
h1
{


no-‐repeat;
}

@djchrisle 31

This page is about
“Non-breaking space?”
#
my_page.html.erb
<h1> </h1>
....

#
acme.css
h1
{


no-‐repeat;
}

@djchrisle 32

Better use of H1
#
my_page.html.erb
<div
class=”logo”></div>
<h1>
Sensible
Investment
Strategies
</h1>
....

#
acme.css
.logo
{


no-‐repeat;
}

@djchrisle 33

URLs &
Hash fragments

@djchrisle 34


@djchrisle 35

4 pages .. 1 listing :(

Acme Inc | Financial Portfolio Managers
www.acme.com/investments

@djchrisle 36

Uncrawlable URL
#

<a
href=”#watchlist”>

<div

<script>

(function()
{
//
=>
sets
loadThis
to
“watchlist”

var
loadThis
=
$.param.fragment($.param.querystring);

$(“#container”).load(“/content?get=”
+
loadThis);

}
</script>

37

Crawlable URL
#

<a
href=”/investments/watchlist”>

<div

<script>

(function()
{

$(“#container”).load($.param.querystring);

}
</script>

38

#
routes.rb
resources
:investments
match
“content/:section”
=>
“content#show”

#
class
ContentController
<

respond_to
:html

def
show

@content
=
Content.find_by_name(params[:section])


end
end

@djchrisle 39

http://www.acme.com/investments/positions
http://www.acme.com/investments/watchlist
http://www.acme.com/investments/menu1
http://www.acme.com/investments/menu2
4 pages .. 4 listings :)

Acme Inc | Financial Portfolio Managers
www.acme.com/investments/positions

@djchrisle 40

301 / 302
redirect

@djchrisle 41

http://www.domain.com/about-‐us/blog/post
http://www.domain.com/blog/post

@djchrisle 42

#
class
ContentController
<

respond_to
:html

def
show

redirect_to
:post_path

#
@content
=
Content.find_by_id(params[:id])

#

end
end

@djchrisle 43

Defaults as 302 response

#
class
ContentController
<

respond_to
:html

def
show

redirect_to
:post_path

#
@content
=

#

end
end

@djchrisle 44

301 vs 302 redirect

• RFC 2616, Section 10.3.3
– 302 Found: The requested resource resides
temporarily under a different URI

• RFC 2616, Section 10.3.2
–301 Moved Permanently: The requested resource has
been assigned a new permanent URI and any future
references to this resource SHOULD use one of the
returned URIs

@djchrisle 45

#
class
ContentController
<

respond_to
:html

def
show

redirect_to
:post_path,
:status
=>
301

#
@content
=

#

end
end

@djchrisle 50

#
class
ContentController
<

respond_to
:html

def
show

redirect_to
:post_path,
:status
=>
301

#
@content
=

#

end
end

@djchrisle 51

#
routes.rb

match
“/about-‐us/blog/:post_title”
=>

redirect(“/blog/#{params[:post_title]}”)

52

If you build it, they will come is a lie 53

Every great idea
deserves the
chance to be found

@djchrisle 54

re al
v
SEO For Developers
How SEO changed the way I develop


55

SEO for Developers

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Ähnlich wie SEO for Developers

Ähnlich wie SEO for Developers (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

SEO for Developers