From the Scribe: the pre-deploy checklist Verify before you install, repair only what’s demonstrably broken, and finish with PASS / REPAIR / HOLD. Each section below is a group you can fold on the site. Two checks are credited to the constellation-control canon. Layout and rails Every block lines up on the same left and right edges, within 4 pixels. For example, the headline, the paragraph under it, and the cards below should share those edges. (from the constellation-control canon) Look at photo crops on a phone and on a big screen. A crop is the part of the photo you choose to show. Square crops with the face set to the far edge cut two faces in half on our team strip until the center was moved back. A page can load and still be broken. Open it and look. For example, a missing design file leaves plain unstyled text. Check that file twice, a few minutes apart. If you use an automatic check, make it fail when a page has no design file linked at all. A check that only asks whether a file exists can pass a page with no styling. Finish this section with PASS, REPAIR, or HOLD. Mobile and touch Tap targets need at least 24 pixels of height and width. For example, a text link, a button, and a menu item. Check the same page on a phone and on a desktop before you publish. A crop or a wrap that looks fine on a big screen can fail on a phone. If people can save the site to a phone home screen, check the icon art, not only that the file is the right size. In a test of three sites the code passed, and two icons still had to be redrawn. Finish this section with PASS, REPAIR, or HOLD. Accessibility (WCAG) WCAG, the Web Content Accessibility Guidelines, asks for enough contrast between the words and what sits behind them. Pale gold on a bright video failed that for us. Words follow one written style. For example: curly quotes and apostrophes, no long dashes, and text big enough to read. Body text should be at least 18 pixels. (from the constellation-control canon) Alt text says what the photo shows. For example, “black tee, front view,” not “Product mockup.” Finish this section with PASS, REPAIR, or HOLD. Speed Do not add a speed tool until a page is demonstrably slow. Open the published page and watch it load. If you cannot show a problem, the verdict is PASS. Repair only the part you can show is slow. Finish this section with PASS, REPAIR, or HOLD. Search and sharing Give each page you share its own preview image. For example, a picture about 1200 by 630. Without one, every link can show the same picture. A hidden page does not appear in menus or search. If a visitor should find it, add a link. Finish this section with PASS, REPAIR, or HOLD. Privacy and security On a shop, put a business email, phone and address in the contact settings. Those details are copied onto public policy pages. Do not use a home address. For example, use a business email instead of the address where you live. Put a contact line on every page. For example, an email a visitor can see without hunting for it. Finish this section with PASS, REPAIR, or HOLD. Audio and sources If words sit on top of a video, they need enough contrast to read. Gold captions over video failed that. Name who said a quote and where you found it. Trace a number to a source. If you cannot check it, leave it out. For example, write the person’s name and the page, or cut the line. Finish this section with PASS, REPAIR, or HOLD. Maps These notes do not include a map that failed. If the page has a map, open the published page and use the map. Repair only what is demonstrably broken. If there is no map, mark PASS. Finish this section with PASS, REPAIR, or HOLD. Free to copy. Nothing here is paid.