jQuery Mobile: title

Jan 152013

Come sappiamo jQuery Mobile usa di base un meccanismo ajax per passare da una pagina all’altra.

Un problema implicito in questo schema è la possibilità di settare correttamente il title della pagina, cosa che sappiamo è assolutamente rilevante in un ottica SEO. Vediamo quindi come fare, l’html:

&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Page Title&lt;/title&gt;
&lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css&quot;&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;http://code.jquery.com/jquery-1.7.1.min.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js&quot;&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div data-role=&quot;page&quot; id=&quot;prima&quot; data-title=&quot;Prima&quot;&gt;
&lt;div data-role=&quot;header&quot;&gt;&lt;h1&gt;Prima&lt;/h1&gt;&lt;/div&gt;
&lt;div data-role=&quot;content&quot;&gt;
&lt;a href=&quot;#seconda&quot; data-role=&quot;button&quot;&gt;Seconda&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div data-role=&quot;page&quot; id=&quot;seconda&quot; data-title=&quot;Seconda&quot;&gt;
&lt;div data-role=&quot;header&quot;&gt;&lt;h1&gt;Seconda&lt;/h1&gt;&lt;/div&gt;
&lt;div data-role=&quot;content&quot;&gt;
&lt;a href=&quot;#prima&quot; data-role=&quot;button&quot;&gt;prima&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;

Come si può vedere la soluzione passa dall’inserimento dell’attributo data-title nel div con data-role-page

L’esempio

Google+

Sorry, the comment form is closed at this time.