Altwise

Square Online website accessibility fixes: alt text, menus, contrast and ordering

How to add alt text to Square Online site and item images, fix colour contrast, keep menus as text, test the online ordering flow with a keyboard, and what you can't change in the builder.

Square Online is the website builder that comes with Square, so lots of cafes, restaurants, food trucks, salons and small shops use it for their menu, online ordering and store. Like other managed builders, you control content and some settings, and Square controls the template code. This guide covers the fixes you can make yourself in the Square Dashboard, the ones you can't, and a quick way to test.

1. Add alt text to site images

Square's help article Index your Square Online site with search engines gives these steps for images in the site editor:

  1. Sign in to Square Dashboard and go to Online.
  2. Select Website > Edit site.
  3. Open a page with images, select the section that contains them, then select an image to open the image menu in the editing panel.
  4. Type a short description in the alt text box.
  5. Publish your site. Visitors only see changes after you publish.

Square notes this applies to non-background images. Background images (set under Customize > Background) are treated as decoration, so never put important words, prices or offers only inside a background photo.

2. Add alt text to item and menu photos

Item photos are managed in your item library, not the site editor. Square's article Index online items and categories with search engines says to go to Items (it may be called Items & services, Items & menus or Items & inventory) > Items > Image library, select the image, add alt text and save. Describe what the customer is choosing: "Breakfast burrito cut in half, eggs, chorizo and potatoes" is more useful than the item name repeated or a file name. Ideas: 20 alt text examples. Check a live page with our free alt text checker.

3. Check theme colours for contrast

Pale text on photos, light grey prices and pastel "Order now" buttons are the usual problems. Test each text and button colour pair with our free colour contrast checker: normal text needs 4.5:1 against its background, large text 3:1 (WCAG 1.4.3). If a pair fails, pick a darker or lighter colour in the site's style settings, or add a solid section background behind text.

4. Keep the menu and key facts as real text

A menu uploaded as a photo or PDF can't be read by a screen reader, zoomed cleanly on a phone, or found by search. Use item sections or a text section for the menu, and put hours, address, phone, allergen notes and pickup instructions on the page as text. See accessible PDFs and menus and flyers and images of text.

5. Write headings and button text that make sense

Use one main heading per page and section headings in order (heading structure guide). Button and link text should say what happens: "Order pickup", "View catering menu", "Call 918-555-0100" rather than three buttons that all say "Learn more" (WCAG 2.4.4). More in link text and buttons.

6. Test the ordering flow with a keyboard

The most important task on most Square Online sites is ordering. Put your mouse away and use Tab, Shift+Tab, Enter, Space and the arrow keys to: open a category, choose an item, pick options or modifiers, change the quantity, add to cart, pick a pickup or delivery time, and reach checkout. Watch for a focus outline you can see at every step (WCAG 2.4.7), a dialog that traps you or can't be closed with Escape, and option choices with no label. Our online ordering guide has a full 10-minute test.

What you probably can't fix in the editor

The item dialog, cart, checkout and pickup-time picker are part of Square's platform, not your content, so if they fail the keyboard test you can't rewrite their code. Note the page, what you pressed and what went wrong, and report it to Square support. Meanwhile, give customers another way to order: put your phone number and any third-party ordering option as text near the menu, and say so in an accessibility statement (our free statement generator makes one in a few minutes). Don't add an overlay widget hoping it fixes the checkout; see overlays vs real fixes.

A 15-minute check you can do today

  1. Run the free snapshot on this page against your published Square Online site.
  2. Add alt text to your homepage images and your top 10 item photos.
  3. Test text and button colours with the contrast checker.
  4. Do the keyboard ordering test in step 6.
  5. Zoom your browser to 200% and check that menus, prices and buttons aren't cut off (zoom and tap target checks).

What a scan can and can't check here

Our scan is automated, so it finds only part of the barriers on the public pages it visits: missing alt text, unnamed buttons and links, unlabelled fields, many contrast problems, missing page language and similar code issues. It doesn't place an order, open every item dialog, test your checkout or judge whether alt text is accurate. The Fix-Pack scans up to 10 public pages and lists each issue with the element it's on and a general copy-paste fix. Our report has step-by-step click paths for Wix, Squarespace, WordPress, Shopify and Webflow; for Square Online it gives the general fix, and you apply it with the Square steps above or report it to Square if it's in platform code.

Building Square Online sites for clients? The agency 5-pack gives you five white-label reports ($499, use within 12 months).

Square and Square Online are trademarks of Block, Inc. Altwise isn't affiliated with Square. Steps quoted from Square's public help articles as of November 2026 and may change.

Want the fixes written for you?

Start with a free homepage snapshot. The $149 Fix-Pack scans up to 10 pages and gives copy-paste fixes for your platform within 48 hours, with a 14-day refund promise. See a sample report first.

This is general technical guidance, not legal advice, and it does not certify compliance with the ADA or any law.

Related guides

All guides

This guide is general technical information, not legal advice. Following it does not certify ADA or any legal compliance. Automated checks find only part of accessibility barriers.

Check your own site, then decide

  1. Free homepage snapshot. Your top 3 issues in about a minute. No signup, no card.
  2. $149 Fix-Pack, if you want the full list. Up to 10 pages scanned, issues ranked by impact, copy-paste fixes for your platform, delivered within 48 hours, plus one re-scan after you apply them.

Get my free snapshot Order the Fix-Pack – $149

14-day refund promise. See a sample report first. A technical report, not legal advice; automated checks find only part of accessibility barriers.