diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md new file mode 100644 index 0000000..7db26a2 --- /dev/null +++ b/.github/CONTRIBUTING.md @@ -0,0 +1,116 @@ +# Contributing to the Apply the Service Standard in DfE manual + +We want your input! We want to make contributing to this manual as easy and transparent as possible, whether it's: + +- Reporting a bug or issue +- Discussing the current state of the code +- Submitting a fix +- Proposing new content +- Becoming a maintainer + +## We Develop with Github + +We use github to host code, to track issues and feature requests, as well as accept pull requests. + +## We Use [Github Flow](https://guides.github.com/introduction/flow/index.html), So All Code Changes Happen Through Pull Requests + +Pull requests are the best way to propose changes to the code (we use [Github Flow](https://guides.github.com/introduction/flow/index.html)). We actively welcome your pull requests: + +Clone or Fork the repo (Fork it if you don't have write access) + +Before you do anything, create a new branch for your changes - Run: + +``` +git branch name-of-your-branch +``` + +for example: + +``` +git branch accessibility-content +``` + +Checkout the branch - Run: + +``` +git checkout name-of-your-branch +``` + +for example: + +``` +git checkout accessibility-content +``` + +Make your suggested changes + +Check your code and validate all links, test it properly + +When ready to commit stage the changes and add a useful comment for the commit - Run: + +``` +git add . +git commit -m "Comments for the change" +``` + +Switch back to the main branch - Run: + +``` +git checkout main +``` + +Push the change up to GitHub into your new branch named in step 3 - Run: + +``` +git push origin name-of-your-branch +``` + +for example: + +``` +git push origin accessibility-content +``` + +You should see something like: + +``` +remote: Create a pull request for 'my-improvements' on GitHub by visiting: +remote: https://github.com/your_username/project_name_here/pull/new/my-improvements +``` + +Copy or click the URL and complete the pull request for the change on GitHub. + +Save the pull request on GitHub and we will review it and accept and merge or reject the change. + +!! Do not make changes in the gh_pages branch + +## Any contributions you make will be under the MIT Software License + +In short, when you submit code changes, your submissions are understood to be under the same [MIT License](http://choosealicense.com/licenses/mit/) that covers the project. + +## Report bugs using [issues](https://github.com/DFE-Digital/apply-service-standard-in-dfe/issues) + +We use GitHub issues to track public bugs. Report a bug by [opening a new issue](https://github.com/DFE-Digital/apply-service-standard-in-dfe/issues/new/choose); it's that easy! + +## Write bug reports with detail + +When raising an issue, you'll be prompted to complete the following details. + +1. Expected behaviour +2. Current behaviour +3. Possible solution +4. Reproduction steps +5. Context +6. Detailed description +7. Possible implementation + +## Use a Consistent Coding Style + +All content is written using MarkDown and HTML. Ensure all your code is semantically correct and is valid HTML. You must: + +- Use a [HTML validator](https://validator.w3.org/#validate_by_input) to check it. +- Preview your MarkDown content. + + +## License +By contributing, you agree that your contributions will be licensed under its MIT License. diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md new file mode 100644 index 0000000..21651a4 --- /dev/null +++ b/.github/ISSUE_TEMPLATE.md @@ -0,0 +1,30 @@ + + +## Expected Behavior + + +## Current Behavior + + +## Possible Solution + + +## Steps to Reproduce + + +1. +2. +3. +4. + +## Context (Environment) + + + + + +## Detailed Description + + +## Possible Implementation + \ No newline at end of file diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 0000000..13e5cbf --- /dev/null +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1,16 @@ + + +## What’s changed + + + + +## Identifying a user need + + \ No newline at end of file diff --git a/.ruby-version b/.ruby-version new file mode 100644 index 0000000..fbafd6b --- /dev/null +++ b/.ruby-version @@ -0,0 +1 @@ +2.7.2 \ No newline at end of file diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..c8c88e1 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2022 Crown Copyright (Department for Education) + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. \ No newline at end of file diff --git a/config.rb b/config.rb index c78dab8..cfd835a 100644 --- a/config.rb +++ b/config.rb @@ -4,11 +4,13 @@ require "lib/do_dont" require "lib/banner_panel_extension" require "lib/example_panel_extension" +require "lib/basic_panel_extension" activate :external_link activate :signpost_link activate :do_dont_list activate :banner_panel activate :example_panel +activate :basic_panel GovukTechDocs.configure(self) diff --git a/lib/basic_panel_extension.rb b/lib/basic_panel_extension.rb new file mode 100644 index 0000000..9f0b5ed --- /dev/null +++ b/lib/basic_panel_extension.rb @@ -0,0 +1,18 @@ +class BasicPanel < Middleman::Extension + def initialize(app, options_hash={}, &block) + super + end + + helpers do + def basic_panel(content) + <<~EOS +
+

#{content}

+
+ EOS + + end + end + end + + ::Middleman::Extensions.register(:basic_panel, BasicPanel) diff --git a/source/accessibility/accessibility-audit.html.md.erb b/source/accessibility/accessibility-audit.html.md.erb index 7262b79..0d08cee 100644 --- a/source/accessibility/accessibility-audit.html.md.erb +++ b/source/accessibility/accessibility-audit.html.md.erb @@ -1,28 +1,59 @@ --- -title: Accessibility audit +title: Accessibility audit and testing weight: 260 --- -# Accessibility audit +# Accessibility audit and testing +Service teams must arrange for an accessibility audit to be carried out before they move to public beta. This is to ensure the service is compliant with the accessibility regulations. This audit should be repeated every 12 months or if there are significant changes to a service. -THIS PAGE NEEDS WORK +You should include budget for accessibility testing as part of your business case. External audits can cost a minimum of £4,000 to carry out. ## Internal audit -Some teams will have testers and team members that are qualified to run WCAG 2.1 audits. If this is not your cae, there are two other routes. -If your service is listed on CMDB (configuration Management Database), you can request an internal accessibility assurance review by submitting a form to the [Accessibility Support team](https://educationgovuk.sharepoint.com/sites/lvewp00043/SitePages/Accessibility-Assurance-Reports.aspx). - -Otherwise, you will need to procure an external service provider. +Some teams will have testers and team members that can test and audit services to WCAG 2.1 AA standard. + +There are several tools available to carry out accessibility testing. + + + + + + + + + + + + + + + +
Tools for testing
ToolWhat it lets you do
Accessibility Insights for webBrowser extension for Edge and Chrome. +
    +
  • Fast-pass automated tests
    • +
  • Tools for colour contrast, landmarks, tab-stops and headings
    • +
  • Full WCAG guided audits which can be saved for evidence
    • +
+
+ +If you don't have people in your team who can do this, there are other options. + +If your service is currently being service managed within Digital Data and Technology (DDaT) and it appears on the internal Configuration Management Database (CMDB), then the Business Engagement and Accessibility Team can undertake an assurance audit for you. If you are unsure, contact the accessibility support team. + +Otherwise, you will need to find an external supplier to carry out an audit. ## External audit -An external audit will be more comprehensive and include users with accessibility needs. It will also take longer to complete as you will need to allow for the time for procurement plus agencies rarely will have immediate availability. Allow 3 months for the process. +An external audit will be more comprehensive and include users with accessibility needs. It will also take longer to complete as you will need to allow for the time for procurement plus agencies rarely will have immediate availability. Allow 1-3 months for the audit to be arranged and carried out. + +Contact the [Digital and Technologies Contracts](Dandt.CONTRACTS@education.gov.uk) team. They might have an existing contract in place that can be used for an audit or they can help you to procure a supplier through the Digital Marketplace. -Contact the [Digital and Technologies Contracts team](Dandt.CONTRACTS@education.gov.uk). They might have a DOS contract that can accommodate it or they can help you to procure via the Digital Marketplace. +### Suppliers for external accessibility audits -[Example of proposal for accessibility audit by DAC](https://docs.google.com/presentation/d/1mirPcD9cY32yjH5oJnc8gJ1TnxcyvL8Q/edit?usp=sharing&ouid=107261629163696600713&rtpof=true&sd=true ) +Popular suppliers for accessibility audits include: -[Example of proposal for accessibility audit by Nexer](https://drive.google.com/file/d/1q6w0L2hWqn7HyXKgNcBMxtKToXoz2vVM/view?usp=sharing) +- Digital Accessibility Centre (DAC) +- Nexer -[Example of accessibility audit requirements](https://docs.google.com/document/d/179PLBL80bWS0L85vTwoOuKfz7gG8bxCgFzlwghbqBK0/edit?usp=sharing) \ No newline at end of file +<%= example_panel("Additional guidance","You can find more guidance on getting an external accessibility audit on GOV.UK")%> diff --git a/source/accessibility/index.html.md.erb b/source/accessibility/index.html.md.erb index 611a510..cacf367 100644 --- a/source/accessibility/index.html.md.erb +++ b/source/accessibility/index.html.md.erb @@ -5,7 +5,7 @@ weight: 200 # Accessibility - +<%= banner_panel("You'll be assessed on this","You'll be asked to demonstrate how you meet accessibility requirements at service assessments") %> This guidance will help [anyone delivering services](/accessibility/roles.html) in DfE understand our obligations and requirements to design and build accessible services and meet required [laws and standards](/accessibility/laws-and-standards.html) diff --git a/source/accessibility/laws-and-standards.html.md.erb b/source/accessibility/laws-and-standards.html.md.erb index 65f93bf..e418563 100644 --- a/source/accessibility/laws-and-standards.html.md.erb +++ b/source/accessibility/laws-and-standards.html.md.erb @@ -5,20 +5,14 @@ weight: 205 # Laws and standards +<%= warning_text("You'll be breaking the law if the website or service you provide is not accessible.")%> + The following laws and standards apply regardless of who the users of the service are, this includes: - members of the public - teachers and pupils - DfE or other agency staff -<%= warning_text('You will be breaking the law if you provide a service that is not accessible.') %> - -<%= banner_panel("You'll be assessed on this","this is a link")%> - -<%= example_panel("Tools and resources","this is a link")%> - -<%= do_dont_list(["list item", "list's"], "Don't do this", "dont") %> - Accessibility requirements are enforced through different legislation and standards, specifically: - Equality Act 2010 (opens in new tab) @@ -43,14 +37,9 @@ Your service must: Ensure you meet these by following the Service Standard, specifically: -
-
-
-

2. Solve a whole problem for users

-

Ensuring accessibility is considered throughout the service delivery.

-
-
-
+<%= basic_panel("

2. Solve a whole problem for users

+

Ensuring accessibility is considered throughout the service delivery.

") %> +
diff --git a/source/accessibility/resources.html.md.erb b/source/accessibility/resources.html.md.erb index 750833b..0530b23 100644 --- a/source/accessibility/resources.html.md.erb +++ b/source/accessibility/resources.html.md.erb @@ -6,8 +6,42 @@ weight: 250 # Resources and tools -THIS PAGE NEEDS WORK - +Tools for testing for accessibility issues + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Tools for testing
ToolWhat it lets you do
Accessibility Insights for webBrowser extension for Edge and Chrome to perform quick checks and also carry out detailed, guided audits of websites.
WAVE
Pa11y
Accessibility Insights for webBrowser extension for Edge and Chrome to perform quick checks and also carry out detailed, guided audits of websites.
Accessibility Insights for webBrowser extension for Edge and Chrome to perform quick checks and also carry out detailed, guided audits of websites.
diff --git a/source/accessibility/training.html.md.erb b/source/accessibility/training.html.md.erb new file mode 100644 index 0000000..cc3d268 --- /dev/null +++ b/source/accessibility/training.html.md.erb @@ -0,0 +1,8 @@ +--- +title: Training +weight: 255 +--- + +# Training + + diff --git a/source/service-standard/index.html.md.erb b/source/service-standard/index.html.md.erb index 8461524..ecc11db 100644 --- a/source/service-standard/index.html.md.erb +++ b/source/service-standard/index.html.md.erb @@ -9,28 +9,7 @@ weight: 100 This guidance helps teams understand how to apply the [Service Standard](https://www.gov.uk/service-manual) in DfE. -Following the Service Standard ensures you design and build accessible, usable and understandable services for people using DfE services. +<%= basic_panel("

1. Understand users and their needs

") %> -This service will enable you to: +<%= basic_panel("

2. Solve a whole problem for users

") %> -- address the different needs of people using DfE services -- navigate the complexities of delivering digital services in the education sector -- meet the Service Standard - - - -
-
-
-

1. Understand users and their needs

-
-
-
- -
-
-
-

2. Solve a whole problem for users

-
-
-
diff --git a/source/stylesheets/screen.css.scss b/source/stylesheets/screen.css.scss index 2a8e2e2..d1b39dd 100644 --- a/source/stylesheets/screen.css.scss +++ b/source/stylesheets/screen.css.scss @@ -10,7 +10,7 @@ h5, h6, a, span, -div { +div, table, th, td, tr { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", @@ -93,7 +93,6 @@ footer { border: 1px solid #b1b4b6; background: #fafaf9; padding: 40px; - border-radius: 5px; } .DosAndDontsstyled__SectionStyled { @@ -111,7 +110,6 @@ footer { .DosAndDontsstyled__DosAndDontsColoredBoxStyled { flex-direction: column; padding: 40px; - border-radius: 5px; position: relative; box-sizing: border-box; -webkit-box-align: center; @@ -169,7 +167,6 @@ footer { .DosAndDontsstyled__DosAndDontsContainerStyled { .govuk-tag { padding-bottom: 8px; - border-radius: 5px; text-transform: capitalize; } } @@ -291,12 +288,10 @@ footer { } .dfe-panel { - margin-bottom: 15px !important; - margin-top: 40px !important; + margin-top: 30px !important; border: 1px solid #b1b4b6; background: #fafaf9; padding: 5px 25px; - border-radius: 5px; p { margin-bottom: 10px; @@ -581,15 +576,15 @@ footer { } -ol > li, ul > li, .dfeuk-list > li { +.dfeuk-list > li { margin-bottom: 8px; } @media (min-width: 40.0625em) { - ol > li, ul > li, .dfeuk-list > li { + .dfeuk-list > li { margin-bottom: 8px; } } - ol > li:last-child, ul > li:last-child, .dfeuk-list > li:last-child { + .dfeuk-list > li:last-child { margin-bottom: 0; } @@ -812,8 +807,7 @@ ol > li, ul > li, .dfeuk-list > li { #EXAMPLE-CALLOUT ========================================================================== */ .dfeuk-example-callout { - margin-bottom: 24px; - margin-top: 8px; + margin: 30px 0px; padding-bottom: 24px; padding-left: 24px; padding-right: 24px; @@ -829,12 +823,12 @@ ol > li, ul > li, .dfeuk-list > li { } @media (min-width: 40.0625em) { .dfeuk-example-callout { - margin-bottom: 32px; + margin-bottom: 40px; } } @media (min-width: 40.0625em) { .dfeuk-example-callout { - margin-top: 16px; + margin-top: 40px; } } @media (min-width: 40.0625em) { @@ -854,7 +848,7 @@ ol > li, ul > li, .dfeuk-list > li { } @media (min-width: 40.0625em) { .dfeuk-example-callout { - padding-top: 48px; + padding-top: 38px; } } @@ -870,15 +864,7 @@ ol > li, ul > li, .dfeuk-list > li { .dfeuk-example-callout--white { background: #ffffff; } - - .dfeuk-example-callout--image { - margin-bottom: 16px; - } - @media (min-width: 40.0625em) { - .dfeuk-example-callout--image { - margin-bottom: 24px; - } - } + .dfeuk-example-callout--image + h3 { padding-top: 16px; } @@ -886,4 +872,24 @@ ol > li, ul > li, .dfeuk-list > li { .dfeuk-example-callout--image + h3 { padding-top: 24px; } - } \ No newline at end of file + } + + .govuk-table__caption{text-align: left; font-weight: 700;} + + + .technical-documentation th, .technical-documentation td { + padding: 10px 20px 10px 0; + background-color: transparent; + border-bottom: 1px solid #b1b4b6; + border-width: 0 0 1px 0; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-weight: 400; + line-height: 1.1428571429; + vertical-align: top; + text-align: left; + font-size: 1.1875rem; + line-height: 1.3157894737; +} + +.technical-documentation th.govuk-table__header{font-weight: 600;} \ No newline at end of file