Verifichi larghezza di lettura e caratteri per riga
Con un carattere da 16 px e una colonna da 560 px si ottengono 70 caratteri per riga, dentro l'intervallo da 45 a 75 che rende comoda una lettura lunga. Controlli ogni dimensione di schermo prima di chiudere l'impaginazione. Gratis nel Suo browser.
- Gratis
- Funziona nel suo browser
- Senza registrazione
- I suoi dati restano sul dispositivo
Esegui gratis nel browser
Esempio risolto
- Dimensione del carattere
- 16
- Larghezza della colonna
- 560
- Caratteri per riga
- 70
- Valutazione
- recommended
- Minimo consigliato
- 45
- Massimo consigliato
- 75
La leggibilità tipografica dipende da più fattori rispetto alla semplice scelta di un bel carattere. Una colonna troppo larga può far perdere a Lei il punto di lettura nel passaggio alla riga successiva, mentre una colonna molto stretta interrompe di continuo le frasi. Questo strumento usa la dimensione del font e la larghezza della colonna per stimare i caratteri per riga, quindi segnala se il risultato rientra nell'intervallo comunemente consigliato da 45 a 75. È un supporto rapido per progettare articoli, documentazione, newsletter, dashboard e altri layout dedicati alla lettura prolungata.
Come inserire le misure tipografiche
Inserisca la dimensione del testo principale e la larghezza effettiva della colonna in pixel CSS. Consideri lo spazio realmente disponibile dopo aver sottratto spaziature interne, bordi, note laterali e aree riservate ai controlli adiacenti. Per esempio, una scheda larga 640 pixel con 32 pixel di spaziatura per lato offre ai paragrafi soltanto 576 pixel.
La dimensione deve essere quella calcolata del corpo, non una percentuale di zoom, la misura di un titolo o il nome di un token. Entrambi i valori devono essere numeri finiti positivi; una misura non positiva viene rifiutata perché non descrive testo leggibile. Se il progetto usa rem, li converta tramite la dimensione radice oppure consulti i valori calcolati negli strumenti del browser.
Verifichi separatamente desktop, tablet e telefono, poiché una colonna adattiva può cambiare categoria anche con font invariato. La risposta ripete gli input per consentirLe di registrare ogni configurazione.
Come interpretare la stima per riga
Il calcolo presume che un carattere medio occupi mezzo em, cioè metà della dimensione del font indicata. Divide la larghezza della colonna per questo valore medio e mostra i caratteri per riga con una cifra decimale. È volutamente una stima: la larghezza reale dipende da famiglia, peso, lingua, punteggiatura, spaziatura e parole presenti.
Un carattere condensato può contenerne di più, uno ampio di meno. Lo strumento serve quindi alle decisioni iniziali e a revisioni coerenti, ma non sostituisce la misurazione di un brano rappresentativo con il font definitivo. La classificazione usa il dato non arrotondato: sotto 45 la colonna è troppo stretta, sopra 75 è troppo larga e l'intervallo inclusivo è consigliato.
La risposta espone anche l'ipotesi di 0.5 em e i due limiti. Vicino a un confine, provi contenuti reali e consideri la stima un invito alla verifica visiva, non una regola assoluta di accessibilità.
Come trasformare il risultato in una scelta di layout
Un risultato consigliato indica un buon rapporto fra dimensione e lunghezza della riga per la lettura continua, ma rappresenta solo una parte di un sistema confortevole. Valuti anche interlinea, spazio tra paragrafi, contrasto, resa del font ed esigenze del pubblico. Se la colonna è troppo larga, ne riduca la larghezza massima, aumenti il font quando opportuno oppure ricorra a più colonne soltanto con un ordine chiaro.
Se è troppo stretta, conceda più spazio orizzontale, riduca le spaziature eccessive o verifichi se il testo è troppo grande per il componente. Non riduca il corpo soltanto per superare il controllo, soprattutto su schermi piccoli. Confronti i token tipografici e dei contenitori durante il progetto e ripeta il test dopo l'implementazione, perché griglie e spaziature annidate cambiano la misura utile.
Nei siti multilingue provi ogni sistema di scrittura.
Casi d'uso
Definire la larghezza massima di un articolo
Confronti le larghezze candidate con il corpo prima di scegliere il massimo per desktop.
Controllare i breakpoint adattivi
Verifichi desktop, tablet e telefono per trovare colonne troppo strette o troppo larghe.
Rivedere i token del design system
Provi insieme token tipografici e contenitori per stabilire una base leggibile.
Domande frequenti
Quale intervallo è considerato consigliato?
Lo strumento considera consigliati da 45 a 75 caratteri stimati per riga, estremi inclusi.
Come vengono calcolati i caratteri per riga?
Si presume una larghezza media di 0.5 em e si divide la colonna per metà della dimensione del font.
La misura è esatta per il mio font?
No. Famiglia, peso, lingua, spaziatura e contenuto cambiano i glifi; il dato è una stima.
Una colonna da 560 px è troppo larga per un testo da 16 px?
No. Con 16 px ogni carattere viene stimato in 8 px, quindi 560 px contengono circa 70 caratteri per riga, un valore compreso nell'intervallo consigliato da 45 a 75.
Quale larghezza devo indicare se il riquadro ha un margine interno?
Indichi solo lo spazio occupato davvero dai paragrafi. Una scheda da 640 px con 32 px di margine interno per lato lascia 576 px, ed è questa la misura da verificare.
Strumenti correlati
Per sviluppatori — accesso via API
Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.
Endpoint
Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.
Chiamala dal tuo stack
curl -X POST https://api.kit.forhosting.com/doc/reading-column-width-check \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"font_size":16,"column_width":560}'const res = await fetch("https://api.kit.forhosting.com/doc/reading-column-width-check", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"font_size": 16,
"column_width": 560
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/doc/reading-column-width-check",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"font_size": 16,
"column_width": 560
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/doc/reading-column-width-check", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"font_size":16,"column_width":560}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"font_size":16,"column_width":560}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/doc/reading-column-width-check", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Esempio di richiesta
{
"font_size": 16,
"column_width": 560
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "doc.reading_column_width_check",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.
Prezzi
Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.
Limiti
max_mb | 25 |
max_pages | 200 |
Errori
| HTTP | Codice | Significato |
|---|---|---|
401 | unauthorized | Chiave API mancante o non valida: controlla l'header Authorization. |
402 | insufficient_balance | Credito esaurito: ricarica per continuare a eseguire attività. |
404 | unknown_type | Tipo di attività sconosciuto: controlla il campo type della richiesta. |
429 | rate_limited | Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo. |
Note tecniche
Come trasformare il risultato in una scelta di layout
L'uso nel browser è gratuito; ogni richiesta API automatizzata costa $0.002.
Domande tecniche
Che cosa accade con una dimensione nulla o negativa?
La richiesta fallisce con invalid_input perché la dimensione del font deve essere positiva.
Quanto costa una richiesta API?
Ogni richiesta API costa $0.002; l'uso interattivo nel browser è gratuito.