RankLocal Guidelines

Local business websites that rank and convert.

Introduction

The RankLocal mark as an object on a graphite surface

RankLocal builds SEO-ready websites for local businesses, with a page for every service and every city they serve. The identity stays quiet so the work can be seen: plain surfaces, one accent and a mark that holds up at any size.

The mark is an R drawn as a single route. It ends beside a dot: the business on the map. Keep the gap between route and dot open, and keep the mark beside the RankLocal name in the full signature.

Ink and Paper carry the layout. Orange is kept for the mark, the main action and one highlight per view. Google Sans sets headings and Inter sets everything you read.

Logotype scale

72 px

60 px

48 px

38 px

30 px

24 px

18 px

Use the supplied signature as one piece of artwork. Keep the size, spacing and position of the mark and the name. Below 18 px the name gets hard to read: use the mark on its own.

Mark construction

Two arcs form the bowl of the R, and the dot sits on the axis where the route breaks. The dashed ring is the minimum gap around the dot. Construction lines belong in this reference only.

Color versions

Use the Orange mark with the Ink name on Paper or a light Mist field.

On Ink or a dark photo, switch the name to Paper and keep the mark Orange. Use the one-color white version when Orange would clash with the image.

Core palette

Orange

Hex
Rgb
Cmyk: 0, 53, 92, 4

Ink

Hex
Rgb
Cmyk: 0, 0, 0, 96

Paper

Hex
Rgb
Cmyk: 0, 0, 0, 0

Stone

Hex
Rgb
Cmyk: 0, 0, 0, 55

Ink and Paper define the identity. Orange marks the brand and the one action that matters on a screen. Stone is for secondary text and quiet details. These are the same tokens the product uses.

Color proportions

Paper

60%

Ink

30%

Orange

10%

Paper gives pages room, Ink carries text and dark surfaces, and Orange stays near a tenth of any layout. Darker material like signage and merch can flip Paper and Ink.

Readable combinations

AaInk on Paper19.8:1AAA

AaPaper on Ink19.8:1AAA

AaOrange on Ink6.9:1AA

AaInk on Orange6.9:1AA

AaStone on Paper4.7:1AA

AaOrange on Paper2.9:1Fail

Use the high-contrast pairs for paragraphs, labels and contact details. Orange text fails on Paper: use Orange as a fill with Ink on top, or as text on Ink. Ratios follow WCAG 2 for normal text.

Type system

Google Sans: Local websites that rank.

Google Sans Medium sets headlines and section titles with tight tracking. One heading introduces one idea. Keep it short enough to read at a glance.

Inter: Every service, every city.

Inter Regular carries body copy, labels, tables and numbers. Keep counts next to what they measure so a reader can compare plans, pages and cities at a glance.

Type scale

Base 16pxMajor third · 1.25

Display

Google Sans · 500 · 48.8px · 3.052rem

Local websites that rank.

Heading 1

Google Sans · 500 · 39.1px · 2.441rem

Every service, every city.

Heading 2

Google Sans · 500 · 25px · 1.563rem

Generate local websites that rank and convert.

Heading 3

Google Sans · 500 · 20px · 1.25rem

Service areas and city pages

Body

Inter · 400 · 16px · 1rem

RankLocal builds SEO-ready websites for local businesses, with a page for every service and city they serve.

Caption

Inter · 400 · 12.8px · 0.8rem

48 pages · Deployed to Netlify

Sizes step up by a major third from a 16 px base. Use Display once per page, then Heading 1 to 3 in order. Body and Caption are always Inter.

Tone of voice

RankLocal sounds like a capable builder explaining the job to a busy owner. Be direct, concrete and calm. Let the finished site carry the excitement and use words to say what was built and what happens next.

Name the business, the service and the city. Put numbers beside the claim they support. Status messages say what happened and the next step, never a joke.

A clear introduction to the product

Use these as references for length and rhythm, not as fixed copy.

Signature

Local websites that rank.

Headline

Generate local websites that rank and convert.

Brand statement

RankLocal builds SEO-ready websites for local businesses, with a page for every service and every city they serve.

Introduction

Pick a business, its services and the cities it covers. RankLocal writes the pages, designs the site and puts it live.

Call to action

Build my site free.

Say what it does

Describe the result in plain words. A business owner should understand the sentence without knowing what SEO is.

Say	Avoid
Build a site with a page for every city you serve.	Unlock next-gen AI-driven local presence.
Your pages are written and ready to publish.	Supercharge your content strategy.
Connect a domain and go live.	Seamlessly elevate your online brand.

Use real numbers

Counts, cities and services are more convincing than adjectives. Keep the number next to what it measures.

Say	Avoid
48 pages: 6 services across 8 cities.	Tons of pages to boost your rankings.
Generated in about 4 minutes.	Lightning fast generation.
3 sites left on your plan.	Running low on sites!

Report the real state

Status messages say what happened and what to do next. No jokes where someone needs an exact answer.

Say	Avoid
Deploy failed. Check your Netlify token.	Oops! Something went wrong.
Your site is live at northside-roofing.com.	Woohoo, you're all set!
Generating pages: 12 of 48.	Hang tight, magic is happening.

The product as the proof

A local business website built with RankLocal on a laptop and phone

The generated site is the hero. Show it on real devices with real business names and cities, and keep the RankLocal signature small and to the side.

A dot on the street

A RankLocal sticker on a local shop window

Out in the world the mark works alone. A single Orange mark on a window, a van or a card says “find us online” without extra words. Check it against the surface it sits on.