Testo a capo ottimizzato con attivazione, per migliorare la bellezza piuttosto che la velocità.
A partire da Chrome 117 puoi usare una nuova funzionalità di testo a capo:text-wrap: pretty
di Livello testo CSS 4.
p {
text-wrap: pretty;
}
Vedove e orfani tipografici sono parole singole che si trovano in una posizione indipendente alla fine di un paragrafo o di un blocco di testo. "Vedove" sono parole che appaiono da sole in cima a un blocco di testo, mentre "orfani" alla fine di un blocco di testo. Possono interrompere il modo in cui i nostri occhi scorrono il testo, rendendo i contenuti più difficili da leggere. Alcuni designer le evitano a tutti i costi e fanno di tutto per prevenirle.
A partire da Chrome 117, è possibile evitare la presenza di orfani utilizzando una sola riga di CSS: text-wrap: pretty.
La funzionalità non si limita a garantire che i paragrafi non terminino con una sola parola, ma regola anche la sillabazione se alla fine di un paragrafo compaiono righe consecutive con trattino o regola le righe precedenti per fare spazio. Inoltre, si adatterà in modo adeguato
alla giustificazione del testo. text-wrap: pretty indica il ritorno a capo automatico e l'interruzione del testo generalmente migliori, attualmente focalizzati sugli orfani.
In futuro, text-wrap: pretty potrebbe offrire ulteriori miglioramenti.
C'è anche text-wrap: balance, che non
previene gli orfani, ma garantisce che il testo vada a capo in modo da creare un
blocco di testo armonioso. Personalmente uso balance per i titoli e pretty per
i paragrafi.
Se ti interessano i dettagli dell'algoritmo utilizzato per determinare il numero ottimale di righe o considerazioni sulle prestazioni, ecco un link al documento di progettazione creato dall'ingegnere dietro la funzionalità, Koji Ishii.
Se hai altri suggerimenti o miglioramenti per l'interruzione di riga, ci piacerebbe conoscere la loro opinione. Segnala un problema nel tracker dei bug di Chromium con i dettagli ed esempi di interruzioni di riga corrette e non corrette e ti risponderemo.