Australian Tax Office | Examples | Responsive Web Design

Australian Tax Office

Australian Tax Office across four different breakpoints

View Australian Tax Office

The Australian Tax Office has gone all reponsive. This is a really big deal for just about every Australian as the good majority of tax paying adults will need to visit the ATO site at some point during the year, mostly around the end of the tax year, not to mention all of the business visits as well (although Accountants are probably aware of the rules and regulations… you’d hope).

In the review I’ve noticed a few strange things that appear to be CMS focussed. The CMS that is being used is Ektron so I’m not sure whether it’s issues with the CMS itself of more the implemenation of the CMS that is causing them.

First off, the entire homepage is wrapped in a <form> element. This doesn’t make the page load any slower but it is incredibly non-semantic.

The next few things are elements that should be looked at.  There are two blocking javascript requests that occur immediately after the <head> tag.

This is then followed up with 5 requests for separate CSS files

  1. bootstrap.min.css
  2. jquery-ui.css
  3. global.min.css
  4. alex.min.css
  5. font-awesome.min.css

While I’m impressed that these are all the minimised versions of the CSS, it would be great if they could extend that minification to concatination of those files and have just a single HTTP request for the CSS.

One piece of saving grace is that the site is running on https which means that it is a candidate for running on the HTTP2 for browsers with this enabled meaning that http requests are not added performance issues as all files can be sent back at once.

In addition to the extra CSS requests there are also several calls for JS in the <head> including

  1. modernizr-2.8.3-respond-1.4.2.min.js
  2. jQuery-1.11.2.min.js
  3. boostrap.min.js
  4. jquery-ui.js
  5. jquery.hoverIntent.min.js

 

These are just the blocking requests within the <head> of the site, there are more in the footer (but at least they’re in the footer).

There are a further 21 javascript requests in the footer of the site and all of them are synchronous requests rather than Asynchronous (meaning they are blocking requests).


<script src="/js/vendor/jquery.mmenu.oncanvas.min.js"></script>
<script src="/js/vendor/jquery.mmenu.fixedelements.min.js"></script>
<script src="/js/vendor/jquery.mmenu.header.min.js"></script>
<script src="/misc/js/GlobalConstants.js"></script>
<script src="/misc/js/ExtendedFunctions.js"></script>
<script src="/js/SocialMediaLinks.js"></script>
<script src="/js/libs/accordion.js"></script>
<script src="/js/DisplayType.js"></script>
<script src="/js/accessibility.js"></script>
<script src="/js/UUIDCookieWriter.js"></script>


<script src="/misc/js/redesign.min.js">/* ATO_SPA(Visual Redesign) */</script>
<script src="/misc/js/alex.min.js">/* ATO_SPA(Visual Redesign) */</script>
<script src="/misc/js/loop11-loader.js">/* ATO_SPA(Visual Redesign) */</script>
<script src="/misc/js/qualtrics-loader.js">/* ATO_SPA(Visual Redesign) */</script>

<script src="/misc/js/DisplayGoogleForm.js">/* ATO_SPA(GoogleSurveySF ) */</script>
<script src="/misc/SPA/GSASearch/js/jquery-migrate.js">/* ATO_SPA(GSASPABannerSearch) */</script>
<script src="/misc/SPA/GSASearch/js/jquery.ba-hashchange.min.js">/* ATO_SPA(GSASPABannerSearch) */</script>
<script src="/misc/SPA/GSASearch/js/ato_search_config.js">/* ATO_SPA(GSASPABannerSearch) */</script>
<script src="/misc/SPA/GSASearch/js/ato_search_ga.js">/* ATO_SPA(GSASPABannerSearch) */</script>
<script src="/misc/SPA/GSASearch/js/spa.js">/* ATO_SPA(GSASPABannerSearch) */</script>
<script src="/misc/SPA/GSASearch/js/ato_search_spa.js">/* ATO_SPA(GSASPABannerSearch) */</script>

Australian Tax Office Technical Details

Site Meta Tag

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

Media Queries

Plugins used on Australian Tax Office

Frameworks used on Australian Tax Office

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.