Charter

Home

The reading room fills the first screen, the heading in the light of its arched window and today’s hours for each place along the foot of the photo. Then search with the words people often ask for, Find help as the sentences people say at the desk, the four places as doors, this week’s programme by day, the neighbour grants and the news.

Find help

Every kind of help under four topics, each written as what a visitor would say (“A letter came and I don’t understand it”) and answered with where, when and what to bring. A block of phone lines for when it can’t wait.

A page per help

Where, when, what to bring and what it costs; what happens, step by step; the questions people ask; who runs it, and three more from the same place or person. Nine in the demo.

Places

The four places with their opening hours and the way in, how to get there by bus, on foot or by car, and a page per place: its room on the first screen, the week, the way in, who to ask and what happens there.

What’s on

Two weeks of the programme by day, with a filter by place, the events that happen every week, and a page per event. Fifteen in the demo.

News

The newest post at the top, the rest below, and a page per post with the author’s portrait and role. Every post also as Markdown. Five in the demo.

About and grants

The trust with its figures, the people you will meet, a short history, and ways to give or volunteer. The neighbour grants: what they fund, what they paid for last round, the dates, and an application form.

Contact, search and the rest

Call, come in or write, with a contact form; search across help, places, the programme and news; sample privacy and accessibility statements for the demo organisation; the thank-you page and a 404.

WCAG 2.2 AA

Zero axe violations on all 46 pages, in light and dark, at desktop and phone widths, in both editions, and on the Quay home page.

Fast on a phone

Lighthouse performance on mobile: 99–100 for the Astro edition, 96–97 for Next.js, on the home page, Find help and a place. Every photo has a fixed ratio and a file per width, so a phone loads the narrow one.

Checked at 17 widths

Every page measured from 320 to 5120 pixels in both modes, and looked over by a reviewer at every width: no sideways scrolling, no clipped text, phone numbers kept on one line.

Hours that are true

Without JavaScript each place shows its usual hours, which are always true. With it, the visitor sees whether it is open now and until when, or when it opens next, worked out in the organisation’s time zone, not the visitor’s.

Structured data for a public service

The organisation and the site with its search; the library as a Library and the other places as a Place, with opening hours; every help a Service with its questions as a FAQPage; every event an Event; the grants a MonetaryGrant; news as BlogPosting; breadcrumbs. A sitemap, RSS, llms.txt, Open Graph images and every post as Markdown.

Design rules, checked

Colours only from the preset, images with alt text and a size: pnpm lint holds every page to it, yours included.

$ git clone git@github.com:themesdev/charter-next.git
$ cd charter-next && pnpm install
$ pnpm dev      # the demo content, until you connect Sanity
$ pnpm seed     # then import it into your own dataset

1. 01Buy a licensePay once. The license belongs to your organisation; owners and admins hand out the seats.
2. 02Connect GitHubIn your account, sign in with GitHub once. We learn only your username, and invite it read-only to both repositories.
3. 03Pull updatesUpdates are free for life. Access follows your license, and the zip stays in your account next to it.

Questions