Browser support

The https://www.ucas.com core non-functional requirements v2.1 states:

  • https://www.ucas.com must be compatible with supported browser standards and render appropriately for desktop and mobile devices.
  • Supported browsers are IE, Mozilla, Chrome, and Safari.
  • Supported browser versions at a given point in time are the latest version and the penultimate version for desktops, and the latest version only for mobile/tablet editions of these browsers.

Progressive enhancement

When creating web pages, the only part of a page that you can rely upon working is the HTML. Even that can fail, but without HTML there is no web page and everything else becomes moot. The attitude towards building for the web with this in mind is called progressive enhancement.

Source https://www.gov.uk/service-manual/making-software/progressive-enhancement.html

The page goes on to give guidelines under the following headers:

  • First, just make it work.
  • Second, make it work better.
  • It isn't about 'JavaScript off'.
  • It isn't only about JavaScript.

Responsive design

We have a small library of resources which we refer to for guidance on design priciples, regarding responsive website creation:

  • Responsible Responsive Design by Scott Jehl, ISBN 9781937557164
  • Responsive Web Design by Ethan Marcotte, ISBN 9781937557188

Performance budgeting

A performance budget is just what it sounds like: you set a “budget” on your page and do not allow the page to exceed that. This may be a specific load time, but it is usually an easier conversation to have when you break the budget down into the number of requests or size of the page.

The BBC did this with their responsive mobile site. They determined that they wanted each page to be usable within 10 seconds on a GPRS connection and then based their goals for page weight and request count on that.

Once those goals are set, you stick to them. Anytime you want to add something to a page, you need to ensure it stays within budget. Steve Souders talked about the three options you have if something does not fit within the budget:

  1. Optimize an existing feature or asset on the page.
  2. Remove an existing feature or asset from the page.
  3. Don’t add the new feature or asset.
  4. Just be sure to define the budget early on. Defining a performance budget after you’ve already finalized the appearance of a site limits its effectiveness. It may still help to guide decisions about plugins and so on, but deciding a page can’t exceed 500kB when a mock-up containing three carousels and a full-screen high-resolution background image has already been approved isn’t going to do you much good.

    Srouce http://www.timkadlec.com/2013/01/setting-a-performance-budget

Further reading

Security

Security has many tenets, but from a frontend developer point of view, we will pay particular attention to the following areas:

  • writing secure JavaScript
  • external resources
  • HTTPS