Documenti scientifici interattivi con mathpad
mathpad è il formato HTML di Sarmate.net per pubblicare sul web documenti scientifici — corsi di matematica, fisica, chimica, esercizi, verifiche — che sono interattivi e responsive su tutte le dimensioni di schermo. Formule KaTeX, figure JSXGraph manipolabili, tabelle di variazione automatiche, codice Python eseguibile direttamente nella pagina, fogli di calcolo in stile Excel con formule integrate — tutto ciò che un PDF non sa fare. Tutto si modifica tramite l'editor online ottimizzato per mathpad.
Che cos'è mathpad esattamente?
Una raccolta di tag HTML semantici (<mp-course>, <mp-definition>, <mp-theorem>, <mp-vartable>, <mp-jsxgraph>…) che un leggero runtime JavaScript (mathpad.js) trasforma in blocchi pedagogici completamente stilizzati — con numerazione automatica, temi, navigazione, KaTeX e frecce SVG per le tabelle di variazione.
$…$ come in LaTeX — vengono renderizzate nel browser senza immagini (selezionabili, indicizzabili).<mp-jsxgraph>, integri figure manipolabili (spostare punti, cursori) — grafici di funzioni, geometria, probabilità, renderizzate direttamente nel browser.<mp-code runnable>, integri Python con un pulsante verde « Run ». Il lettore modifichi il codice, clicca, vede il risultato — turtle e pygame inclusi. Impossibile in un PDF.<mp-spreadsheet> integra una griglia modificabile con formule (SOMMA, MEDIA, MIN, MAX, riferimenti A1, $A$1) — il lettore riempie le celle e vede le formule ricalcolarsi in tempo reale.A chi si rivolge mathpad?
- Insegnanti di matematica e scienze che vogliono pubblicare i loro corsi online senza produrre PDF illeggibili sullo smartphone
- Autori di opere scientifiche che cercano un formato vivo con tabelle di variazione, figure JSXGraph, correzioni comprimibili
- Studenti di classi preparatorie o universitari che condividono i loro appunti in un formato presentabile — basta con i Word, basta con i PDF resi male
- Editori e organismi di formazione online che vogliono un formato indicizzabile, leggero, accessibile
Creare un file mathpad
Aprire il suo drive
Acceda e apra il suo drive.
Creare un nuovo file HTML
Fai clic su Nuovo file e selezioni HTML (.html). I tag mathpad funzionano in qualsiasi file HTML che carichi mathpad.css e mathpad.js.
Nominare il suo file
Ad esempio fonctions-affines.html o chap1-suites.html.
Lo scheletro minimo
Ogni file mathpad ha la stessa intestazione: KaTeX (per le formule) e mathpad.css / mathpad.js (per i tag <mp-*>).
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8">
<title>Il mio corso</title>
<link rel="stylesheet" href="https://www.sarmate.net/mathpad/mathpad.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"
onload="renderMathInElement(document.body)"></script>
<script defer src="https://www.sarmate.net/mathpad/mathpad.js"></script>
</head>
<body>
<mp-course lang="it" theme="ocean">
<!-- Il suo contenuto qui -->
</mp-course>
</body>
</html>
<mp-course>?
È il tag radice — attiva il sistema di temi, la numerazione automatica dei blocchi (Definizione 1, Teorema 2…) e la barra di navigazione in basso. L'attributo theme accetta: ocean, foret, lavande, corail, rose, ardoise, sepia, nuit. Il suo primo «Hello world»
Ecco un esempio completo di 20 righe con un titolo, una definizione e una formula KaTeX:
<mp-course lang="it" theme="ocean">
<mp-meta>
<mp-doc-title>Funzioni affini</mp-doc-title>
<mp-author>Nome Cognome</mp-author>
<mp-date>2026-08-24</mp-date>
</mp-meta>
<mp-chapter><mp-title>Definizione e proprietà</mp-title>
<mp-section><mp-title>Definizione</mp-title>
<mp-definition><mp-title>Funzione affine</mp-title>
Una funzione $f$ definita su $\mathbb{R}$ è affine quando esistono due numeri reali $a$ e $b$ tali che, per ogni $x \in \mathbb{R}$, $$f(x) = ax + b.$$
</mp-definition>
</mp-section>
</mp-chapter>
</mp-course>
Salvi il file e apra l'anteprima nell'editor: vedrai un titolo stilizzato con gradiente, un titolo di capitolo e di sezione numerati, un blocco blu «Definizione 1» e la formula resa da KaTeX.
Due scorciatoie che fanno risparmiare molto tempo
Il seguito logico
Questa documentazione copre ogni aspetto di mathpad. Ecco il percorso consigliato:
- Struttura di un documento — mp-course, mp-chapter, mp-section, mp-toc
- Matematica (KaTeX) — $…$ vs $$…$$, mp-align, errori comuni
- Blocchi formali — definition, theorem (+ROC), property, proposition, lemma, proof
- Blocchi pedagogici — example, activity, exercise, correction, method, remark, warning
- Presentazione — mp-box, mp-figure, mp-blank
- Tabelle e variazioni — mp-spreadsheet, mp-vartable con frecce automatiche
- Grafici interattivi — mp-jsxgraph
Pronto a provare mathpad?
Crei il suo primo documento scientifico in HTML nell'editor online, o importi il suo corso LaTeX esistente con un solo clic.