I have a problem here where Google shows my `<nav>` instead of my main section in the SERPs. On top of that, [because my nav is made up of inline elements][1], the result gets really messy:
example.com - My page title
www.example.com/url/to/page - Translate this page
LoremIpsumDolorSitAmetConsecteturAdipiscingElitSedDoEiusmod...
Instead, how do I get Google to show my main section? Is it as simple as wrapping my content in `<main>`?
Most sites I've seen don't have their navs showing in their SERPs anyway:
https://google.com/search?q=site:stackoverflow.com
My markup is basically this:
<html>
<head>...</head>
<body>
<!-- jQuery Mobile `page`: https://api.jquerymobile.com/page/ -->
<div data-role="page">
<div data-role="header">...</div>
<div data-role="content">
<div class="top">
<nav>
<a>Lorem</a>
<a>Ipsum</a>
<a>Dolor</a>
<a>Sit</a>
<a>Amet</a>
<a>...</a>
</nav>
</div>
<div class="main">
<div class="articles_wrapper">
<div class="article" itemscope itemtype="http://schema.org/ScholarlyArticle">
<h1 itemprop="name">Main content goes here</h1>
<p itemprop="description">...</p>
</div>
<div class="article" itemscope itemtype="http://schema.org/ScholarlyArticle">
<h1 itemprop="name">...</h1>
<p itemprop="description">...</p>
</div>
<div class="article" itemscope itemtype="http://schema.org/ScholarlyArticle">
<h1 itemprop="name">...</h1>
<p itemprop="description">...</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
[1]: http://webmasters.stackexchange.com/questions/82240/will-google-punish-me-for-not-using-ulli