skip to Main Content

We recently moved our ASP.NET site to AureliaJS. We were delighted until we found out that because it is JavaScript, then it is presented as an almost empty page for crawlers as you can see in the code below.

Is there any way that we can populate the page with the text that we need to make it SEO friendly and have a main image so that Facebook sharing can detect it using AureliaJS?

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="styles/bundle.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <meta charset="UTF-8">
    <meta property="og:title" content="UCR" />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="" />
    <meta property="og:image:width"      content="200">
    <meta property="og:image:height"     content="500">
 <!--   <meta property="og:url" content="http://dev.cr/" /> -->
    <meta property="og:description" content="" />
   <!-- <script>  
        $(".se-pre-con").fadeOut("slow");
    </script> -->
  </head>
  <body aurelia-app="main" class="uscr-body">

  <div class="se-pre-con"><!--<h1 class="uscr-h1-loading">Cargando UCR</h1> --></div>

    <script src="js/jquery-2.1.3.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="jspm_packages/system.js"></script>
    <script src="config.js"></script>
    <script>
      System.baseUrl = 'dist';
      System.import('aurelia-bootstrapper').catch(console.error.bind(console));
    </script>
  </body>
</html>

3

Answers


  1. That is a problem with client frameworks in general. The server needs to deliver the pages for SEO, it´s called server side rendering. One famous module for that is prerender.io: https://prerender.io/

    With React/Redux: http://redux.js.org/docs/recipes/ServerRendering.html

    Login or Signup to reply.
  2. A similar question was asked last year, and there are some suggestions there. Most importantly, this answer points to a post by Rob Eisenberg in the associated issue where he says that support for this feature is expected to happen within 2016. So my suggestion is to follow that issue, and if you have someone on your team who’s familiar with one of the external libraries to pre-render your content, do that. Otherwise, you could (manually or via a Gulp task) replicate the SEO-relevant portion of your copy on index.html in a hidden div so that the spiders see it but it’s not visible to humans.

    Login or Signup to reply.
  3. I wonder if aurelia enhance feature would allow SEO. Problem is it won’t leverage all aurelia capabilities:
    http://ilikekillnerds.com/2016/01/enhancing-at-will-using-aurelias-templating-engine-enhance-api/
    You can only enhance DOM elements
    You cannot enhance an already enhanced element

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search