darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-19 05:59:44 -04:00
Code Issues Packages Projects Releases Wiki Activity
Files
f342e0fb6cbfffd87049b0ee494801f1fa8a694b
notifications-admin/app/templates/views/signedout.html

285 lines
11 KiB
HTML
Raw Normal View History

Make a full width base template We need this because the top section of the new product page will be going full-bleed.
2016-11-22 17:15:31 +00:00
{% extends "fullwidth_template.html" %}
move vendored uk components to templates
2022-12-14 11:50:51 -05:00
{% from "components/uk_components/button/macro.njk" import govukButton %}
Create base forms for registration and sign in Created routes and forms for registration, sign in, and registration from an invite. Also tidied up assets folder, removed copy of fronted toolkit.
2015-11-25 16:21:28 +00:00
Add meta description tag to homepage Google tries to auto-generate a snippet of a site’s content to show in search results. Currently it’s not doing a great job of this for Notify. There’s a chance that if we give it better content in the site’s meta description then it will use that instead. Worth a go… The content is adapted from the blue box on the product page. It’s 145 characters, which is within the 160 characters recommended[1] It matches the content in the page, and contains words that users are likely to be searching for (GOV.UK Notify, emails, text messages). It’s only on the homepage, because it shouldn’t be duplicated across multiple pages. https://yoast.com/meta-descriptions/
2017-11-14 17:25:32 +00:00
{% block meta %}
Addressing most of the low-lift items from the Notify content audit (#491)
2023-05-08 10:49:30 -04:00
<meta name="description" content="U.S. Notify lets you send text messages to your users. Try it now if you work in federal, state, or local government.">
Add meta description tag to homepage Google tries to auto-generate a snippet of a site’s content to show in search results. Currently it’s not doing a great job of this for Notify. There’s a chance that if we give it better content in the site’s meta description then it will use that instead. Worth a go… The content is adapted from the blue box on the product page. It’s 145 characters, which is within the 160 characters recommended[1] It matches the content in the page, and contains words that users are likely to be searching for (GOV.UK Notify, emails, text messages). It’s only on the homepage, because it shouldn’t be duplicated across multiple pages. https://yoast.com/meta-descriptions/
2017-11-14 17:25:32 +00:00
{% endblock %}
Update page title block name on signed out page Now matches the block from the GOVUKFrontend template. This is the only page not suffixed by "GOV.UK Notify" so has it's specific content for this block.
2019-10-11 16:21:05 +01:00
{% block pageTitle %}
us → u.s.
2022-12-06 11:03:47 -05:00
U.S. Notify
Create base forms for registration and sign in Created routes and forms for registration, sign in, and registration from an invite. Also tidied up assets folder, removed copy of fronted toolkit.
2015-11-25 16:21:28 +00:00
{% endblock %}
Update content area blocks in descendent pages GOV.UK Frontend's template wraps all content in a `<main>` tag and puts it in the main column. Some of Notify's pages need to reach out of the main column (product page). Some have several blocks of navigation before the main content area. This adjusts the blocks in all the templates where this is the case so those conditions can be met.
2019-10-11 16:44:17 +01:00
{% block content %}
Create base forms for registration and sign in Created routes and forms for registration, sign in, and registration from an invite. Also tidied up assets folder, removed copy of fronted toolkit.
2015-11-25 16:21:28 +00:00
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<section aria-label="Introduction">
<div class="grid-container usa-section usa-section--dark padding-top-4 padding-bottom-5">
<div class="grid-row grid-gap display-flex flex-align-center">
<div class="tablet:grid-col-7">
<h1 class="font-serif-2xl usa-hero__heading">Send text messages to your users</h1>
<p class="font-sans-lg margin-bottom-5">Try U.S. Notify now if you work in federal, state, or local government.</p>
<div class="usa-button-group">
<a class="usa-button usa-button--big" href="{{ url_for('main.register' )}}">Create an account</a>
or <a class="usa__link margin-x-1" href="{{ url_for('.sign_in' )}}">sign in</a> if you’ve used
it before
</div>
</div>
<div class="tablet:grid-col-4 grid-offset-1">
<img src="{{ asset_url('images/product/proposition-illustration.png') }}"
alt="An illustration of notifications to a phone, a laptop, and a letter.">
</div>
</div>
</div>
</section>
<section class="grid-container usa-section">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-5 usa-prose">
<h2 class="font-heading-xl margin-top-0 margin-bottom-3">
Control your content
</h2>
<p>You do not need any technical knowledge to create message templates.</p>
</div>
<div class="tablet:grid-col-6 grid-offset-1">
<img src="{{ asset_url('images/product/01-templates-no-chrome.svg') }}"
alt="Example screenshot of adding a new text message template">
</div>
</div>
</section>
<section class="grid-container usa-section">
<div class="grid-row grid-gap">
<div class="tablet:grid-col-5 usa-prose">
<h2 class="font-heading-xl margin-top-0 margin-bottom-3">
See how your messages perform
</h2>
<p>Track how many messages you’ve sent and find out which ones are not being delivered.</p>
</div>
<div class="tablet:grid-col-6 grid-offset-1">
<img src="{{ asset_url('images/product/02-reporting-no-chrome.svg') }}"
alt="A screenshot of U.S. Notify showing counts of emails and text messages sent">
</div>
</div>
</section>
<section class="grid-container usa-section border-top border-base-lighter">
<div class="grid-row grid-gap">
<h2 class="font-heading-xl margin-top-0 margin-bottom-3 bold">
Send messages manually or automatically
</h2>
</div>
<div class="grid-row grid-gap">
<div class="tablet:grid-col-6 usa-prose">
<p>Upload a spreadsheet of phone numbers and Notify sends the messages.</p>
<img src="{{ asset_url('images/product/03-spreadsheet-no-chrome.svg') }}"
alt="A screenshot of a spreadsheet with columns for email address, name and color">
</div>
<div class="tablet:grid-col-6 usa-prose">
<p>
Integrate the U.S. Notify API with your web&nbsp;application or
back office system.
</p>
<img src="{{ asset_url('images/product/04-api-no-chrome.svg') }}"
alt="A screenshot of some computer code with a notify.send_email function">
</div>
</div>
</section>
<section id="whos-using-notify" class="grid-container usa-section border-top border-base-lighter padding-top-4 padding-bottom-5">
<div class="grid-row grid-gap flex-column">
<h2 class="font-heading-xl display-flex flex-justify-center margin-top-0 bold">
Who’s using U.S. Notify
</h2>
<p class="display-flex flex-justify-center font-body-sm margin-bottom-3">
See the
<a class="usa-link margin-left-05" href="{{ url_for('main.performance') }}">list of services and
organizations</a>.
</p>
</div>
<div class="grid-row">
<div class="tablet:grid-col-6 display-flex flex-justify-center flex-align-center flex-column">
<span class="usa-sr-only">There are</span>
<div class="large-number">{{ counts.organisations|format_thousands }}</div>
<p class="font-body-lg">Organizations</p>
</div>
<div class="tablet:grid-col-6 display-flex flex-justify-center flex-align-center flex-column">
<span class="usa-sr-only">and</span>
<div class="large-number">{{ counts.services|format_thousands }}</div>
<p class="font-body-lg">Services</p>
<span class="usa-sr-only">using Notify.</span>
</div>
</div>
</section>
<section class="grid-container usa-section border-top border-base-lighter usa-prose">
<h2 class="font-heading-xl margin-top-0 margin-bottom-3">
The team
</h2>
<p class="usa-body">
U.S. Notify is built and maintained by the Public Benefits Studio, within the General Services Administration's
Technology Transformation Services.
</p>
<p class="usa-body">
<a class="usa-link" href="{{ url_for('main.support') }}">Contact us</a> if you have a
question or want
to give feedback.
</p>
</section>
<!-- <div class="product-page-intro"></div> -->
<!-- <div class="product-page-intro-wrapper" data-module="homepage">
Add a breadcrumb to the product page This copies what the other GaaP components will be doing for their product pages. The SASS and HTML is taken from here: https://github.com/alphagov/product-page-example/blob/f05ca1fb71f16728bb7a52462b11a850420f36f0/source/stylesheets/modules/_breadcrumbs.scss Only changes I’ve made are: - making the file paths work with our build pipeline Changes to our code to accomodate this are: - putting the padding on the product page `<h1>` not its container - moving the hero image accordingly so that it lines up - making the `<main>` element on the product page into an anchor so that the breadcrumb can link to it – screenreader will then announce the link as “GOV.UK Notify, same page”
2017-01-19 14:52:54 +00:00
<nav class="breadcrumbs breadcrumbs--inverse" aria-label="Breadcrumbs">
remove some extra visual stuff
2022-12-15 10:00:54 -05:00
Add a breadcrumb to the product page This copies what the other GaaP components will be doing for their product pages. The SASS and HTML is taken from here: https://github.com/alphagov/product-page-example/blob/f05ca1fb71f16728bb7a52462b11a850420f36f0/source/stylesheets/modules/_breadcrumbs.scss Only changes I’ve made are: - making the file paths work with our build pipeline Changes to our code to accomodate this are: - putting the padding on the product page `<h1>` not its container - moving the hero image accordingly so that it lines up - making the `<main>` element on the product page into an anchor so that the breadcrumb can link to it – screenreader will then announce the link as “GOV.UK Notify, same page”
2017-01-19 14:52:54 +00:00
</nav>
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row">
Replace `column-two-thirds` with `govuk-grid-column-two-thirds`
2020-02-19 12:36:02 +00:00
<div class="govuk-grid-column-two-thirds">
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
<h1>
Addressing most of the low-lift items from the Notify content audit (#491)
2023-05-08 10:49:30 -04:00
Send text messages to your users
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
</h1>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
Addressing most of the low-lift items from the Notify content audit (#491)
2023-05-08 10:49:30 -04:00
Try U.S. Notify now if you work in federal, state, or local government.
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
</p>
<div class="button-container">
Update start button on signed out homepage
2020-02-06 13:36:17 +00:00
{{ govukButton({
"element": "a",
"text": "Create an account",
"classes": "product-page-button button-container__button govuk-!-margin-right-3",
"href": url_for('main.register' )
}) }}
Update all links to use GOVUK Frontend style Includes: - turning off :visited styles to match existing design - swapping heading classes used to make links bold for the GOVUK Frontend bold override class - adding visually hidden text to some links to make them work when isolated from their context We may need to revisit whether some links, such as those for documentation and features, may benefit from having some indication that their target has been visited.
2019-12-06 07:53:46 +00:00
or <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.sign_in' )}}">sign in</a> if you’ve used
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
it before
</div>
</div>
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
<div class="govuk-grid-column-one-third">
<img
src="{{ asset_url('images/product/proposition-illustration.png') }}"
alt="An illustration of notifications to a phone, a laptop, and a letter.">
</div>
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
</div>
</div>
</div>
<div class="product-page-section">
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row">
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
<h2>
Reword and embiggen the headings Also reword some of the `<p>`s so that they flow better from the headings. This was a bit me, and a bit sitting down and hammering this stuff out with Stephen and Sheryll.
2016-11-30 13:52:12 +00:00
Control your content
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</h2>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
You do not need any technical knowledge to create message templates.
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</p>
</div>
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
<img
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
src="{{ asset_url('images/product/01-templates.svg') }}"
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
alt="Example screenshot of adding a new text message template">
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</div>
</div>
Make the blue header on the home page full-width This copies the style that Tim and Stephen have been developing for all product pages. It also pulls out the CSS for this into its own file, so that it could potentially be reused.
2016-11-22 17:53:09 +00:00
</div>
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
<div class="product-page-section">
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row">
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Reword and embiggen the headings Also reword some of the `<p>`s so that they flow better from the headings. This was a bit me, and a bit sitting down and hammering this stuff out with Stephen and Sheryll.
2016-11-30 13:52:12 +00:00
<h2>
See how your messages perform
</h2>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
Reword and embiggen the headings Also reword some of the `<p>`s so that they flow better from the headings. This was a bit me, and a bit sitting down and hammering this stuff out with Stephen and Sheryll.
2016-11-30 13:52:12 +00:00
Track how many messages you’ve sent and
Replace aren't with are not
2019-09-13 12:45:12 +01:00
find out which ones are not being delivered.
Reword and embiggen the headings Also reword some of the `<p>`s so that they flow better from the headings. This was a bit me, and a bit sitting down and hammering this stuff out with Stephen and Sheryll.
2016-11-30 13:52:12 +00:00
</p>
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</div>
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
<img
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
src="{{ asset_url('images/product/02-reporting.svg') }}"
us → u.s.
2022-12-06 11:03:47 -05:00
alt="A screenshot of U.S. Notify showing counts of emails and text messages sent"
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
>
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</div>
</div>
</div>
Add a ‘team’ section This addresses part of the ‘is Notify dependable’ group of needs. The ones it specifically and partially addresses are: - is it reliable - how is it supported There’s more to come in this section, we’re doing this bit now because it’s a nice conclusion to the page.
2016-11-28 15:39:44 +00:00
<div class="product-page-section">
Reword and embiggen the headings Also reword some of the `<p>`s so that they flow better from the headings. This was a bit me, and a bit sitting down and hammering this stuff out with Stephen and Sheryll.
2016-11-30 13:52:12 +00:00
<h2 class="with-keyline">
Send messages manually or automatically
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</h2>
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row">
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
Addressing most of the low-lift items from the Notify content audit (#491)
2023-05-08 10:49:30 -04:00
Upload a spreadsheet of phone&nbsp;numbers and Notify sends the messages.
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</p>
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
<img
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
src="{{ asset_url('images/product/03-spreadsheet.svg') }}"
Updating for US English Words found: personalis* customis* organis* colour behaviour
2022-12-20 09:44:33 -05:00
alt="A screenshot of a spreadsheet with columns for email address, name and color"
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
>
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</div>
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
us → u.s.
2022-12-06 11:03:47 -05:00
Integrate the U.S. Notify API with your web&nbsp;application or
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
back office system.
</p>
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
<img
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
src="{{ asset_url('images/product/04-api.svg') }}"
Add alt text for the images on the product page The images are telling you stuff that is extra to the text on the page so they should be explained for users who can’t see them.
2016-12-07 17:00:53 +00:00
alt="A screenshot of some computer code with a notify.send_email function"
>
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
</div>
</div>
</div>
Add number of services to product page One of the user needs that we identified is not wanting to be the first to use it. It feels like a much less risky choice if there are already other people in government using it. The easiest way to communicate this is with counts of how many services. The count of departments is good because it shows breadth, where the count of services shows depth. Hard coded for now because we have no automatic way of splitting our test services from real live services.
2016-12-19 12:12:55 +00:00
<div class="product-page-section">
Automate counting of live services and orgs Returns the data calculated by the API. Stored in Redis against a hardcoded key so that no-one hammering the home page is directly hitting the database.
2019-04-10 17:20:51 +01:00
<div class="with-keyline bottom-gutter-2" id="whos-using-notify">
us → u.s.
2022-12-06 11:03:47 -05:00
<h2>Who’s using U.S. Notify</h2>
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row bottom-gutter">
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Remove redundant hidden H3s This commit replaces the H3s which only repeated information with some hidden text that will make it read nicer for screenreaders.
2021-03-12 17:12:47 +00:00
<span class="govuk-visually-hidden">There are</span>
Count of orgs and live services for platform admin This makes it consistent that an option which contains more options has a hint about how many options it contains. Also adds a formatter to get us ready for 1,000 services 🎉
2019-07-08 12:00:40 +01:00
<div class="product-page-big-number">{{ counts.organisations|format_thousands }}</div>
More copy tweaking to remove UK spellings
2022-11-04 12:35:40 -04:00
<span>organizations</span>
Add number of services to product page One of the user needs that we identified is not wanting to be the first to use it. It feels like a much less risky choice if there are already other people in government using it. The easiest way to communicate this is with counts of how many services. The count of departments is good because it shows breadth, where the count of services shows depth. Hard coded for now because we have no automatic way of splitting our test services from real live services.
2016-12-19 12:12:55 +00:00
</div>
Switch org and service order on home page This matches what’s on the performance page – orgs on the left, services on the right.
2021-03-11 13:30:38 +00:00
<div class="govuk-grid-column-one-half">
Remove redundant hidden H3s This commit replaces the H3s which only repeated information with some hidden text that will make it read nicer for screenreaders.
2021-03-12 17:12:47 +00:00
<span class="govuk-visually-hidden">and</span>
Switch org and service order on home page This matches what’s on the performance page – orgs on the left, services on the right.
2021-03-11 13:30:38 +00:00
<div class="product-page-big-number">{{ counts.services|format_thousands }}</div>
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
<span>services</span>
Remove redundant hidden H3s This commit replaces the H3s which only repeated information with some hidden text that will make it read nicer for screenreaders.
2021-03-12 17:12:47 +00:00
<span class="govuk-visually-hidden">using Notify.</span>
Switch org and service order on home page This matches what’s on the performance page – orgs on the left, services on the right.
2021-03-11 13:30:38 +00:00
</div>
Add number of services to product page One of the user needs that we identified is not wanting to be the first to use it. It feels like a much less risky choice if there are already other people in government using it. The easiest way to communicate this is with counts of how many services. The count of departments is good because it shows breadth, where the count of services shows depth. Hard coded for now because we have no automatic way of splitting our test services from real live services.
2016-12-19 12:12:55 +00:00
</div>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
Make it a single plain text link
2017-03-24 13:36:13 +00:00
See the
More copy tweaking to remove UK spellings
2022-11-04 12:35:40 -04:00
<a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.performance') }}">list of services and organizations</a>.
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
</p>
Add number of services to product page One of the user needs that we identified is not wanting to be the first to use it. It feels like a much less risky choice if there are already other people in government using it. The easiest way to communicate this is with counts of how many services. The count of departments is good because it shows breadth, where the count of services shows depth. Hard coded for now because we have no automatic way of splitting our test services from real live services.
2016-12-19 12:12:55 +00:00
</div>
</div>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<div class="product-page-section">
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
<div class="with-keyline bottom-gutter-2">
<h2>Pricing</h2>
Replace `grid-row` with `govuk-grid-row` Replaced all instances of `grid-row` in the HTML and JavaScript with `govuk-grid-row`, which is the new GOV.UK Frontend class.
2020-02-19 11:57:15 +00:00
<div class="govuk-grid-row bottom-gutter">
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Replace all visually-hidden classes These have been replaced: https://design-system.service.gov.uk/get-started/updating-your-code/#helper-class-names
2019-10-21 15:18:25 +01:00
<h3 class="govuk-visually-hidden">Emails</h3>
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
<div class="product-page-big-number">Unlimited</div>
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
<span>free emails</span>
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
</div>
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Replace all visually-hidden classes These have been replaced: https://design-system.service.gov.uk/get-started/updating-your-code/#helper-class-names
2019-10-21 15:18:25 +01:00
<h3 class="govuk-visually-hidden">Text messages</h3>
Update text message allowance and cost
2022-04-01 09:14:24 +01:00
<div class="product-page-big-number">Up to 40,000</div>
Updates to get pa11y passing
2022-08-31 08:47:18 -04:00
<span>free text messages a year,<br>
then {{ sms_rate }} pence per message</span>
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
</div>
Replace `column-half` with `govuk-grid-column-one-half`
2020-02-19 14:37:28 +00:00
<div class="govuk-grid-column-one-half">
Update product page to talk about letters Letters is now a mature enough feature that we should: - be raising awareness amongst our users that it’s a thing we offer - not have letters be a surprise to anyone creating a Notify account for the first time Shouldn’t be merged until: - [ ] https://github.com/alphagov/notifications-api/pull/1600
2018-01-18 16:38:15 +00:00
<p class="align-with-big-number-hint">
There’s no monthly charge, no setup fee and no&nbsp;procurement process.
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
</p>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>Find out more about <a class="govuk-link govuk-link--no-visited-state" href="https://www.notifications.service.gov.uk/pricing">pricing</a>.
Updated free text message allowance Updated free text message allowance to make it clearer. Added a link to full pricing information. Ticket: https://www.pivotaltracker.com/story/show/163908166
2019-03-26 10:59:27 +00:00
</p>
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
</div>
</div>
</div>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
</div>
Add pricing to the product page ‘How much does it cost’ is one of the user needs that we identifed for the product page. Cost is not the primary reason someone would use Notify (they’re more likely to cite ease, or that it’s ‘official’). However if you _don’t_ mention cost then it looks like we’re hiding something or that there’s a catch. So putting it on the page allays fears that people might have, rather than pushing them towards using it. Visually I’ve dropped the size of the `<h2>`s on this page so that there’s enough difference between them and the big numbers. The idea of the big numbers being big is to catch people’s attention as they scroll down the page, by breaking up the rythmn.
2016-12-14 14:59:41 +00:00
<div class="product-page-section">
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<div class="govuk-grid-row margin-bottom-">
remove some extra visual stuff
2022-12-15 10:00:54 -05:00
<div class="govuk-grid-column-full">
Add a ‘team’ section This addresses part of the ‘is Notify dependable’ group of needs. The ones it specifically and partially addresses are: - is it reliable - how is it supported There’s more to come in this section, we’re doing this bit now because it’s a nice conclusion to the page.
2016-11-28 15:39:44 +00:00
<h2 class="with-keyline">
The team
</h2>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
us → u.s.
2022-12-06 11:03:47 -05:00
U.S. Notify is built and maintained by the Public Benefits Studio, within the General Services Administration's Technology Transformation Services.
Add a ‘team’ section This addresses part of the ‘is Notify dependable’ group of needs. The ones it specifically and partially addresses are: - is it reliable - how is it supported There’s more to come in this section, we’re doing this bit now because it’s a nice conclusion to the page.
2016-11-28 15:39:44 +00:00
</p>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<p>
Update all links to use GOVUK Frontend style Includes: - turning off :visited styles to match existing design - swapping heading classes used to make links bold for the GOVUK Frontend bold override class - adding visually hidden text to some links to make them work when isolated from their context We may need to revisit whether some links, such as those for documentation and features, may benefit from having some indication that their target has been visited.
2019-12-06 07:53:46 +00:00
<a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.support') }}">Contact us</a> if you have a question or want
Add a ‘team’ section This addresses part of the ‘is Notify dependable’ group of needs. The ones it specifically and partially addresses are: - is it reliable - how is it supported There’s more to come in this section, we’re doing this bit now because it’s a nice conclusion to the page.
2016-11-28 15:39:44 +00:00
to give feedback.
</p>
</div>
</div>
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
</div>-->
Add a grid of features to the home page This is the first step towards a fully-fledged ‘product’ page. The needs for the top, blue section of the page are: - what is Notify? - can I use it? - can I test it out? - how do I create a log in The needs for the next section of this page (which is the only one added by this commit) are: - how will Notify help me work? - will it work with my service? This commit shows 4 features of Notify on the home page which address those needs. They are illustrated because: 1. We want to catch people’s attention – users are reluctant to scroll on this page because they just want to click the ‘create account button’. But we hypothesize that they will get on better with Notify if they look at some of this stuff first. 2. The concepts that they’re talking about are hard to explain with just words because they’re quite abstract. The illustrations help us be more specific. 3. Feedback we got from user research was that the product page didn’t give users any sense of what it was like to actually use Notify.
2016-11-23 10:58:12 +00:00
Create base forms for registration and sign in Created routes and forms for registration, sign in, and registration from an invite. Also tidied up assets folder, removed copy of fronted toolkit.
2015-11-25 16:21:28 +00:00
Updated html title [ci skip]
2015-12-01 09:54:58 +00:00
{% endblock %}
Reference in New Issue Copy Permalink