The accessibility statement was last updated on 9
October 2020 but without the 'last reviewed' date
being updated.
The changes were contained in this pull request
which was merged the same day and reached
production at 2.13pm.
https://github.com/alphagov/notifications-admin/pull/3677
The most important part of the broadcast is what content was sent where
(and when).
This commit reduces the priority of the ‘meta’ information, like who
prepared and approved the broadcast. I also think that the ‘end’ time is
a lot less important than the start time, since most people will receive
the alert at or near to the start time.
This then matches the order in which the message is drafted, first the
content, then the areas. It also matches the order we’re going to have
on the new dashboard.
When we converted textboxes on Notify to govuk-frontend design system
style with @tombye , we did not remove the imports.
This work is now done in this commit.
Some things that will still stay in our repo for now:
textbox macro in our components folder and associated css
textboxes which are really textarea fields (🤷 how do they work)
textboxes on the styleguide page
We should revisit this when we convert textarea fields
to govuk-frontend.
The idea was that this would be a place to document all the design
patterns used in Notify. However it hasn’t been kept up to date, and,
looking at the `git blame`[1] no new patterns have been added for 5
years.
I think it’s better to get rid of it than have to keep maintaining
something which is inaccurate.
1. 64aa0d359c/app/templates/views/styleguide.html
Our style for areas is pale blue background with black keylines or bold
black text.
This commit makes the display of area names on the dashboard consistent
with that visual style.
This also means that we’re not truncating the list of areas, which is
appropriate because no one area is more important than any of the
others.
The dashboard for normal services is quite general, because it tells
you a bit about channels, templates and spend.
What is now the dashboard for broadcast services is much more specific,
therefore less like a dashboard. We can reflect this by giving it a more
specific name. This should reduce the amount of navigation surfing
people need to do in order to find the thing they’re looking for.
Previous alerts are much less important than ones that are live or
waiting for approval.
Therefore we can make the dashboard more focused by moving previous
alerts to their own page.
This prefixes everything to do with areas/the map with `area-list`, so
from looking at one element you know which `.scss` file will contain the
relevant code.
We hide the map inside a details element.
Because the map has such a strong shape I don’t think it needs the grey
border to contain it. This commit removes the border, and adjusts the
spacing to group things by proximity alone.
By removing the border and associated gutter we can give more space to
the map, and make the page look less busy.
I’ve never liked the style of the selected areas on the preview of a
broadcast message. They were a compromise, taking what’s on the map page
and giving it a shaded background so it looks less like a text box.
The trouble is all these stroked elements jumbled together made the page
look very busy. I think it can be a bit calmer if they look more like
the ‘tag’ component[1] from the Design System, which only uses shading.
Going for black text not blue, because it’s one less piece of visual
differentiation – again, trying to keep the busyness level down.
1. https://design-system.service.gov.uk/components/tag/
The Digital Accessibility Centre (DAC) reported
that it was confusing that focus was moved to the
templates and folders search textbox when the page
loaded on the templates page.
We noted that this issue wasn't reported on the
page where you enter your SMS 2-factor code.
From this, we determined that pages with a single
task could benefit from focus moving to the part
of the page that lets you do that task.
Because of this we:
- found all the pages we shift focus on when they
load
- kept it for pages where the focus shift is
important for what users do on the page
- removed it for all other pages (including
templates)
The work was completed in:
https://github.com/alphagov/notifications-admin/pull/3622
This work also changed the label of the focused
element as a hack to get the page title read out.
This normally happens on load to indicate a
navigation has happened but didn't in Voiceover
when we focused an element on load.
After testing with JAWS and NVDA we found only
Voiceover does this. As Voiceover has the smallest
market share, and navigation can be inferred by
other mean, we removed it in:
https://github.com/alphagov/notifications-admin/pull/3673
That was deployed today.
We no longer need the `start_tour` page as this has been replaced with
the new `begin_tour` page.
We also no longer need to handle the `help` argument in the
`send_test_step` or `send_one_off_step` as these no longer are
responsible for the tour and don't need to show the help text.
Worth pointing out, the new tour joins into the send one off flow. When
doing a GET `check_tour_notification`, and submitting the form shown on
this page you are POSTed to `send_notification` with `help=3`. Also for
general sending of one off notifications, the POST to
`send_notification` is done with `help=0` which is a bit of a hack to
make sure that we don't show a back link on the `view_notification` page
for when someone gets there having just sent a one off notification.
This use of `help=0` may be a candidate for a refactor in the future as
it feels like a bit of a hacky way of doing things and is therefore not
as clear to developers what is going on.
Also removes the help argument from the csv routes used here. There is
no reason that we need to ever show help for CSVs and this is leftover
code from when we used to do the tour that way.
The existing behaviour focused the form control
for each popup (radios or textbox) when opened.
This gives no indication the submit button or
cancel link have been added to the page.
These changes:
- make the parent element a region to group all
the new content
- label the region to link it to the button that
opened it
- add a description to the region so users know
how to use it and that all the controls have
been added to the page
During the move to GOV.UK Frontend checkboxes our template list has
started to be wrapped in a `<div>` with the `govuk-form-group` class.
This adds extra spacing, like you’d want in a regular transaction
service which might have multiple sets of form controls on a single
page.
It isn’t appropriate on our templates page, because there should be a
consistent rhythm where the space between each checkboxes is the same as
the space between the search box and the first checkbox, to the last
checkbox and the buttons. Not having this space is also consistent with
other pages with sticky grey buttons, eg the team members page.
This commit also fixes a typo in the name of one of the classes used to
control spacing between the checkboxes and search bar.
We’ve had some feedback that relying only on luminosity and position to
differentiate between the ‘will get alert’ and ‘likely to get alert’
areas on the map might not be enough.
We don’t want to introduce another colour because:
- it will make the map look very busy
- not many other colours contrast with the map tiles as well as blue
- relying on colour only to communicate information is also bad for
accessibility
Instead we can make one of the lines a different style. I’ve gone for
dashed on the ‘likely’ line because it looks nice, and gives some
suggestion of a porous boundary.
Implementing this means using CSS border image, because a `dashed`
border (which we still have as a fallback) doesn’t render with
consistent dash sizes from browser to browser. We need consistency to
match the dashes that the map will be drawing (which use SVG not CSS
so don’t have the same problem).
We’ve had some feedback from user research that difference between
‘will get alert’ and ‘likely to get alert’ is not clear, and it’s hard
to tell if the latter is inclusive of the former. This leads people to
question the validity of these numbers, which is important, because an
the estimate should give you some idea of the impact of what you’re
about to do.
This commit reformats the number as a range, for example 1,000 to 2,000
phones.
If the range is small, eg 40,000,000 to 40,800,000 then this suggests
a false level of accuracy. So instead we just give one number and say
it’s an estimate, eg ‘40,000,000 phones estimated’
Accessibility audit uncovered issues screen-reader users would
have with autofocus on Notify pages. Autofocus can lead to
confusion for those types of users and make them miss parts
of the page.
Hence, we decided that autofocus will be turned off by default
for live-search component.
We decided to keep the autofocus on for live-search text box when:
1. the page is a task page - as opposed to browsing pages, where
user wonders freely, task pages have more established flow, so
page focusing on textbox can actually be helpful.
2. page does not have actionable elements above the autofocus.
Accessibility audit uncovered issues screen-reader users would
have with autofocus on Notify pages. Autofocus can lead to
confusion for those types of users and make them miss parts
of the page.
Hence, we decided that autofocus will be turned off by default
for live-search component.
We decided to keep the autofocus on for live-search text box when:
1. the page is a task page - as opposed to browsing pages, where
user wonders freely, task pages have more established flow, so
page focusing on textbox can actually be helpful.
2. page does not have actionable elements above the autofocus.
