13 ms·
Why we use progressive enhancement to build Gov.uk
- ashitlerferad 10y agoI wish progressive enhancement were more popular, but it is probably too late for anyone to ever care about it.
- robin_reala 10y agoWell, not anyone, we care :) Part of the reason I wrote this was to provide some ammo for people that want to go down this path for the right reasons, but don’t know how to argue for it.
- afarrell 10y agoI care about it but I just feel so befuddled by CSS that I don't know where I would begin to learn to do it. I've been hoping that I could find somewhere that teaches a mental model of layout which doesn't feel like playing whack-a-mole. However, I've spent 9 years of using HTML+CSS, had multiple discussions with fellow engineers, and even asked an MDN technical writer. Everything I've seen tells me that, "yep, CSS is just like that." And so getting rid of JavaScript as a tool to make things work just doesn't make sense. Hopefully flexbox becomes more prolific.
- allendoerfer 10y agoSorry, but 9 years are definitely enough to learn CSS. If that is true, you have experienced IE6, whose broken implementation helped nicely to understand the underlying models.
- Kenji 10y agoNo, he's right. The browser incompatibilities are incredible. The devil lies in the subtle things. Relative spacing and heights, absolute positions, divs that have to line up, etc. As soon as you require precision on all browsers, it becomes a nightmare. And a decade of HTML+CSS experience changes nothing about that, unless you only go for the most simplistic website imaginable.
- allendoerfer 10y agoThe only real difference between Chrome and Firefox I notice regularly these days are subpixel rounding, input + button positioning in Firefox and styling of stuff like checkboxes, selects or radio buttons. It is a pita, a few weeks ago I implemented a responsive design for a wine website created from the company's print agency, who just vomitted layers upon layers of images on the thing. Zero whitespace. Still it is nothing like it was 10 years ago. IE6 with its float bug simply destroyed the whole layout. Now it is more like "this button is 2px off in Firefox" or "here is some whitespace in chrome".
- Kenji 10y agoJust a few days ago, I noticed a bug in IE11 that destroyed a layout of a site of mine that used absolute position on a div. It worked in Chrome, Firefox, Edge and on mobile browsers. Things break just like in the 90's unless you constrain yourself to a very small set of commands and topologies that are guaranteed to work.
- zeveb 10y ago> As soon as you require precision on all browsers, it becomes a nightmare. Don't do that then. Seriously, browsers aren't meant to provide bit-for-bit precision. Really, they can't: your page will be viewed on phones, on phablets, on tablets, on laptops, on desktops, on giant wall-screens; it will be viewed in colour, in black-and-white, in high-contrast palettes; it will be viewed with the same fonts you have installed, and without them and in monospace; it will be read aloud; it will be copy-pasted; it will be saved as plain text or as HTML. Just … don't do that. Resist the impulse to do everything one browser or two browsers will let you get away with; limit yourself to what works on all browsers.
- afarrell 10y agoMaybe if I had focused on just HTML+CSS, but alongside going to university and studying/working with other more predictable things like page tables or Django...nope.
- adrianratnapala 10y agoWell anyone who tries to access a slow loading page cares. As does anyone trying to use a page that misbehaves because over-aggressive javascript taking control in unhelpful ways cares. Anyone who's phone runs out of battery because some script is in a crazy loop cares. They might know know or care what the technical reasons or solutions are. That's supposed to be our job.
- PieterH 10y agoThe gov.uk site is wonderful to use! It is incredibly fast, just a tenth of a second latency, it feels.
- vertex-four 10y agoThere's a lot of people who really don't like gov.uk, and I don't understand why. I've always been able to find the information I'm looking for quickly - faster than any other Government website I'm forced to use.
- anon1385 10y agoLots of information that used to be on government sites was removed. They added Google Analytics everywhere. Even on the pages where you fill in your taxes or apply for a passport. Google does not need to know my tax details. Google shouldn't know my tax details. Since Google isn't even a UK company the UK government doesn't even have legal authority over what Google does with the information they now hold about UK citizens taxes.
- robin_reala 10y agoAll user data is anonymised before sending to Google. I believe we strip the last two blocks off the IP address before sending it over. We use the analytics to inform choices we make - our 3rd design principle is to ‘design with data’ https://www.gov.uk/design-principles#third https://www.gov.uk/design-principles#third . Finally, on projects where it’s critical that any data doesn’t go out of the UK like Verify we run our own instances of analytics software.
- anon1385 10y ago>I believe we strip the last two blocks off the IP address before sending it over. No you don't. You don't "send" anything over to Google. The users browser does because loading a gov.uk page also loads a Google Analytic script straight from google-analytics.com. You don't have the power to prevent the users IP being sent to Google in that situation and it's worrying that you think you do. Additionally, focusing on the IP address seems rather silly when a much more accurate tracking cookie is being used.
- Taig 10y agoI really appreciate that kind of focus and dedication. I recently had another dive into web development after a couple years of absence and was pleasantly surprised by tools like react. In combination with server side rendering it allowed me to serve a solid/usable HTML page with no JS required. When I started pulling in components from popular Material Design libraries, though, I realized that nobody thought about progressive enhancement even for a second. Rather than serving a plain `<select />` and then progressively enhancing it, all I got was an unusable mix of HTML tags and styling. It's a shame that even down at the library level people don't care about progressive enhancement. Are there any (react) projects that try to do better or is the mantra more like: react without JS is nonsense?
- s_kilk 10y agoThere's no substitute for caring, and unfortunately much of the contemporary JS/Web world just doesn't care about these issues.
- masklinn 10y ago> There's no substitute for caring Or for being paid, progressive enhancement is more work than not doing it and if the client/manager/… doesn't want to pay for it… the dev is unlikely to bother doing it on their own dime.
- sjclemmy 10y agoToo right - PE costs more and unless explicitly specified and understood it's not going to be done.
- TeMPOraL 10y agoPE is the default of how HTML, CSS and JS work. You have to go out of your way to screw it up. Which is precisely what the whole web world delights in doing now.
- 10y ago
- adrianratnapala 10y agoI like the reasons they give why users might not have JS, even though they haven't blocked it themselves. Here are three: * user’s hotel is intercepting the connection and injecting broken JavaScript * user’s telecoms provider is intercepting the connection and injecting broken JavaScript * user’s country is intercepting the connection and injecting broken JavaScript Broken or not: all three of those sound like good reasons to intentionally block JS.
- allendoerfer 10y agoThese are not solved by progressive enhancement but by SSL.
- pmlnr 10y agoHow exactly SSL will solve this when there is a middleman proxy?
- allendoerfer 10y agoIt is the whole point of SSL that there are not any.
- robin_reala 10y agoMy last point about the user’s country linked to the example of Kazakhstan, where all HTTPS traffic is blocked unless you install a government-supplied middleman cert.
- pjc50 10y agoAnd here's a good example of one hand giving while the other takes away; other parts of the UK government are quite cozy with Kazakhstan. We probably sold them the HTTPS interception solution.
- NoGravitas 10y agoUnfortunately, most employers and many countries violate this expectation. I expect businesses providing wifi to customers to start doing this, too.
- muzster 10y agoThis is quite progressive for the government. think of all the savings for the government - no need to update old hardware sitting in the schools, libraries, Councils etc...
- OJFord 10y agoI tweeted recently to say how I'd wanted to give some good feedback to @GDSteam, and the beta feedback link redirected me to a localhost URL. I hoped this would be a quick and pleasant interaction, but - and I really should have guessed it - the Twitter 'operator' was clearly so far removed from the developer that can quickly fix it.
- joelanman 10y agoI work at GDS - that sounds broken, can you let me know where that link to localhost is?
- jamiegreen 10y agoI love that someone from GDS is here in the comments and cares enough to follow up on something like this. You guys do a great job. I hope this attitude exists across government departments!
- toyg 10y agoI'm just back from this year's PyCon UK. There were quite a few GDS people there, they've attended for several years now in increasing numbers. All good geeks doing good work (and recruiting!).
- OJFord 10y ago> and recruiting! When I looked previously it seemed the department was hiring only for short-term contracts? Which worries me a bit if that's the case - I think it's fantastic what and how they're doing it, but not if the philosophy is "ship it and forget".
- robin_reala 10y agoNope, go to https://www.civilservicejobs.service.gov.uk/ https://www.civilservicejobs.service.gov.uk/ and put Government Digital Service into the organisation field. We’re currently recruiting developers / senior developers and web ops. No pure front-end developers at the moment though. Re short term contracts, we hire for two year contracts but it’s not explained well that it’s trivial to extend those. We’re also trying to make roles permanent as well in general.
- georgespencer 10y agoI'm glad GDS is working to improve gov.uk sites but some really simple things still seem broken. Example: it'd be great if GDS would stop with the ridiculous forced password recipes across gov.uk sites. Today I had to try three times to get 1password to satisfy the insane requirements of the site (8-12 alphanumerics, no special characters).
- UK-AL 10y agoI'm not surprised really, since the sort of services you can access with a gov.uk account can lead to identify theft or other types of fraud.
- alexmuller 10y ago> it'd be great if GDS would stop with the ridiculous forced password recipes across gov.uk sites. GDS isn't enforcing weird password policies across government. This is the advice GDS publishes on passwords: https://www.gov.uk/service-manual/user-centred-design/resources/patterns/create-password https://www.gov.uk/service-manual/user-centred-design/resour...
- xchaotic 10y agoThis may not go down too well, but it is an opinion I heard and I personally agree with (having worked in UK gov institution and that far from GDS): GDS is wasting taxpayer money, spending way too much attention on minute details like apostrophes, CSS and stuff. Given that most of *.gov.uk are standardised now, it works out to literally millions of GBP per line of CSS. In an ideal world we'd have fully accessible web, progressive enhancement, responsive layouts etc, but any real business has to say stop - this does not improve our services that much anymore, whereas GDS are free to to redesign their CSS over and over, just because no one else in the government understands technology.
- neximo64 10y agoWhat about the time saved simply through the use of information in terms of phone calls and interaction with the government? Gov.uk is so easily traversable and it's very easy to find information. You guys are so lucky. My governments website is nothing like that and I struggle with where to find anything. Simple things such as the use of the word 'etc' to describe things needed on an application or the use of wording which is difficult to understand.
- sjclemmy 10y agoMy initial reaction to the post was similar - but remember that government aims are different from the business world and funding works in a very different way. I've also worked in government and it does sometimes feels like money is being wasted everywhere, which I found frustrating - but I've not managed to come up with a valid argument against the way they do things. I think setting up a behavioural comparison between businesses and government is a false opposition.
- cmdkeen 10y agoIf we want to provide Government services via the internet, which is far cheaper than other forms of delivery, then a setup that doesn't ignore 0.9% of your user base who can't run JS is worthwhile. They should also be caring about accessibility, something that most business give zero thought to (despite legal requirements) because they're the Government, it is their job to work for all citizens not just ignoring the ones that are difficult. There are some good tech people working in UK Government, there are also some utterly terrible ones. I'd far rather have GDS spending the odd million to provide a baseline of what we should expect from Government IT than put up the culture that has foisted every other Government IT disaster on us.
- Flenser 10y agouser’s company has a proxy that blocks some or all JavaScript This one bites me every day. Websites with their social button / analytics scripts before the main feature JS become unusable if the 3rd party JS errors or fails to load.
- toyg 10y agoI'm pretty sure some sites (cough-BoingBoing-cough) do it intentionally: no tracking, no content.
- guessmyname 10y agoIs progressive enhancement still possible nowadays? Considering how many millennials choose JavaScript frameworks for most of their projects I suppose not. It is very rare for me to find a website that works without JavaScript enabled either because the website in itself is written with JavaScript (which by the way doesn't sounds like a good idea, try that with Lynx) or because they are using analytic services as dependencies for the rest of the code.
- hackits 10y agoFrom personal experience for a number of web-sites I've have had drop curl and use a headless chrome browser with ChromeDriver/Selenium/Python to get the data I need now.
- zeveb 10y ago> Is progressive enhancement still possible nowadays? It's certainly possible to write a site intending to progressively enhance it. It's easy, even. It's not possible for end users to rely on it existing, because as you note lazy, sloppy developers don't bother. I prefer to light a candle and curse the darkness.
- JohnMH 10y agoThe JavaScript annoyance will always be a part of web development at this point, but I really don't see why so many people use these single-page applications and require JavaScript to perform simple tasks.
- sanderjd 10y agoBecause full page loads are a poor user experience for many actions a user can perform. The more such actions that are possible, the more it makes sense to build as a web application instead of a web site.
- kbart 10y agoWhat's wrong with an old school navigation bar and page segmentation? You really don't need JS to display simple blog or other text-mostly webpages.
- adrianratnapala 10y agoThey are a poor user experience because you don't want to have to load the whole text for cases where the user is only supposed to see some of it at first? If so: then does it make sense to download megabytes of JS libraries in order to save downloading 100kB of text?
- sanderjd 10y agoThat's not what I'm talking about. I'm talking about actions a user is taking. For instance, HN just performed a full page load for me to make this comment, and will do another one after I click "reply", and then I'll have to find my place again. That is sucky and would be much better implemented with javascript and a background POST. This is somewhat ok on HN because actions like commenting are much more rare than passively reading content (and because I find enough value in the commentary here that I'm willing to put up with quite a bit of suckiness), but it is a lot less ok for applications that are a lot more behavior based. To put it in concrete terms, I came to the conclusion that SPAs (or at least using javascript to implement most behaviors on individual pages of a multi-page application) make a ton of sense after spending a few years building an internal line-of-business application with a lot of behavior and not much content as a normal Rails multi-page app, noticing that the user experience was not great at all, and finding it to have very low return on investment to attempt to do it with progressive enhancement. We would have saved a lot of time and money by starting with a JS-based SPA approach for an application like that. If I were building a blog or news site, I suspect the opposite would be true.
- jsingleton 10y agoHere's the original post that explains how they got the numbers: https://gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement https://gds.blog.gov.uk/2013/10/21/how-many-people-are-missi... Looks like this was removed after a few years: https://github.com/alphagov/frontend/pull/944 https://github.com/alphagov/frontend/pull/944 I'd like to see the data over that period and see what the JS stats are like today.
- robin_reala 10y agoWe’re working on revamping and rerunning the test, will hopefully have new data before the end of the year.
- zeveb 10y agoThis, this, so much this. We owe it to our users to provide all of them with a good experience. We also owe it to ourselves to write good, clean, maintainable applications. The wonder of it is that very, very often if we write RESTful apps then progressive enhancement just falls out naturally: a GET request with some JSON Accept header will return data; with text/html it'll return data, and possibly a form to update it; a POST with some JSON Content-Type will DTRT, and so will one with application/x-www-form-urlencoded or multipart/form-data. Why wouldn't one do that? Of course, the user experience of such an app isn't as great as a singing, dancing single-page app (SPA). But a user experience is better than no user experience, which is what offering only an SPA provides. It's just sloppy to require JavaScript and CSS to use a web site. It's particularly sloppy when that web site is composed of documents.
- mattnewton 10y ago> Why wouldn't one do that? There's a litany of reasons, but they all basically boil down to it's more work than just picking one solution that you think most people will use and executing on it well. Those users usually get a better experience and the pointy-haired boss is happy you shipped so fast. I didn't have the luxury of doing any of this until working at my current Big Co. web job, where accessibility is non-negotiable and we actually take steps to make sure everyone can use our sites. But even then don't serve pages that work without javascript half the time.
- borplk 10y agoFor government websites I can understand it but for commercial stuff I think this attitude of "everyone must be supported at all cost" is nonsensical. Where do you draw the line? Do I have to also support people who prefer to use command line text-based web browsers? Before you know it we'll have someone say "Oh I work for a bank, we have HTML disabled here. Can you make it work without HTML?" give me a break.
- zeveb 10y ago> Do I have to also support people who prefer to use command line text-based web browsers? Yes. The web is about linked HTML documents: if you don't support lynx, links, elinks, w3m, emacs-w3m & eww then you're honestly not doing Web development properly. You have to do more work to not support them, because writing plain HTML + forms is the baseline. > Before you know it we'll have someone say "Oh I work for a bank, we have HTML disabled here. Can you make it work without HTML?" give me a break. That wouldn't be using the Web anymore.
- mtberatwork 10y agoOne small quibble, if you are going to take the time to implement progressive enhancement, why serve up incredibly large images?[1] Even sitting on a MBP with a high speed connection, the initial download took some time from across the pond. [1] https://gdstechnology.blog.gov.uk/wp-content/uploads/sites/31/2016/09/28825249152_cd35912c3c_o.jpg https://gdstechnology.blog.gov.uk/wp-content/uploads/sites/3...
- robin_reala 10y agoOops. I’ll see if I can get that fixed.
- dajonker 10y agoIf anything this is a great example of what being agile is about. Start with the bare essentials and slowly add features, without breaking the characteristics that make the website nice to use such as speed and reliability.
- manigandham 10y agoThe giant 1MB image in this post should be fixed, goes against the rest of the principles.