🍔Karl Jr

Chrome extension to ease editor work flow

Karl Jr. is a browser extension designed for SF.gov editors. It provides instant access to Karl the CMS and page information, including user feedback and broken links.

Install Karl Jr

Install Karl Jr from the Chrome Store

On Chrome

• In Chrome, go to Karl Jr on the Chrome Store

• Click Add

• Pin Karl Jr to your browser bar, so you can toggle it on and off easily:

  • In your Chrome browser bar, click the Extensions icon

  • Find Karl Jr (hamburger icon) and click the pin icon next to it

On Microsoft Edge

• In Microsoft Edge, go to Karl Jr on the Chrome Store

• Click Get

• Approve popups:

  • Allow extensions from other stores

  • Add Karl Jr to Microsoft Edge

• Pin Karl Jr to your browser bar:

  • Click View extension, then the pin icon to pin Karl Jr to your browser bar

  • OR, In the Edge browser bar, click the Extensions icon , then find Karl Jr (hamburger icon) and click the pin icon next to it.

---

What Karl Jr Does

Quick page editing

Make fast updates to SF.gov pages directly through the extension interface—no need to navigate through the CMS for simple text changes.

1

Click the Edit on Karl button in the Karl Jr sidebar

2

Page editor appears on the left, live page on the right

User feedback

See what residents are saying about your pages. Access user feedback directly in context, so you know what's working and what needs improvement.

Find images and documents

Get a list of all images and documents uploaded to a page. Open images and some documents to edit from Karl Jr.

• Click on an image title to edit it in Karl

• Click on a document title to edit it in Karl, if the document is uploaded directly to the page

Broken link detection

Instantly scan any page for links with likely or possible issues.

1

Click the Broken links button

2

You'll see Likely issues and Possible issues

Likely issue: 404 error, link is probably broken

Possible issue: Not a 404 error, but something is interfering with automated traffic (the checker) to the page. A human may be able to use the link. It's worth checking, though.

Accessibility tests

Instantly test for 6 accessibility issues on SF.gov pages:

• Heading nesting errors

• Missing image alt text

• Inaccessible link text

• Missing table captions or headers

• Missing video transcripts or captions

• Readability

1

Click the Run accessibility tests button

2

Results will show for all tests

3

Readability score tells you how hard the page is to read

This tool gives you an estimate of how hard your page is to read. There are also suggestions for how to make it easier.

Scores in Karl Junior are calculated using the Automated Readability Index, with some adjustment for sentence complexity. They do not come from Hemingway App.

The link to Get help in Hemingway App takes you to Hemingwayapp.com. Digital Services recommends using this free online tool to make your page content easier to read.

1. Click "Get help in Hemingway App" after running accessibility tests

2. Page text is automatically copied to your clipboard

3. Follow the step-by-step instructions to paste into Hemingway

4. Click "Open Hemingway App" when you're ready

5. Compare scores and get suggestions for simpler sentences and word choices

Advanced

• Primary agency tagged on the page, if any

• Content type of the page

  • Create new button lets you open a draft of a new page of that content type

• Page ID: numeric ID for the page; link displays page API

• Translations: back end of English and Filipino translations

---

Releases

Karl Jr 0.4.0 Release Notes - February 23, 2026

We're excited to announce Karl Jr 0.4.0, featuring a powerful new accessibility checker to help you create more accessible and readable content for SF.gov!

What's New

♿ Accessibility Checker

Run SF.gov-specific accessibility tests on any SF.gov page with a single click. The new accessibility checker helps you identify and fix common issues.

What it checks:

• Heading structure - Ensures headings follow proper hierarchy (H1 → H2 → H3) so screen readers can navigate your page correctly

• Image alt text - Identifies images missing alternative text descriptions

• Link accessibility - Flags vague link text like "click here" and raw URLs pasted into content

• Table accessibility - Verifies tables have captions and proper header rows/columns

• Video accessibility - Checks that videos include both captions and transcripts

• Readability score - Calculates grade level using the Automated Readability Index to help you write in plain language

🔍 Visual feedback: Issues are highlighted directly on the page so you can quickly find and fix them.

✍️ Hemingway integration

Get additional writing suggestions from the browser-based app Hemingway.

How it works:

1. Click "Get help in Hemingway App" after running accessibility tests

2. Page text is automatically copied to your clipboard

3. Follow the step-by-step instructions to paste into Hemingway

4. Click "Open Hemingway App" when you're ready

5. Compare scores and get suggestions for simpler sentences and word choices

---

Need help? Contact Digital Services: [e-mail]