Utility nav surfaces audience-specific pages. Keeps primary nav focused on visitor discovery.
For Residents
For Business Owners
Jobs
Media & Partners
Subscribe
Navigation: 3 mega menus (Events, Eat & Drink, Explore) with 2/3 link pane + 1/3 editorial spotlight panel. 2 simple dropdowns (Parking & Safety, About) with icon + label + description per row. Donate CTA styled as distinct button. Per SNA_Navigation_Strategy_OSA: mega menus trigger on hover (200ms open / 300ms close delay in production); editorial panels are CMS-managed single post references with fallback defaults; Explore groups subpages by section (Art & Culture, Shopping, Experiences, Stay); Shopping nav shows only Fashion, Gifts, and All Shopping (analytics-informed — other categories accessible via landing page); Events editorial panel uses NAVY background; Eat & Drink and Explore editorial panels use white background. Mobile: all menus convert to accordion drawers, editorial panels omitted.
Header adapts per view. All Restaurants & Bars: "Every Restaurant & Bar in the Short North." Subcategory views: category-specific H1 + editorial subhead + breadcrumb. Result count updates dynamically as filters are applied. This wireframe shows the Dinner subcategory view as the example.
Editor's Pick
Wide editorial photo — atmosphere, not food-on-plate
Dinner · Italian
Featured Restaurant Name
Inventive small plates and a wine list that makes you stay longer than planned. One of the Short North's most talked-about tables — and worth every bit of the conversation.
View Restaurant Name →
Featured/pinned card appears on subcategory pages only. Full-width, editorially selected, placed above the results grid. "Short North Original" badge is visually distinct (purple/star) to reinforce local identity. Rotate monthly minimum. If no editorial resource available, disable this slot rather than leave it stale.
5 filters + 1 sort control. Sticky on scroll. Active filters = filled chip (dark bg, white text). "Open Now" is highest-urgency — requires accurate CMS hours. "Short North Original" celebrates local/independent businesses. Vibe dropdown: Date Night · Late Night · Family-Friendly · Dog-Friendly · Good for Groups. Filters use AND logic. URL query params for shareable filtered views. Mobile: horizontal scroll + "All Filters" drawer with badge count.
Open Now
Atmosphere photo
Restaurant Name
★ Short North Original
Date Night
Outdoor Seating
View Restaurant →
Open Now
Atmosphere photo
Restaurant Name
Late Night
Good for Groups
View Restaurant →
Atmosphere photo
Restaurant Name
★ Short North Original
Date Night
Good for Groups
View Restaurant →
Business card = atomic unit of every listing page. Photo (atmosphere, not food-on-plate), name, category tags (max 2), price tier, Open Now indicator (only if hours data exists), vibe badges (max 3), CTA. Entire card is clickable. 3-col desktop, 2-col tablet, 1-col mobile. Consistent card height per row. "Short North Original" badge is visually distinct (purple/star).
The empty state below is displayed ONLY when active filters return zero results. It replaces the results grid above. Included here for documentation purposes.
No matches yet — but the Short North is full of options.
Your current filters didn't match any restaurants. Clear your filters to see the full Dinner guide.
Clear All Filters
Browse All Restaurants & Bars →
Empty state is a trust/usability recovery — not an error page. Tone: friendly, on-brand, not apologetic. Two recovery actions: Clear Filters (primary) and Browse All (safe fallback). If zero-result prevention is implemented in the filter bar (disabling options that would produce 0 results), this state should be rare but must still exist as a fail-safe. Avoid: "No results found" — clinical and dismissive.
Light cross-sell for users who finished browsing or didn't find what they want. Card 1: Food & Drink Events (links to Events calendar filtered by Food & Drink). On Bars & Nightlife page, substitute "Nightlife Events." Card 2: Plan Your Visit (parking/logistics — reduces friction for in-person visit planners). Should not compete visually with the listing itself.
PRE-FOOTER — Global component displayed on every page. Combines newsletter signup + social links into a persistent strip above the footer.
Footer consolidates full sitemap. Social links in pre-footer above. Links connect to wireframes where available; # = placeholder for pages not yet wireframed.