I've made an app where almost all the content is dynamically loaded. It displays users posts, categories, search results, etc.
The problem is that the content doesn't get indexed. I assumed search engines had a way of indexing this since a lot of website load content this way. I used the tools in google search console to find out it only renders the template but it doesn't account for anything dynamically loaded.
Is there any way to fix a flaw like this without a complete SSR rewrite? Or if there isn't can I get a suggestion of good SSR tools for javascript?
Related
I understand that flutter is still in it's development stages but I really enjoy building apps using the dart language.
Would it be possible to programatically create individual html files which holds all the basic metadata and SEO code needed to show up on a search engine?
You can add SEO META tags but they will be the same for the whole single page app because Flutter Web's navigation is based on hashes - bad for crawlers trying to index your site.
Flutter is more optimized for single page web applications.
You can try angular dart, it seems to be better optimized for SEO for some reason.
My project is a single page application using react js. I have heard that Google can crawl javascript pages including react js single page applications, without the need of server side rendering (even though it's generally better for SEO).
However, when I used webmaster tool: fetch and render as google, both what google bots are seeing and what visitors to my page are seeing are blank.
Even though I can add specific urls to google indexing, google only uses the title and description tag that I have put in my static index.html file, it doesn't get the nested react helmet component's title and description. Does anyone have experience in this? Appreciate it much!
To answer your question, ensure that you have polyfilled the necessary es6 features, google crawler's javascript feature can be quite limited, it does not have Array.find for example. You can read more about that here https://github.com/facebookincubator/create-react-app/issues/746#issue-179072109
As for tips for improving SEO, you can use these tips:
You can prerender your pages on build time to static html by using react-snapshot https://www.npmjs.com/package/react-snapshot This works great if your app does not have many dynamic content.
You can use pre rendering service like prerender.io / use static hosting with prerendering feature like netlify or roast.io. As for prerender.io, you can even host it yourself!
If I use Jades template engine with NodeJs will the app be crawlable by search engines and Facebook without using the _escaped_fragment_?
If your application outputs HTML, it is no different than if you had written that HTML in a file and simply served the file. The wider Web doesn't generally know or care what you're using to generate your HTML.
(It is possible to infer what tech a page is using by inspecting headers and looking for common idioms that are unique to a particular technology, but these are just clues, not a fundamental difference in what your Web page is.)
I am doing an angularjs app with a nodejs-expressjs server.
I want to do an app that it's similar to a business directory.
I have doubts about if it's possible doing it SEO friendly to the all items at the directory, either by his name or his features (tags). Always having in mind that all pages are created with AngularJS.
If it is possible, how to do that dinamically.
I implemented an example that uses prerender server (this https://github.com/prerender/prerender) and the prerender-node library at the app server.
My example's pages, created by angularjs, does work (are SEO friendly, it appears at google's search)..but the pages are "static", and the directory it's going to add always new bussines to the directory that I want to appear in googles searching.
Besize, I want my app to be multi-language, and also have doubts about how to do all of that be multi-language, and if it is possible.
I hope you can help me.
If you're hosting your own Prerender server, it will serve the page "on the fly" every time Google accesses it, so it will always have the latest, dynamic content from your pages. If you're using a Prerender plugin to cache your pages, you'll need to make sure you recache them... or use our Prerender.io SaaS and we'll take care of all of the recaching for you.
It sounds like you just want Google to crawl your pages more often because of how dynamic your content might be. In order to have Google crawl your pages more often, make sure to quality inbound links from other sites to increase your PageRank.
Here is lots of advice from Google about multi language sites: https://support.google.com/webmasters/answer/182192?hl=en
I'm currently learning Node.js and AngularJS. To learn how to develop with these technologies, I've been playing with the Phone Catalog sample app found here.
The thing I can't figure out is, how to include a server-generated page in my views. Everything I see with Angular seems to be related to static .html. However, I would like a dynamic page that includes some code that's generated on the server. In other words, I would like to add something like
/app/partials/dynamicPhone
Is this even possible? For the life of me, I can't figure out how to add a server-side page as a partial.
Thank you
AngularJS don't differentiate between server-generated pages, and static pages. From browser's perspective it's all the same.
Just use your /app/partials/dynamicPhone as you would use a static template - only remember you can't use any query parameters with it (because it's supposed to be "static" ie. not changing)