*Here is one of my app structure:*
*content-page.html :*
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta itemprop="name" content="">
<meta itemprop="description" content="">
<meta name="description" content="">
<title></title>
<script src="/bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="/bower_components/polymer/polymer.html">
<link rel="import" href="/layouts/article/content-layout.html">
<link rel="import" href="/bower_components/app-router/src/app-router.html"
>
<link rel="import" href="/bower_components/font-roboto/roboto.html">
</head>
<body unresolved>
<app-router>
<app-route path="/article/:category/:articlename" import=
"/layouts/article/content-layout.html"></app-route>
</app-router>
</body>
</html>
*content-layout.html:*
<link rel="import" href="/bower_components/polymer/polymer.html">
<link rel="import" href="/bower_components/core-toolbar/core-toolbar.html">
<link rel="import" href=
"/bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="/bower_components/core-ajax/core-ajax.html">
<link rel="import" href=
"/bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href=
"/bower_components/core-media-query/core-media-query.html">
<script src="/layouts/scripts/jquery.js"></script>
<link rel="import" href="/elements/disqus-comments.html"></link>
<script type="text/javascript" src="/layouts/scripts/Markdown.Converter.js"
></script>
<script type="text/javascript" src="/layouts/scripts/Markdown.Sanitizer.js"
></script>
<script type="text/javascript" src="/layouts/scripts/Markdown.Editor.js"
></script>
<script type="text/javascript" src="/layouts/scripts/highlight.pack.js"
></script>
<polymer-element name="content-layout" attributes="articlename category">
<template >
<link rel="stylesheet" href="/layouts/css/markdown/github-markdown.css">
<core-ajax id="catalogajax" auto method="GET"
params='{"category":"{{category}}",
"articlename":"{{articlename}}"}'
headers='{"Access-Control-Allow-Origin":"*","X-Requested-With":
"XMLHttpRequest"}' url="http://moonmoonbird.com/api/v1/article/content";
handleAs="json" response="{{response}}"></core-ajax>
<core-header-panel mode="waterfall-tall" tallClass="medium-tall" >
<div class="core-header ">{{response[0].title}}</div>
<div layout horizontal center-justified flex class="contentcontainer">
<div flex?="{{!phoneScreen}}"></div>
<div vertical flex four style="background:#ffffff;box-shadow: 0 6px 20px 0
rgba(0, 0, 0, 0.19); color: #555;">
<div flex id="content" class="markdown-body"></div>
<div flex><disqus-comments shortname="moonmoonbird"
></disqus-comments></div>
</div>
<div flex?="{{!phoneScreen}}"></div>
</div>
</core-header-panel>
<content></content>
<core-media-query query="max-width: 640px" queryMatches="{{phoneScreen}}"
></core-media-query>
</template>
<script>
(function(){
Polymer('content-layout',{
domReady:function(){
this.markdown = Markdown.getSanitizingConverter();
this.metatitle = document.querySelector('title');
this.itemproptitle = document.querySelector('meta[itemprop="name"]');
this.metadescription = document.querySelector('meta[name="description"]');
this.itempropdescription = document.querySelector(
'meta[itemprop="description"]');
},
responseChanged:function(){
content = this.markdown.makeHtml(this.response[0].content);
this.injectBoundHTML(content, this.$.content);
this.metatitle.innerHTML = this.response[0].title;
this.itemproptitle.content = this.response[0].title;
this.metadescription.content = this.response[0].description;
this.itempropdescription.content = this.response[0].description;
},
})
})();
</script>
</polymer-element>
*when it is done this way,i checked the devtools and inspect the dom
element:*
<https://lh3.googleusercontent.com/-Kbz2MO2gsUU/VTnqFe3cvMI/AAAAAAAAAIw/yNd6udsJA_o/s1600/hehe.png>
am i doing right?and in this way google and other search engine can search
it and collect it?
On Friday, April 24, 2015 at 6:57:59 AM UTC+8, arthure wrote:
>
> If you're doing a one-page app like this, you can replace the contents of
> the <title> and <meta> tags when you navigate between pages.
>
> From our experience on polymer-project.org, this seems to work well. The
> Google indexer executes JavaScript. We made changes a few weeks back to
> correct the titles for the element reference pages, and have seen SEO for
> those pages increase significantly.
>
> The other fix was to a separate URL path for each page, instead of using a
> hash. So:
>
> .../elements/core-elements.html#element-name
>
> Became:
>
> .../elements/element-name.html
>
> For Google, you can use Webmaster Tools to see what pages look like to the
> indexer. I suspect other search engines have similar tools.
>
> I recommend anyone do this, whether you're using Polymer or not. In the
> case of pp.org, we found that our SEO issues were unrelated to Polymer.
>
> On Tue, Apr 21, 2015 at 3:43 AM, Peng Kim <[email protected]
> <javascript:>> wrote:
>
>> let me look into it,how it works with your site,are there any drawbacks?
>>
>> On Sunday, April 19, 2015 at 10:04:10 PM UTC+8, Kevin Ashcraft wrote:
>>>
>>> I use the history API to handle SEO for custom element "pages". Mozilla
>>> History API Doc
>>> <https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history>
>>>
>>> It does the following:
>>>
>>>
>>> - Updates the URL and browser history
>>> - Can fire a new analytics event
>>> - Updates the title in the browser history
>>>
>>> Also, my favorite part is that it creates the feel of never leaving the
>>> original page since the browser never has to reload the initial data so if
>>> you're hovering over a menu item and click, the main content can change and
>>> the url and title can change, but that menu never gets reloaded so you're
>>> still hovering over the same element.
>>>
>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>> ---
>> You received this message because you are subscribed to the Google Groups
>> "Polymer" group.
>> To unsubscribe from this group and stop receiving emails from it, send an
>> email to [email protected] <javascript:>.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/polymer-dev/35c8ce29-5535-4935-81ab-f01c0aa230ed%40googlegroups.com
>>
>> <https://groups.google.com/d/msgid/polymer-dev/35c8ce29-5535-4935-81ab-f01c0aa230ed%40googlegroups.com?utm_medium=email&utm_source=footer>
>> .
>>
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/8eb55ab9-6775-4372-85b4-8ec0675a86b3%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
