Patrick Branigan presents "Next Generation Site Architecture" at the Search Engine Strategies Conference (SES) of March 2013.

1. Next Generation Site Architecture
Patrick Branigan
Overit
Art Director
New York | March 25–28
#SESNY

2. New York| March 25–28, 2013 | #SESNY
Architecture is…
• “The art and science of designing and erecting physical structures.”
• “The activity of designing a system.”
• “An approach to planning, designing and developing a web site presence.”
www.wikipedia.org; Blueprint of Bishopsfield to Hazel (geography.org.uk)
@pbranigan

3. New York| March 25–28, 2013 | #SESNY
Site Architecture is NOT…
• A list of pages.
• Static information.
• Defined by one person.
• …simply telling a story.
@pbranigan

4. New York| March 25–28, 2013 | #SESNY
People!
• Next generation website architecture is an approach in creating an online ecosystem
that can be driven and evolved by its users.
• Social media, content and accessibility are what drives engagement.
• Create an ecosystem for exploration and expansion.
@pbranigan

5. New York| March 25–28, 2013 | #SESNY
Consider the Social Aspect
• Driving factors: “sharing” & “commenting” because this is about the people.
• People enjoy conversations.
• Traditionally…
TOP
www.cnn.com
BOTTOM
SIDE
@pbranigan

6. New York| March 25–28, 2013 | #SESNY
Consider the Social Aspect
• Now…
• We might want to reassess placement, organization and function.
• Consider human tendencies like categorization.
• Focus on further naturalizing the conversation experience.
@pbranigan

7. New York| March 25–28, 2013 | #SESNY
Consider the Social Aspect
COMMENT
SHARE
http://nyti.ms/10Y8g4 - New York Times, Renda Morton
@pbranigan

8. New York| March 25–28, 2013 | #SESNY
Consider the Social Aspect
COMMENT & SHARE
http://nyti.ms/10Y8g4 - New York Times, Renda Morton
@pbranigan

9. New York| March 25–28, 2013 | #SESNY
Consider the Social Aspect
IN CONTEXT
&
ON DEMAND
http://nyti.ms/10Y8g4 - New York Times, Renda Morton
@pbranigan

10. New York| March 25–28, 2013 | #SESNY
So…
• Encourage users to interact and engage with your content via placement,
organization and function of elements.
• Increase in:
• URL sharing.
• User views and impulse views.
• Higher probability in viral impact.
• More sharing means better rankings and higher clickthrough rates.
• Takeaway – The “architecture” the user is going to engage in is as important as the
actual linking and sharing. One encourages the other.
@pbranigan

11. New York| March 25–28, 2013 | #SESNY
Consider Your Content.
• Without rich and highly engaging content, no one will really care.
• Being made clear by Google!
• Author Rank!
@pbranigan

12. New York| March 25–28, 2013 | #SESNY
Author Rank
• Connect a website’s writers’ accounts with Google+ accounts.
• People like other credible people!
• An emphasis on not only what’s on the page but who provided it.
@pbranigan

13. New York| March 25–28, 2013 | #SESNY
Author Rank
• Link your content to your Google profile:
• Link from your Google profile to your content:
@pbranigan

14. New York| March 25–28, 2013 | #SESNY
Relevance and Credibility
• Markham Nolan – “How to Separate Fact and Fiction Online”
• Quality out of quantity.
• Evolution from the pursuit of finding facts to the act of verifying them.
http://ted.com- Markham Nolan; TED
@pbranigan

15. New York| March 25–28, 2013 | #SESNY
So…
• Google, the king of search, is no longer relying on algorithms.
• Authorship and credibility creates “thought leadership”.
• Takeaway – Use systems such as Author Rank to help users engage and trust
in you, which inevitably helps you in being searchable and accessible.
@pbranigan

16. New York| March 25–28, 2013 | #SESNY
Other Content Consideration
• Text is obviously important.
• If you don’t use webfonts you’re doing it wrong.
• First we had:
• Now we have:
http://typkit.com; http://fontspring.com; http://google.com/webfonts
@pbranigan

17. New York| March 25–28, 2013 | #SESNY
Other Content Consideration
• Add stylesheet link to call on the desired font from Google’s library of
webfonts and then style with CSS.
@pbranigan

18. New York| March 25–28, 2013 | #SESNY
Other Content Consideration
• Result:
• (An amazing example when partnered with other technologies HTML5, CSS3,
Java, jQuery, etc: http://jjr2012.srf.ch/)
@pbranigan

19. New York| March 25–28, 2013 | #SESNY
Other Content Considerations
• People love images.
• Optimizing imagery.
• Use your alt text.
• File name.
• Image size.
http://instasham.me
@pbranigan

20. New York| March 25–28, 2013 | #SESNY
Other Content Considerations
• People also love video.
• Optimizing video?
• YouTube: Titles and descriptions.
• Hosted video: delivery and ease of sharing.
@pbranigan

21. New York| March 25–28, 2013 | #SESNY
Other Content Considerations
http://www.nytimes.com/projects/2012/snow-fall/#/?part=tunnel-creek
@pbranigan

22. New York| March 25–28, 2013 | #SESNY
So…
• Text is still king, but all content is continuously evolving.
• Providing impressive content encourages conversation.
• Takeaway – Emphasize user facing visual stimulation that can be crawled,
indexed and shared where possible.
@pbranigan

23. New York| March 25–28, 2013 | #SESNY
Giving It All Somewhere To Live
• Responsive design… (Yeah, about that…)
• “Creating a single source for code that we can optimize to a device so that the
device can ask how to display things.” – Jason Cranford Teague
• How: Same HTML > Same URL > CSS media queries
@pbranigan

24. New York| March 25–28, 2013 | #SESNY
Benefits of RWD
• Accessibility.
• Single URL.
• No redirection.
• Saving resources for the site and the crawlers.
@pbranigan

25. New York| March 25–28, 2013 | #SESNY
Some questions You Should Ask Yourself
• What percent of traffic is mobile?
• Does your current mobile presence translate well to other sizes?
• How do your bounce rates compare?
• Are you forgetting your purpose? It’s about the people! People generally want
specific content depending upon their situation & device.
@pbranigan

26. New York| March 25–28, 2013 | #SESNY
So Get Responsive or Get Lost?
Nope!
@pbranigan

27. New York| March 25–28, 2013 | #SESNY
Bringing It All Together
• Three key components to architecture:
• Social Media.
• Content.
• Accessibility.
• It’s about people as much as it is about robots.
Thank you!
@pbranigan