Nihoner

The new navigation, in context

Hover any of the six items above. Try it with the keyboard too — Tab to move, ↓ to open a panel, Esc to close. Scroll down: the bar stays put. Narrow the window past 1060px to see the mobile drawer.

What it covers

Everything the current menu had, plus everything it was missing. All 51 destinations verified live.

6top-level doors
51destinations, all HTTP 200
+29links the old menu never had
13,071kanji, counted live
194,458lexicon words, counted live

What the old menu was missing

Audited against menus 3, 117, 118 and 844.

DestinationOld menuNow in
Japanese History (whole section)AbsentHistory — its own panel
AI Japanese TeacherAbsentAI Tools
AI Pronunciation TrainerTop bar onlyAI Tools
Kanji DuelAbsentGames → Kanji
Chimei — Japan City GameAbsentGames → Japan
Kanji Ronin, Blade Forge, Hangman, Vocab Swipe, Audio SamuraiAbsentGames
EncyclopediaAbsentKanji & Words · Japan
Furigana & Japanese convertersTop bar onlyKanji & Words → Text tools
Japanese OracleLogged-in onlyJapan → Culture
Courses, Quizzes, Flashcards, Grammar, Vocabulary, Dictionary, Lexicon, Kanji, Books, Cities, Prefectures, Pricing, BlogPresentAll kept

Fixed in this version

Three things you reported, and what was actually wrong.

Fixed

Nothing happened on hover or click

The <script> was printed before the menu markup, so querySelector('.nmm') returned null and the whole script bailed on its first line. It now emits after the markup and waits for DOMContentLoaded, so it cannot break again if the call is moved.

Fixed

Black text on the red button

A CSS specificity collision: .nmm a (0-1-1) out-ranked .nmm-cta (0-1-0), so color: inherit won and the white was discarded. Every colour-critical rule is now written at 0-2-1 so it cannot be out-specified.

Added

Top utility bar

A slim dark bar above the main navigation with the six most-used look-ups, plus Blog, Pricing and your account. Frequent tasks now take one click from anywhere.

Why it is built this way

Each choice is doing a specific job, not decoration.

Hick's Law

Six doors, not forty

Decision time grows with the number of simultaneous options. The old menu put 22 items on the bar. This puts 6, and hides the depth until you ask for it — so the first glance is calm, not busy.

Plain language

One ordinary word per section

Learn · Dictionary · Tools · Games · History · Japan. No insider vocabulary, nothing to decode. "Kanji & Words" became "Dictionary" precisely because everyone already knows what a dictionary is.

Legibility

Bigger type, stronger contrast

Menu items are 17px and link titles 16px, up from 15px and 14.5px. The muted grey went from #8a8a95 to #63636f. Targets are 78px tall on the bar and 48px on mobile — comfortable for imprecise pointing and older eyes.

Information scent

Every link explains itself

"Lexicon" tells you nothing. "194,458 words — the largest list online" tells you whether to click. Descriptions cut the back-and-forth of opening a page just to find out what it is.

Anchoring

Precise numbers, pulled live

13,071 reads as a measurement; "13,000+" reads as marketing. Every count comes from the database and is cached for a day, so it can never quietly become false.

Von Restorff

One featured card per panel

An isolated, visually distinct element gets looked at first. Each panel opens with a red card so the eye lands somewhere deliberate instead of scanning a flat list of links.

Fitts's Law

Big targets, forgiving paths

Full-height hit areas on the bar, generous padding on every row, and a pointer "safe triangle" so moving diagonally into a panel doesn't swap it out from under you — the most common mega-menu annoyance there is.

Recognition

Kanji as icons

学 遊 史 漢 日 智 instead of emoji. Unmistakably on-brand for a Japanese site, visually quieter than emoji, and it teaches six characters to anyone who looks twice.

Novelty

A NEW badge that expires

History carries a badge while the corpus is small, and automatically swaps to a real entry count once it passes 1,000 pages. Honest at both stages, with no one having to remember to change it.

Accessibility

Keyboard and screen-reader complete

Real buttons with aria-expanded, arrow-down to enter a panel, Escape to close and return focus, focus-visible rings, and full prefers-reduced-motion support. Every link still works with JavaScript off.

No dead ends

Top-level items are real links

Clicking "History" goes to the history hub rather than only opening a panel. A menu item that does nothing but expand is a dead end for anyone who clicks before reading.

Scroll region — the bar above stays pinned, and the backdrop dims this content whenever a panel is open so the menu reads as a layer above the page rather than part of it.
More scroll room, so sticky behaviour is obvious.
Keep going…
…and the navigation is still exactly where you left it.