You might wonder why we are covering search engine optimization (SEO) in an AngularJS book. The answer is simple.
Currently, AngularJS and most JavaScript client-side frameworks are used mostly for web applications. Often, SEO is really not that important where web applications are concerned. As AngularJS gains in popularity, however, it could very well become a major player in the world of website design. AngularJS could potentially replace client-side code that is currently written in Java, PHP, Ruby, and Python.
That is not to say that those languages will be completely replaced—they won’t. Java, PHP, Ruby, and Python will continue to be as important as ever in the world of software development, but in a different way. Those languages and their associated frameworks will take on the role of providing the backend REST services needed for AngularJS and other JavaScript client-side frameworks. When you consider that complete websites could soon be written with AngularJS, it’s clear that SEO should then become a major concern for AngularJS developers. This chapter will help you to better understand AngularJS and SEO.
It is always best to focus more on building a great web application or website, and less on the specifics of search engines. Good design and performance are always by far the most important considerations for a new software project. Although search engine optimization is important, focusing too much on SEO during the design and implementation phase of a project can ultimately cost you valuable development hours.
Eventually, however, you do have to focus on getting your application or site found by all the major search engines. In this final chapter we will look at some of the ways to get your new AngularJS software found. Many of the practices presented here are recommended by Google.
In the past, users of websites built with AngularJS had to follow a rather archaic process in which page snapshots were made for an entire site, and the website could then forward search engines to the snapshots so that they would see the prerendered version of the site rather than the actual JavaScript version of the site. Since conventional search engines didn’t have the ability to execute JavaScript, pages built with AngularJS were rendered to older search engines as a blank white page with no content.
However, in a news release on May 23, 2014, Google confirmed that it now has the capability to index JavaScript websites and applications. That is, the Googlebot has undergone upgrades to make it possible to index sites and applications that use Google’s AngularJS and other JavaScript frameworks. For Google, that time-consuming and often expensive process of SEO for AngularJS is no longer necessary. Although the state of other search engines and their ability to execute JavaScript is unknown at this time, they will undoubtedly follow Google’s lead very quickly, being forced to follow suit or get left behind.
There are also several companies that specialize in helping clients with the website prerendering process. Even though search engines are changing, many of these companies will doubtless continue offering prerendering services for several years, if you feel the need for those services.
With all that said, there are still some ways to increase your chances of getting a better ranking with Google and other search engines. We will cover the SEO tasks that are absolutely necessary:
One of the first things that you should do for SEO is to get a Google Webmaster Tools account. Once you add your site and start to follow Google’s advice, you will see immediate improvements in your ranking and the number of pages of your site that are indexed by Google. The advice given by Google applies to other search engines as well. Don’t expect to see SEO improvements drastically increase your ranking, however; SEO is an ongoing and time-consuming process that can take months or even years to render significant results.
According to Google, a sitemap file is very important to SEO. Google’s Webmaster Tools will help you with the process of building a sitemap and uploading it to Google. Using a sitemap speeds up the process of getting your site indexed by making search engines aware of the pages and links on your site. You should keep the sitemap up-to-date, with any new pages added. Make sure to remove any pages from the sitemap that no longer exist on the site.
Another thing that improves SEO is the use of microformat tags (tag-based navigation). The use of tag-based navigation started on blog sites but has spread considerably over the last few years; it is now used on business websites as well.
Tag-based navigation uses the format shown here to indicate to search engines that the page content contains the related keywords. As you can see, the href attribute contains a link to a page on the site, and the rel attribute tells search engines that the page contains the referenced keywords:
<!-- chapter12/ tag-based navigation --><p>Tags:<ahref="http://www.ulboracms.org/#!/"rel="tag">Ulbora CMS</a>,<ahref="http://www.ulboracms.org/#!/"rel="tag">Java CMS</a>,<ahref="http://www.ulboracms.org/#!/"rel="tag">REST service</a>,<ahref="http://www.ulboracms.org/#!/"rel="tag">JSON REST</a>,<ahref="http://www.ulboracms.org/#!/article/26"rel="tag">REST web services</a></p>
Tag-based navigation is supported by all major search engines.
One of the best ways to improve SEO is to create a clean and efficient AngularJS application. Unnecessary JavaScript should always be avoided. JavaScript methods should execute quickly, with no unnecessary processes running in the background.
Search engines take page speed into consideration when ranking sites. Pages that contain long-running JavaScript functions may get dropped by Google and other search engines and not get indexed. Once a page gets dropped by a search engine, it can take a long time to get that page indexed again.
One last thing that can directly affect page speed and SEO is the speed of the REST web services used to populate page content. Pages that rely on slow REST services can suffer as a result. REST services should return results in two seconds or less.
Services that return results in under a second are best for SEO and site performance. Although REST service design is beyond the scope of this particular book, I want to emphasize how important web service design is to SEO when web pages rely on those services for content. When your site depends on REST services, always make sure those services perform well and add no unnecessary delay to your site or application. Always insist on peak-performing services.
That brings us to the end of this chapter and the end of the book. I’ve done my best to present AngularJS in a way that will make it easy to understand for both beginners and experienced developers alike. The concept of using JavaScript client-side frameworks to build complete frontend applications and websites is relatively new, and often referred to as “cutting edge” by many. The recent Google announcement related to JavaScript and SEO mentioned earlier attests to that.
But things that are considered cutting edge today will be commonplace in a few years. I believe AngularJS will be at the forefront of application development in coming years, and is well worth the time spent learning the framework. This book is only a starting point, however. Now you must go out and develop great applications with AngularJS, and have fun building those applications too! Remember, the best AngularJS application is a well-designed AngularJS application. Always build the best applications that you possibly can. It’s worth the effort in the end.