STENO | Structured TErse NOtation
STENO.

STENOTM

Structured TErse NOtation
Public spec & reference implementation · Coming Soon

A next-generation markup & data language.
One human-friendly, AI-friendly source.
Free and open by design. HTML/CSS/JS and JSON become the output, not the starting point.

STENO is an advanced markup language with template-engine capabilities and, more technically, a declarative Domain-Specific Language (DSL) for next-generation HTML/CSS output and compact representation of structured data. It is designed for building pages and web applications where interface and data are described coherently inside the same source.

The name STENO comes from the acronym Structured TErse NOtation and deliberately echoes stenography: just as shorthand writing lets you capture full sentences with a few signs, STENO lets you define complete web interfaces and complex datasets using an extremely compact notation — both compared to traditional HTML/CSS/JS and to verbose, repetitive JSON structures.

The core purpose of STENO is threefold:

1. Radically reduce the amount of code required.
STENO removes the intrinsic redundancy of HTML and conventional data formats through smart conventions, sensible defaults and a syntax that can express in a few lines what normally demands dozens of tags or repeated JSON objects.

2. Unify structure, presentation and data.
Instead of rigidly separating HTML (structure), CSS (style), JavaScript (behavior) and JSON (data), STENO integrates these aspects into a single coherent syntax. From one STENO file you can generate markup HTML, CSS styles and configurations or data collections exportable as JSON or other formats.

3. Democratize web development.
Thanks to a gentle learning curve, designers, content creators and junior developers can quickly assemble professional interfaces without first wrestling with the full complexity of HTML, CSS, JavaScript and JSON. STENO becomes a more human intermediate layer, compilable down to the underlying technologies.

STENO itself will remain free and open. Around it, a growing ecosystem of optional tools and integrations will focus on productivity, not on locking you in.

Designed for humans. Obvious to AI.

STENO was born as a shorthand for complex interfaces and datasets. Its compact, regular notation is not only easier for humans to read, but also dramatically simpler for AI systems to parse, generate and refactor compared to a tangle of HTML, JavaScript and JSON.

One coherent language means a single source of truth for both people and machines. Whether you are hand-writing STENO or letting an AI model propose entire sections for you, the result stays aligned: what you see is the intent of the interface, not its plumbing.

HTML/CSS/JS + JSON vs STENO, at a glance

Same result, different path. These are typical orders of magnitude from real-world tests: the same interface and the same data, expressed once in a traditional stack and once in STENO.

Scenario HTML/CSS/JS + JSON STENO
Marketing landing page ~8,000 characters, ~400 lines,
3–5 separate files (HTML, CSS, JS).
~2,000 characters,
~80 STENO lines,
1 STENO source.
Product dataset (100 items) Repeated JSON keys for every item,
verbose payload and larger transfers.
Compact, tabular STENO notation,
~100 data rows,
1 STENO header line for the whole dataset.
Hero with animations Markup + CSS + JS + optional libraries,
spread across multiple files and configs.
Structure, style, motion and data
in a few STENO lines in a single file.
Numbers from early STENO real-world experiments

Concrete examples: same UI, fewer lines

Same component, different footprint. These are the kind of differences you see when you translate real pieces of UI to STENO.

Call-to-action button
Classic stack

6–15 lines across markup, utility classes and small JS helpers, usually in 2–3 different files.

STENO

1 single STENO line.

Product card
Classic stack

20–40 lines of HTML, classes and JSON data, plus optional JS for hover and interactions.

STENO

3–5 STENO lines.

Product table (100 items)
Classic stack

Dozens of HTML table rows plus a large JSON payload with repeated keys for each product.

STENO

1 STENO header line + 100 STENO data lines.

Imagine your next project starting in STENO,
not in HTML/CSS/JS and JSON…

-80%
The same landing page, the same dataset, in a fraction of the characters. Less typing, less noise, less time spent wiring templates, styles and JSON together.
1 FILE
Layout, components and data live in one place. You think in sections and collections, STENO compiles them into HTML/CSS/JS and structured JSON when you’re ready to ship.
Human
A notation that stays readable at a glance, even months later. Less boilerplate to scan, fewer files to keep in your head, more focus on what the interface should actually do.
Markup + Data, Together
Describe sections, components and the data they consume in a single STENO source. Stop duplicating intent across HTML templates, CSS files, scripts and JSON configs.
Less Code, Same Power
Thanks to conventions and defaults, STENO routinely cuts 70–85% of the characters compared to equivalent HTML/CSS/JS and JSON, while keeping explicit control where it matters. Its regular, high-density syntax is also ideal for AI-assisted generation and refactoring.
Built for Real Teams
A language that designers, content creators and developers can all understand. STENO becomes the shared shorthand for your interface, before it turns into code. The core language is free; how you work with it is up to you.
🧠
AI-Native Language
STENO’s compact, highly regular syntax is built for machines as much as for humans. Models can generate, refactor and optimize STENO with far less noise than raw HTML, CSS, JS and JSON, turning AI into a natural extension of your editor.
From Language to Ecosystem
STENO, the language, stays free and open. Around it you can plug in compilers, editors, plugins and CI flows as you like. Use it as a lightweight layer over your existing stack today, and grow into a full ecosystem tomorrow—without changing the way you write.

The Weight of Code & Data

Same page, same dataset. Fewer files, fewer lines, fewer bytes on the wire.

HTML + CSS + JS + JSON
-90%
STENO

Typical savings from early real-world experiments:
• from ~400 lines across 3–5 HTML/CSS/JS files to ~80 lines in a single STENO source for a landing page;
• from dozens of table rows plus repeated JSON keys to a handful of STENO lines for product lists and dashboards;
• from scattered snippets for each CTA button to one STENO line per interaction.

What normally needs markup, CSS, JS and JSON becomes a single layer of notation.

Smaller payloads Fewer files Structure Styling Behavior Scroll Animation Parallax Hover Effects Staggered Grids Typed Data Loops

© 2025 STENO™ Language Organization.

Attenzione: alcune funzionalità di questa pagina potrebbero essere bloccate a seguito delle tue scelte privacy: