nsdt

Marketing by Cameron Nostedt.
Winnipeg, Manitoba.

Service website navigation: the N3 Sales example

A breakdown of N3 Sales’ website navigation: service labels, a visible shop number, consistent blog headers and a menu that works on small screens.

By · Published

A service business navigation bar should help a visitor find the right service and reach the business. On N3 Sales’ website, that means separate links for remote starts, radios and repair, with the shop number beside them. The same choices need to remain available when someone arrives through a blog article.

Project context: I built the N3 Sales website through NSDT. This is a walkthrough of its navigation, not a claim about measured sales or conversion improvements.

Use the names customers are looking for

The N3 Sales header names three services: Remote Start, Radios & Antennas, and Repair & Service. A visitor does not have to open a general services menu to discover whether the shop does their type of work. About, FAQ, Blog and Contact answer different questions and sit alongside those service routes.

That structure fits this business because the three services are distinct. A business with twenty services would need a different arrangement. Copying the number of links would miss the point: choose labels around the decisions your customers make.

Keep the phone number close to the decision

The shop number is a link, so a visitor on a phone can open their calling app. On a wider screen, “Call the shop” explains where the number leads. The number also appears on the contact page, where visitors can find hours, location and a written enquiry form.

A visible number does not replace a contact page. Someone planning an after-hours enquiry may want to write out vehicle details; someone with a quick question may prefer to call. Give both people a clear route.

Give article visitors the same wayfinding

A blog can be the first page someone sees. N3’s article header therefore uses the shop logo, service navigation and telephone number rather than an unrelated generic blog header. A reader learning about remote start confirmation can move directly to the remote start page without returning to the homepage.

Consistency here is practical. The article should still feel like part of the business that will answer the enquiry.

Check the header before and after scrolling

The N3 header now has a navy background from the first view. That matters because a light logo over a transparent header can lose contrast when the background underneath is light. Checking only the scrolled state can miss the problem.

On small screens, the article navigation moves into a menu while the phone number remains visible. Review the actual narrow layout: logo, number and menu must fit without pushing the page sideways. Also check that a keyboard user can open the menu and follow its links.

A short navigation review for your own site

  • Can a new visitor identify your main services from the labels?
  • Can they contact you from an article as easily as from the homepage?
  • Is the logo readable before any scrolling?
  • Do the menu and contact action fit on a narrow screen?
  • Does each link lead to a page that delivers what its label promises?

See the N3 Sales project for more context, or use the website launch checklist to review the rest of a site.