Designing Navigation for a Millennium
Century, Volume, Year —— A Three-Tier Accordion for Timeless UI

1. Why preserve names for a thousand years

In 2026, AGI is becoming a reality. In an era where any intellectual task can be performed by AI, where does human value reside? Society has long treated "being recognized" as proof of having lived. Degrees, credentials, titles, follower counts, likes — a structure where one's existence is confirmed through others' approval. But when AGI can generate any deliverable, that metric itself loses meaning. No matter how brilliant the report, no matter how polished the presentation — if AI can produce it in seconds, it is no longer proof that someone lived.

What remains is the bare fact that a person existed in a particular moment. The voice when a name was chosen. The letter read aloud at a wedding. The cry of joy upon hearing a child's first word. These cannot be generated by AI — because they are not outputs, but records of existence.

From an age of seeking approval to an age of inscribing existence. At that turning point, a question arises — how do you deliver a record of existence a thousand years into the future?

2. The unnamed grave in Lahaina

Think of a gravestone. A gravestone has no lock. Anyone can visit the cemetery and read the inscription. A great-grandchild visits a century later. A historian visits two centuries later. They encounter a predecessor's existence. This is possible because the gravestone is public. A gravestone is the longest-lived interface, published for future visitors.

Through international volunteer work supporting the repatriation of Japanese immigrants' remains to Japan, the author has personally visited numerous graves across Japan and the United States — East and West. Walking through cemeteries of different cultures and religions, one truth emerged: what is inscribed on gravestones is universal. A spirit of hospitality, reverence for ancestors, a wish for permanence. These are shared across all traditions.

In 2023, Lahaina on the island of Maui was devastated by a catastrophic wildfire. A historic town vanished overnight. The author traveled to the site with family as disaster relief volunteers. While working through the aftermath, we visited a cemetery that remained among the ashes. There stood a gravestone with no name — an unnamed soul. Standing before it, an emotion beyond words welled up. Not quite grief, not quite sorrow, not quite pity — each word came close but none was exact.

This person must have had a story of arriving at this place. Days of meeting people, deepening bonds, building connections. They must have lived through countless emotions, and perhaps had something they wanted to pass on to future generations. Yet their bloodline, their family, their relatives — all severed, leaving nothing but the word "unnamed." The only way to prevent this is to build a structure. If there had been a system open to everyone — a way to preserve names and stories — the outcome might have been different. That thought has never left. Today and into the future, TokiStorage will continue to build and expand that structure.

A life without records

The author, too, has lived through the absence of records. My birth time was never recorded in the maternal health handbook. When I asked where I was born, my parents deflected, and I did not learn the answer until middle age. Even my own parents would call me by my brother's name, correct themselves, and only then say mine — this was everyday life. The habit of calling the wrong name was so ingrained that my parents repeated the same pattern with my daughter — calling her by my brother's daughter's name, correcting themselves, and only then saying hers. The blurring of one's own existence was threatening to be passed down across generations. In elementary school, a homework assignment asked us to find out the origin of our names from our parents. The answer I received was: "We don't know. We don't remember." The next day, I stood before the class and announced: "They said they don't know." Each of these may seem small. But they accumulate, and the outline of one's own existence grows blurred. If this system had existed at the moment of birth, at the moment of naming — much of this could have been prevented. And if it had been preserved as a voice — the feelings poured into choosing a name — it would have been the most irreplaceable gift a child could ever receive.

What was lost was lost because there was no structure to preserve it. With a structure in place, the outcome would have been different.

3. The significance of special feature newsletters

TokiStorage operates "TokiQR," a service that encodes voice into QR codes. Wedding messages, family records, milestone greetings — voice is encoded into a QR code and inscribed on a single sheet of paper. Hand it to someone. When they scan it, the voice plays back.

These voices are compiled into "special feature newsletters" as PDFs and deposited with the National Diet Library of Japan. When a wedding venue or hotel opens a series, the voices left by attendees accumulate issue by issue. Ordinary people's ordinary voices become part of the nation's permanent archive.

The challenge is that these newsletters are issued every six months, and series keep multiplying. 40 issues over 20 years. 200 over a century. 2,000 over a millennium. The special feature series grows further still — every venue, hotel, association, or memorial hall that adopts voice QR codes adds a new series. Over centuries, thousands. Lay them all out in a flat list, and the question becomes clear — this is where navigation design begins.

4. The limits of a flat list

Thousands of newsletter entries in a flat list. What happens?

Pagination penalizes search engines — content beyond page one is poorly indexed. Infinite scroll offers nearly zero crawlability. Lazy-loading with JavaScript makes content invisible to search engines. Every extension of a flat list runs into the same structural ceiling.

5. A thought experiment: 50, 100, and 1,000 years out

Design decisions should be made not by asking "what do we need now?" but by asking "what will this look like later?" and working backward. Backcasting.

Fifty years out. About 30 special feature series. 100 back issues. A flat list still barely works. You can scroll through everything. But it's no longer comfortable.

A hundred years out. Over 100 series. 200 back issues. Without categories, you can no longer find what you're looking for. Some structure is needed.

A thousand years out. Over 1,000 series. More than 2,000 back issues. Fifty volumes of ceremonial renewal. A flat list is out of the question, and even simple categories start to buckle. This is where three tiers become inevitable.

The question isn't "when should we introduce this?" It's "can a minimal structure, introduced now, prevent collapse later?"

6. Ceremonial renewal and the time axis

TokiStorage's newsletter uses a "Shikinen Sengu" (ceremonial renewal) numbering system. One volume spans 20 years. Every 20 years, a new repository is created, and the baton is passed. It mirrors the Ise Grand Shrine, which rebuilds its sanctuaries every 20 years — not to destroy, but to carry forward. Old volumes remain as permanent read-only archives.

This concept of "volume" creates a natural division of time. Volume 1 covers 2026 to 2045. Volume 2 covers 2046 to 2065. Knowing the volume tells you the era; knowing the era tells you the volume.

And there is one layer above that: the century. The 21st century holds Volumes 1 through 4. The 22nd century holds Volumes 5 through 9. Century, volume, year. These three tiers can be derived from an existing date field (createdAt) alone — no schema changes required.

Time is the only universal axis of classification. Category schemes are subjective; time is objective.

7. The three-tier accordion

HTML includes the <details> and <summary> elements as standard. They create an accordion that opens and closes on click. No JavaScript required. They work as a native browser feature.

Nest them three levels deep. The outermost layer is the century. Inside that, volumes. Inside each volume, year-by-year links.

When collapsed, a millennium of content fits in ten lines. 21st century, 22nd century, 23rd century — just the century headings. Open a century and five or so volumes appear. Open a volume and year-by-year links unfold.

Only the latest century and latest volume receive the open attribute. First-time visitors immediately see the most recent content. Past centuries remain collapsed, but every link exists in the DOM. Search engine crawlers can index all links inside <details> elements regardless of their open or closed state.

See the navigation in action →
Page is in Japanese, but the accordion structure is language-independent.

8. Quantitative scalability analysis

Let us verify the effectiveness of the three-tier accordion quantitatively. The comparison targets are a flat list, pagination (20 items per page), and a search box.

Reach cost comparison

We define "reach cost" as the number of interactions required for a user to arrive at any given item, measured in clicks and scroll distance.

The reach cost of the three-tier accordion is O(1). Whether there are 200 items or 2,000 or 20,000, the maximum number of clicks to reach any issue is three: open the century, open the volume, select the year. Compared to a flat list's O(n) or pagination's O(n/k), the accordion reaches any target in constant time regardless of scale.

Visible line count in collapsed state

The number of lines visible to the user when the navigation is collapsed:

• 100 years (1 century, 5 volumes): 1 century heading. Open the latest volume: +5 lines. Total: 6 lines
• 500 years (5 centuries, 25 volumes): 5 century headings. Open the latest: +5 lines. Total: 10 lines
• 1,000 years (10 centuries, 50 volumes): 10 century headings. Open the latest: +5 lines. Total: 15 lines

Even after a millennium, the initial view is just 15 lines. Yet the DOM contains every link (2,000+), and crawlers can index them all. Visual conciseness and DOM completeness coexist — this is the essential strength of <details>.

9. Degradation resistance and technology lifespan

In a thousand-year design, the greatest risk is technological obsolescence. We must estimate how long today's technology choices will last.

Average lifespan of web technologies

HTML elements are protected by browser backward compatibility. The <table> element defined in 1995 works in every browser in 2026. Meanwhile, AngularJS, dominant in the 2010s, reached end of support in 2021. Elements written into the standard specification last ten times longer than frameworks.

Degradation scenario analysis

How the three-tier accordion withstands each failure scenario:

• JavaScript disabled: <details> is a native HTML element that functions fully without JS. Open/close is browser-native. Zero impact
• CSS disabled: Styling disappears, but <details> toggling is preserved. <summary> text serves as headings. Structure remains readable
• Text-only browser (Lynx, etc.): Browsers that don't support <details> display all content in expanded state. It falls back to a flat list. No information is lost
• Screen reader: <details> carries an implicit role="group", and <summary> acts as role="button". Expansion state is announced via aria-expanded automatically. Keyboard operable (Enter/Space). WCAG 2.1 AA compliant
• Search engine crawler: All links exist in the DOM regardless of <details> state. Google indexes content within standard HTML elements

In every scenario, information loss is zero. The worst case (complete CSS/JS failure, non-supporting browser) simply displays all links in expanded state. This is decisively different from other patterns — SPAs show blank pages without JS, infinite scroll shows only page one.

When the worst-case fallback is a flat list, the worst case still means "every piece of information remains accessible."

10. The cost of implementation: minimality of added code

The code added consists of a single function, buildCenturyNav(), and a few dozen lines of CSS. No external libraries are involved. <details> is defined in the HTML Living Standard and is supported by every modern browser as of 2026.

Nothing was added to the existing JSON schema. The special feature series' createdAt field provides the year, from which the volume and century are computed. The back-issue date field works the same way. No new data structures were created.

Both the back-issue section and the special feature section are rendered by the same buildCenturyNav() function. One function serves two distinct content lineages with a consistent UI. This is deduplication, the opposite of over-engineering.

A design that can list a millennium of links, and a design that remains usable when a millennium of links actually exist — those are two very different things.

If this isn't done now, someone a century from now will ask, "Why was this built with a flat list?" Retrofitting structure at that point is far harder than doing it today, because a hundred years of content already exists and a hundred years of URLs are already linked from the outside world.

11. How the world's enduring institutions design their navigation

With this design philosophy in hand, examining the web navigation of organizations that should care most about longevity — national libraries, museums, religious sites, government archives — reveals a striking reality.

The observations below are not intended as criticism of any institution. Each one makes vast collections publicly accessible and supports access to humanity's intellectual heritage. The question posed here is an observation from the highly specific lens of "navigation at a 1,000-year scale." Each institution operates under its own constraints, priorities, and mission.

Institutions that lean on the search box

The Library of Congress presents 566 collections through faceted search and pagination. jQuery plus server-rendered HTML — a solid, conservative technology choice. The UK National Archives similarly offers keyword search with date-range filters across 37 million descriptions. The British Museum builds its data layer on RDF/SPARQL, a semantic web standard with excellent data longevity.

But all of these are fundamentally search-first. They serve people who already know what they're looking for. They are not tools for surveying the whole.

The irony: Japan's National Diet Library

The National Diet Library (NDL) — the very institution that archives TokiStorage's newsletter — built its digital collection portal on Nuxt.js, a Vue.js-based SPA. Without JavaScript, it renders nothing but a loading spinner. To a crawler, it's a blank page. The institution responsible for the nation's permanent records depends on the shortest-lived category of web technology: a JavaScript framework.

History as narrative: Ise Grand Shrine

The Ise Grand Shrine, with over 2,000 years of history, has no chronological navigation on its website whatsoever. History is told thematically under "About." Time is treated not as something to navigate, but as something to narrate. Simple HTML, no framework dependencies.

Keiunkan, believed to be the world's oldest hotel (founded 705 AD), follows the same pattern. Its 1,300-year history is told as story, never structured as navigable data.

A flat table for 2,000 years: the Vatican

The Vatican displays its 2,000-year list of 267 popes as a single flat HTML table. No pagination, no accordion. This works because the growth rate is extraordinarily low — roughly 13 entries per century. Server-rendered HTML with perfect crawlability. But this approach cannot work for TokiStorage, where issues arrive every six months and new series multiply with each adopting organization.

The pioneer of temporal drill-down: the Wayback Machine

The Internet Archive's Wayback Machine uses a year-to-month-to-day-to-capture drill-down, the most elegant temporal navigation pattern in existence. No matter how many years accumulate, the timeline bar simply extends. However, it is built on Web Components (Lit Element), and without JavaScript, nothing renders.

Navigation pattern evaluation matrix

* Search achieves O(1) only when the target is already known. It cannot support open-ended exploration. Surveyability: ○ = full structural overview at a glance. △ = partial. × = impossible. — = not applicable.

Two poles, and a third option

What emerges is a landscape defined by two poles. On one side, the search box — a tool for those who already know what they seek. On the other, narrative — a method that treats time not as data to navigate but as story to tell.

TokiStorage's three-tier accordion offers a third option: structured surveyability. Not searching. Not reading. Surveying — opening and closing folds to grasp the whole, then drilling down to any depth.

Search is a tool for those who know. Narrative is a telling for those who listen. The accordion is a structure for those who survey.

Why no one has done this

The Long Now Foundation champions long-term thinking with its 10,000-Year Clock project. But that is a philosophical project. It does not actually design web navigation for a millennium. Long-term thinking as philosophy, and long-term thinking as implementation, are entirely different things.

TokiStorage's newsletter is deposited with the National Diet Library of Japan. This is not a thought experiment. It is content that is actually published, actually deposited, and physically exists as a permanent national record. Designing the navigation for that content to work across a millennium is nothing less than a practical answer for actually operating a thousand-year archive.

This design integrates several elements:

• Embedding a cultural frame — Shikinen Sengu, the ceremonial renewal of Ise Shrine — into the numbering system
• Maintaining zero JavaScript dependency to preserve crawlability
• Deriving the entire hierarchy from a single existing createdAt field

Any one of these might exist elsewhere. But integrating all of them into a "navigation for a millennium" that is actually in production — that, as far as we know, exists nowhere else.

12. Self-referential completeness

This essay has one structural singularity: what it argues and what it is are the same thing.

• The essay argues that <details> requires no JavaScript and can last a millennium
• The essay itself is a static HTML page with no JavaScript dependency
• The site hosting this page runs the very three-tier accordion described within
• The content on that site is deposited with the National Diet Library of Japan

Argument, implementation, and operation form a trinity on the same URL. Academic papers cannot achieve this structure. A paper writes "this should be done," but the paper itself is a PDF behind a journal paywall. The Long Now Foundation says "let us think about the next 10,000 years," but its own website is not engineered to last 10,000 years.

Long Now says "let us think." Scholars say "let us discuss." TokiStorage says "we built it, it's running, and it's deposited." That difference is decisive.

A design that propagates itself

Moreover, this design does not stop at a single page. TokiStorage's special feature series creates an independent repository for each client automatically. Wedding venues, hotels, neighborhood associations — every time a new client is onboarded, a provisioning function creates a repository and copies index.html from a template. That template is the three-tier accordion.

This means the design is not write-once. It propagates automatically each time a new series is opened. A hundred client repositories means a hundred sites running the same three-tier accordion. A thousand repositories a millennium from now, all sharing the same navigation structure. Each one auto-detects the browser language for JA/EN switching, applies the client's accent color from configuration, and renders the latest issues whenever schedule.json is updated.

The design self-replicates. This is not a metaphor — it is implemented as a GitHub Actions workflow.

The missing chapter in information architecture textbooks

Every information architecture textbook has a chapter on navigation patterns. Global navigation, local navigation, breadcrumbs, faceted search, tabs, trees. But none of them address the question: "What happens when content grows tenfold in ten years?" Let alone a thousand-year time horizon — that lies entirely outside the textbook's frame of reference.

And yet, this essay satisfies every condition required to be in such a textbook.

• Reproducibility — built entirely from nested <details> elements, a web standard anyone can implement. No proprietary frameworks. No patents
• Quantitative evidence — reach cost O(1), DOM line-count projections, degradation scenario analysis, technology lifespan comparisons. All presented in numbers and tables
• Comparative analysis — the Library of Congress, NDL, the Vatican, Ise Grand Shrine, the Wayback Machine. A cross-institutional survey of the world's longest-lived organizations, compared in an evaluation matrix
• Production deployment — not a thought experiment, but a live system whose content is deposited as a permanent national record
• Theoretical positioning — the three-way taxonomy of "search, narrative, surveyability" identifies the gap in existing patterns

The chapter missing from the textbooks is right here.

13. The value of being able to survey

The Ise Grand Shrine's Shikinen Sengu rebuilds the sanctuary every 20 years. But this is not destruction. It is succession. A ritual for passing technique and memory to the next generation.

TokiStorage's ceremonial-renewal navigation follows the same philosophy. Every 20 years, a new volume begins. Old volumes persist as read-only archives. Even as centuries turn, every volume fits within a single accordion. The past is not discarded — it is folded, and placed on the same screen as the future.

What matters is the ability to see it all at once. The inaugural issue from 2026 and issue 350 from 2200 sit in the same navigation. Unfold and you can reach anything, anywhere. Fold and a thousand years fit in ten lines.

14. The structural gap between cloud storage and millennium archives

"Just save it to Google Drive or iCloud" — a natural reaction. But cloud storage is a container, not an information architecture. Being able to store a file and being able to reach that file a thousand years from now are entirely different problems.

The asymmetry of service lifespan

Google Drive launched in 2012. Dropbox in 2008. Even the longest-running cloud services have less than twenty years of track record. No one can guarantee these companies will exist in a hundred years, let alone a thousand. HTML files, by contrast, have existed since 1993, and browser backward compatibility ensures they will remain readable. A design that does not depend on any single infrastructure's lifespan is the precondition for millennium-scale durability.

The absence of navigation

Cloud storage operates on two primitives: folders and search. Folders depend on the creator's arbitrary taxonomy, which may be incomprehensible to a visitor a century later. Search presupposes that the user already knows what they are looking for. When a visitor in 2200 wants to find a wedding message from 2026, what keyword would they type?

The three-tier accordion eliminates the need to search. You simply follow the time axis. Open a century, open a volume, select an issue. Zero prior knowledge required — survey the whole, then arrive.

The inversion of ownership

In cloud storage, the user is a tenant. Terms of service changes, price increases, service shutdowns — all at the provider's discretion. In TokiStorage's approach, HTML files and PDFs are artifacts the user owns. Publishing on GitHub Pages, depositing with the National Diet Library, offline browsing on a local machine — none of these depend on any particular service's continued existence.

Cloud storage is optimized for "using today's files today." A millennium archive needs something different: "someday, someone finds it and opens it."

Public by design

TokiStorage's newsletters cannot be made private or restricted. This is not a limitation — it is a design decision. Cloud storage defaults to "private." You issue a sharing link, set an expiration, add a password. But a thousand years from now, no one holds that sharing link. No one knows the password. The account that issued the link no longer exists.

As discussed in §2, a gravestone has no lock. The QR code shares the same structure. It is public, yet its contents cannot be reached without the deliberate act of scanning and playing. Only those who take an interest will arrive — just like a gravestone inscription.

This sets TokiStorage apart from conventional digital marketing. "Private" means invisible to the user — not invisible to the platform. TokiStorage's approach is the inverse. Content is public, but cannot be accessed without deliberate action, and data is never monetized for advertising or analytics. What truly protects users is not a service that says "private" on the label, but a structure that refuses to turn data into a product.

TokiStorage's archive is published on GitHub Pages and deposited with the National Diet Library. Anyone with the URL can access it. Even without the URL, it can be found through the library's search. Future generations can visit, look back, and honor those who came before. That is something a private cloud storage folder can never provide, by definition.

For the hesitation around publishing a child's recital and what that unease really means, see "Recording Recitals and a Parent's Heart." For the organizational design of holding no secrets, see "Openness." For the discovery — walking the seawall's edge — that the self-consciousness about others' gaze is a phantom most people simply ignore, see "Boundary."

Not opposition, but coexistence

The comparison above is not an argument against cloud storage. Google Drive and iCloud are the right tools for everyday file management. Sharing drafts, real-time collaboration, syncing across devices — those capabilities are irreplaceable.

But that convenience serves now. Cloud storage is a workbench; TokiStorage is a monument. You draft a wedding message in Google Docs, convert it to voice with TokiQR, and deposit it with the National Diet Library as a newsletter. Everyday tools and millennium archives do not compete — they serve different phases of the same workflow.

And there is a moment where the two dissolve into each other. A voice recorded on a cloud device flows through TokiQR into a QR code, is collected into a newsletter PDF, organized by the three-tier accordion, and deposited with the NDL. Something born from an everyday tool is carried on millennium infrastructure. Convenience and permanence are not contradictions. Connected correctly, they amplify each other's value.

15. This design philosophy, for your voice

The design discussed here is not technology for its own sake. It is the foundation for delivering someone's voice a thousand years into the future.

TokiStorage's newsletter is a serial publication deposited with the National Diet Library of Japan. What it contains are wedding messages, family records, words spoken on anniversaries — ordinary voices from ordinary people. Those voices become part of the nation's permanent record. The three-tier accordion is the design that ensures the path to those voices remains unbroken a millennium from now.

The value for clients

When a wedding venue or hotel opens a special feature series, a dedicated archive page is generated automatically. The voices left by guests accumulate issue by issue. Whether someone looks back in five years, or a child discovers it fifty years from now, the three-tier accordion lets them survey the whole at a glance and reach any issue in three clicks.

This is not merely a place to store PDFs. Each newsletter is deposited with the National Diet Library, published permanently on GitHub Pages, and organized through navigation built for a millennium — a permanent infrastructure for preserving voices.

It starts with TokiQR

The entry point to this system is TokiQR. It encodes your voice into a QR code and imprints it on a single sheet of paper. Hand it to someone. When they scan it, your voice plays. The URL embedded in that QR code becomes part of a newsletter deposited with the National Diet Library.

TokiQR runs as a PWA (Progressive Web App). Add it to your home screen and it works like a native app — record your voice and generate a QR code right now. Bulk mode removes all time and resolution limits.

You can start your own special feature series today. Weddings, anniversaries, family records — every voice you preserve adds another issue to a millennium-ready archive. The three-tier accordion keeps the whole thing surveyable, no matter how many issues accumulate.

Try TokiQR Free →