{"id":630,"date":"2015-10-16T21:50:20","date_gmt":"2015-10-16T19:50:20","guid":{"rendered":"http:\/\/blog.thecodecampus.de\/?p=630"},"modified":"2023-12-20T20:20:29","modified_gmt":"2023-12-20T19:20:29","slug":"angular-seo-google-drops-support-of-the-hashbang","status":"publish","type":"post","link":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/","title":{"rendered":"AngularJS SEO – google will index javascript sites"},"content":{"rendered":"

Google moves yet another step forward and indicates\u00a0that single page application are getting more common. They just announced<\/a> to drop the support of hashbang urls and crawl javascript sites without any pre-rendering (html snapshots) of the site – which is totally cool. But there are some limits regarding canonical tags as I discovered.<\/p>\n

In order to get your single page application\u00a0indexed it is required to implement the following steps:<\/p>\n

    \n
  1. use the\u00a0<\/span><\/span>HTML5 <\/span>History<\/span> API
    \n<\/span><\/span><\/strong>Which<\/span><\/span> is<\/span>\u00a0<\/span>very<\/span> easy <\/span>with<\/span> ui<\/span>-router. <\/span>You’ll<\/span> find <\/span>further<\/span> information<\/span> in <\/span>the<\/span>\u00a0article\u00a0<\/span><\/span>about<\/span>\u00a0<\/span>    migrating<\/span>\u00a0existing projects from <\/span>hashbang<\/span> to regular <\/span><\/a>urls<\/a>.<\/span><\/strong><\/span>\u00a0<\/span><\/strong><\/span><\/li>\n
  2. use sitemaps<\/strong>
    \nFrom our point of view the google bot is able to fetch most sites without sitemaps, but you really should create a sitemap to cover all cases. Especially when you <\/span>are having views whose <\/span>urls<\/span> will never be part of your menu <\/span>structure<\/span> or linked on your site. E.g. <\/span>url<\/span> with parameter <\/span>cho<\/span><\/span>sen<\/span><\/span> from a select box. <\/span><\/span>\u00a0<\/span><\/li>\n<\/ol>\n

    While the Meta Description and title tags will be perfectly recognized, \u00a0google lacks of understanding\u00a0canonical tags when they are generated from angular. Probably they will adjust this behavior in the near feature. If they wont you are advised to use Schema.org’s breadcrumbs.<\/p>\n

    Hint<\/i><\/b>: Do not expect markup generated from angular to show up in th<\/i>e “<\/i>Fetch as Google”. It wont! The result will only show the html file which calls your app. No angular generated html code \/ content. This does not mean that something went wrong.<\/i><\/p>\n

    If you<\/i> are still not able to get your site in the google index make sure that you have<\/i> sitemaps and try use of canonical tags or add your markup with JSON-LD in order to enhance\u00a0<\/i>googles understanding of the content<\/i>. <\/i>
    \nWhen all of this wont help \u2013 use the comment section and post your link –\u00a0<\/i>\u00a0<\/i>we are looking forward to analyz<\/i>e some case studies.<\/i><\/p>\n","protected":false},"excerpt":{"rendered":"

    Google moves yet another step forward and indicates\u00a0that single page application are getting more common. They just announced to drop the support of hashbang urls and crawl javascript sites without any pre-rendering (html snapshots) of the site – which is totally cool. But there are some limits regarding canonical tags as I discovered. In order […]
     READ MORE<\/a><\/p>\n","protected":false},"author":29,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,2],"tags":[62,61,84],"class_list":["post-630","post","type-post","status-publish","format-standard","hentry","category-angularjs","category-javascript","tag-angularjs","tag-javascript","tag-seo"],"yoast_head":"\nAngularJS Seo - get your Site indexed without pre-rendering<\/title>\n<meta name=\"description\" content=\"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"AngularJS Seo - get your Site indexed without pre-rendering\" \/>\n<meta property=\"og:description\" content=\"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Development tips and tricks - theCodeCampus Blog\" \/>\n<meta property=\"article:published_time\" content=\"2015-10-16T19:50:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-12-20T19:20:29+00:00\" \/>\n<meta name=\"author\" content=\"theCodeCampus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"theCodeCampus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/\"},\"author\":{\"name\":\"theCodeCampus\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#\\\/schema\\\/person\\\/276bbda2f8da73154f22fb652201cfbc\"},\"headline\":\"AngularJS SEO – google will index javascript sites\",\"datePublished\":\"2015-10-16T19:50:20+00:00\",\"dateModified\":\"2023-12-20T19:20:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/\"},\"wordCount\":325,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#organization\"},\"keywords\":[\"AngularJS\",\"JavaScript\",\"Seo\"],\"articleSection\":[\"AngularJS 1\",\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/\",\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/\",\"name\":\"AngularJS Seo - get your Site indexed without pre-rendering\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#website\"},\"datePublished\":\"2015-10-16T19:50:20+00:00\",\"dateModified\":\"2023-12-20T19:20:29+00:00\",\"description\":\"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/angular-seo-google-drops-support-of-the-hashbang\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"AngularJS SEO – google will index javascript sites\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/\",\"name\":\"Web Development tips and tricks - theCodeCampus Blog\",\"description\":\"Tips, tricks, and experiences about developing web and mobile applications with Angular, TypeScript, and Testing.\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#organization\",\"name\":\"theCodeCampus\",\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/TCC-Logo-Bildmarke-quadratisch.jpg\",\"contentUrl\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/TCC-Logo-Bildmarke-quadratisch.jpg\",\"width\":156,\"height\":156,\"caption\":\"theCodeCampus\"},\"image\":{\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/#\\\/schema\\\/person\\\/276bbda2f8da73154f22fb652201cfbc\",\"name\":\"theCodeCampus\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg\",\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg\",\"contentUrl\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg\",\"caption\":\"theCodeCampus\"},\"description\":\"Our knowledge is not simply gained through reading - it is trained, tested and constantly being expanded. Because first and foremost, we are all developers at W11K. The know-how that we acquire here as developers, consultants and information architects flows immediately into our training courses and articles for theCodeCampus.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/showcase\\\/thecodecampus\\\/\"],\"url\":\"https:\\\/\\\/www.thecodecampus.de\\\/blog\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"AngularJS Seo - get your Site indexed without pre-rendering","description":"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/","og_locale":"en_US","og_type":"article","og_title":"AngularJS Seo - get your Site indexed without pre-rendering","og_description":"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!","og_url":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/","og_site_name":"Web Development tips and tricks - theCodeCampus Blog","article_published_time":"2015-10-16T19:50:20+00:00","article_modified_time":"2023-12-20T19:20:29+00:00","author":"theCodeCampus","twitter_card":"summary_large_image","twitter_misc":{"Written by":"theCodeCampus","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/#article","isPartOf":{"@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/"},"author":{"name":"theCodeCampus","@id":"https:\/\/www.thecodecampus.de\/blog\/#\/schema\/person\/276bbda2f8da73154f22fb652201cfbc"},"headline":"AngularJS SEO – google will index javascript sites","datePublished":"2015-10-16T19:50:20+00:00","dateModified":"2023-12-20T19:20:29+00:00","mainEntityOfPage":{"@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/"},"wordCount":325,"commentCount":4,"publisher":{"@id":"https:\/\/www.thecodecampus.de\/blog\/#organization"},"keywords":["AngularJS","JavaScript","Seo"],"articleSection":["AngularJS 1","JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/","url":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/","name":"AngularJS Seo - get your Site indexed without pre-rendering","isPartOf":{"@id":"https:\/\/www.thecodecampus.de\/blog\/#website"},"datePublished":"2015-10-16T19:50:20+00:00","dateModified":"2023-12-20T19:20:29+00:00","description":"SEO alert! Google drops hashbang support in Angular. Elevate SEO, adapt to changes, boost search visibility. Stay ahead\u2014optimize your Angular app!","breadcrumb":{"@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.thecodecampus.de\/blog\/angular-seo-google-drops-support-of-the-hashbang\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.thecodecampus.de\/blog\/"},{"@type":"ListItem","position":2,"name":"AngularJS SEO – google will index javascript sites"}]},{"@type":"WebSite","@id":"https:\/\/www.thecodecampus.de\/blog\/#website","url":"https:\/\/www.thecodecampus.de\/blog\/","name":"Web Development tips and tricks - theCodeCampus Blog","description":"Tips, tricks, and experiences about developing web and mobile applications with Angular, TypeScript, and Testing.","publisher":{"@id":"https:\/\/www.thecodecampus.de\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.thecodecampus.de\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.thecodecampus.de\/blog\/#organization","name":"theCodeCampus","url":"https:\/\/www.thecodecampus.de\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.thecodecampus.de\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.thecodecampus.de\/blog\/wp-content\/uploads\/2024\/01\/TCC-Logo-Bildmarke-quadratisch.jpg","contentUrl":"https:\/\/www.thecodecampus.de\/blog\/wp-content\/uploads\/2024\/01\/TCC-Logo-Bildmarke-quadratisch.jpg","width":156,"height":156,"caption":"theCodeCampus"},"image":{"@id":"https:\/\/www.thecodecampus.de\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.thecodecampus.de\/blog\/#\/schema\/person\/276bbda2f8da73154f22fb652201cfbc","name":"theCodeCampus","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.thecodecampus.de\/blog\/wp-content\/uploads\/2024\/01\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg","url":"https:\/\/www.thecodecampus.de\/blog\/wp-content\/uploads\/2024\/01\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg","contentUrl":"https:\/\/www.thecodecampus.de\/blog\/wp-content\/uploads\/2024\/01\/TCC-Logo-Bildmarke-quadratisch-96x96.jpg","caption":"theCodeCampus"},"description":"Our knowledge is not simply gained through reading - it is trained, tested and constantly being expanded. Because first and foremost, we are all developers at W11K. The know-how that we acquire here as developers, consultants and information architects flows immediately into our training courses and articles for theCodeCampus.","sameAs":["https:\/\/www.linkedin.com\/showcase\/thecodecampus\/"],"url":"https:\/\/www.thecodecampus.de\/blog\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/posts\/630","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/users\/29"}],"replies":[{"embeddable":true,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/comments?post=630"}],"version-history":[{"count":6,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/posts\/630\/revisions"}],"predecessor-version":[{"id":2174,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/posts\/630\/revisions\/2174"}],"wp:attachment":[{"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/media?parent=630"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/categories?post=630"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.thecodecampus.de\/blog\/wp-json\/wp\/v2\/tags?post=630"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}