Next Generation Site Architecture

The need to design and deploy a next-generation site architecture that maximizes your chances of findability, no matter where and how searchers look for you, is one of the hottest topics in the evolving mobile and multi-device world.

So how can you build a site that addresses current and future cross-media challenges? In the jam-packed Next Generation Site Architecture session at SES New York last week, moderated by Chris Boggs (@boggles), CMO, Internet Marketing Ninjas, and speakers Patrick Branigan (@pbranigan), Art Director/Lead Designer, Overit, and Bryson Meunier (@brysonmeunier), Director, Content Solutions, Resolution Media, shared their top tips on how to improve your mobile presence.

Defining True Next Generation Architecture

According to Branigan, there are the a range of things to consider as you plan your new cutting edge digital presence:

First things first, we need to define what we mean by architecture. Branigan mentioned three major types:

Real world/traditional architecture: buildings and skyscrapers and airports – that sort of thing.Informational architecture: Creating the structure of concepts and data.Digital realm architecture: This is the actual design of digital services and experiences.

Now that we've established what kind of architecture we're talking about here – digital realm architecture – Branigan defined what architecture isn't:

A list of pages, or a site map.Static information that doesn't change or reflect user interaction, device, or other forms of potential impact on experience.

Branigan defined true next generation architecture as the design of ecosystems that incorporate at a deep level the sharing and conversations will drive user engagement in this new era. Users need to both converse with as well as to organize content as they see fit.

Branigan mentioned the much-hyped New York Times new article template (still being rolled out on all platforms) – as an example of this. If the user clicks the comments icon the template places the user discussion right alongside the article content as seen below – no need to scroll to the bottom of the page:

"Declutter the pathways to consuming, sharing, and commenting on comment," Branigan said. "Architecture must encourage sharing, conversation, and engagement."

Social Authority

From here, we went on to review the hot topic of building and profiting from social authority. Site architecture needs connected Google+ profiles to benefit from social authority. It's easy to do, as we have mentioned before – just follow the instructions for adding the rel=author tag.

Branigan also suggested checking out the Mark Nolan TED talk on how Twitter verified accounts are good sources of trustworthy info for reporters and authors. Having access to verified information from real people who are authoritative helps journalists and other opinion leaders separate fact from fiction. Make your content creator authoritative and active on the social platforms, stat!

Fonts

Regarding site text, Branigan emphasized the use of webfonts to ensure your copy renders correctly in various contexts and looks cool and unique. Reference them in your CSS to call the Google library of Webfonts.

Next gen site architecture needs compelling fonts that stick out from the pack and address live text and crawlabilility. You no longer need to use images to render unique-looking text – this helps SEO and indexabililty, copy and pasteability, and sharing.

Images & Video

In addition, next-gen architecture follows best practices around images and videos:

Always use alt text, descriptive image file names, and reduce image size or make responsive so the right image is sent to the right device (responsive design basics).Same with videos – focus on delivery (HTML 5) and ease of sharing and viewing on various devices.

The famous Snow Fall article on NYTimes.com is a great example of site architecture the follows all the above tactics - check it out:

A Few Points About Responsive Design

Finally, touching on the topic of responsive design (covered in more detail in Meunier's presentation below), Branigan made the following points:

Responsive design means using the same HTML, the same URL, and different CSS. It has certain benefits – accessibility, a single URL, no redirection, and it may save resources for site and crawlers.However, responsive design takes time effort and money and has some downsides (see more on that below).So how do you know if you should invest in responsive design? Branigan said that if you have a significant percentage of traffic from mobile devices, if you have high bounce rates from mobile-referred traffic, and your competitors have sites that work well on multiple devices, you should definitely consider it.

Summing it up, next-gen architecture is about three key elements: social media, content, and accessibility. All designed for people, not robots.

After a loud round of applause from an obviously interested audience, we moved on to Meunier's presentation that went into greater detail on the hot topic of responsive design. Meunier focused on how to figure out whether responsive design is right for you, and went into detail on its relative strengths and weaknesses.

The Multi-Device World

Starting with the background, in the early days, it was all desktops and luggable portables. Everyone was sitting at desks. Nowadays it's all sorts of devices, and people are not at desks – they are in all sorts of contexts: Reading Kindles, waling and looking at smartphones (into oncoming traffic), browsing tablets, laptops, big screen rigs, TVs, Xboxes, Google Glass, etc.

He quoted the following statistics:

90 percent of media consumption is screen based38 percent of media consumption is on smartphones (according toGoogle)27 percent of Google searches are on mobile devices6 percent of Bing searches are on mobile. Big is different in demographics here.

Outside the U.S. and in many other countries mobile is the dominant way to access Internet – often not even via smartphones ("features phones" with limited browsers are popular in India).

Adding to the importance of mobile, the Kelsey research group says mobile will exceed desktop search in 2015.

Mobile Site Architecture Options

Meunier lays out your mobile site architecture options as follows:

Responsive web design (described above).Dynamic serving –same URL, different HTML via device detection on server.Mobile sites – totally separate site and URL (for example m.cnn.com).

Google's official policy is that responsive web design is preferred if it's the right solution for your user. Follow the best practice for your users, as Google can handle dynamic serving, mobile sites as well. They can understand what the sites are for if you follow their guidelines.

Is Responsive Design Best for Your Users?

Meunier had his own view on how to decide if responsive design is best for your users:

Are mobile users well served by current site architecture? Check your mobile keyword visibility. Prioritize keywords based on volume, desktop, mobile, and total priority and check rankings. Create platform-specific content – Android content for Android phones. Don't ask people to print out coupons shown on phone.Know your mobile keywords and their volume – prioritize and check rankings. Local intent keywords are mostly mobile, so you need mobile landing pages for these queries.90 percent of "bars" (places that serve drinks) keywords come from mobile devices.Sometimes apps are the best choice (i.e., the Google Now app) – people spend a lot of time on apps and it's growing, much more than mobile web.Feature phone users – outside the most developed countries, are dominant – 158 million visitors used opera (the major feature phone browser) in 2012 – do you want to ignore them?Speed is important to mobile users, and responsive design can slow sites down. It's unlikely to outperform a dedicate m. site.Responsive isn't the be all and end all. Answer the above questions and use mobile URLs and dynamic service to best serve your audience.More Mobile Site Considerations

Meunier also mentioned that more use should be made of switchboard tags on mobile URLs. This avoids a potential cloaking issue for showing different content to different devices. He also mentioned the need to vary HTTP headers when using dynamic serving.

Wrapping it up, Meunier emphasized that you not block Googlebot from mobile sites. Google has three bots / user agents for each major site type. They do not need to be blocked. Blocking bots from a mobile site is a dated strategy and can actual hurt you when users search for a mobile version of your site.

Conclusion

The overall consensus as that there was lots of room for brand to improve their mobile presence, and we should expect to see more attention, bigger budgets, and lots of resources allocated to this area in the next few years.

Harnessing the $9+ Billion Social and Mobile Ad Potential
In partnership with Moontoast, ClickZ presents the "Ultimate Guide to Social Rich Media Advertising". Social rich media advertising offers a one-of-a-kind opportunity for brands and agencies to target consumers with interests that match the virtues and values of their products. Download your free guide today!