404

Link in evidenza

1. Documentazione Shopify sull’editor del tema
2. Documentazione di Company XYZ sulle impostazioni del padding della sezione
3. Documentazione di Company XYZ sulle impostazioni degli sfondi della sezione
4. Documentazione di Company XYZ sulle impostazioni dei separatori
5. Documentazione di Company XYZ sulle impostazioni delle larghezze del layout

Video utili

Video Shopify Academy: personalizzare il tuo negozio

Video Shopify Academy: personalizzare il tuo negozio

Questa sezione controlla la presentazione della tua pagina 404. Il contenuto del messaggio viene gestito nell’editor dei contenuti predefinito del tuo tema, mentre le impostazioni qui consentono di definire lo stile visivo e il layout della pagina. Per la configurazione e la navigazione nell’editor, consulta documentazione Shopify sull’editor del tema

Contenuto

Usa l’editor dei contenuti predefinito del tuo tema per modificare il messaggio di pagina non trovata stesso. Questa sezione è utile soprattutto per regolare l’aspetto di quel messaggio sulla pagina, inclusi colori, spaziatura e layout circostante.

Nota

Se la pagina continua a sembrare generica dopo averla stilizzata, aggiorna anche il messaggio predefinito. Una presentazione efficace funziona meglio quando anche il testo è altrettanto intenzionale.

Impostazioni colore

Queste impostazioni sostituiscono i colori generali del tema solo per questa sezione. Sono utili quando la tua pagina 404 necessita di un contrasto più forte, di un tono più morbido o di un aspetto più distintivo senza modificare il resto del sito.

Regola insieme i colori del testo e del sottotitolo, soprattutto se aggiungi uno sfondo personalizzato. Se la sezione usa uno sfondo più scuro o più dettagliato, rivedi entrambi i colori per mantenere il messaggio leggibile a colpo d’occhio.

Controlla il contrasto dopo aver modificato gli stili di testo e sfondo. Una pagina 404 è spesso composta soprattutto da testo, quindi un contrasto basso può renderla rapidamente più difficile da usare.

Impostazioni standard della sezione

Impostazioni di padding

Impostazioni di padding controllano lo spazio sopra e sotto il contenuto 404 su desktop e mobile. In una pagina breve come questa, la spaziatura influisce molto sul fatto che il layout risulti bilanciato o vuoto in modo strano.

Usa un padding mobile più ridotto se la pagina sembra troppo alta sui telefoni. Aumenta il padding desktop quando il contenuto appare troppo compresso o troppo vicino agli elementi della pagina vicini.

Impostazioni dello sfondo sezione

Impostazioni dello sfondo sezione ti consentono di aggiungere un colore, un gradiente, un’immagine o un video dietro il messaggio di pagina non trovata. Le impostazioni di overlay aiutano a mantenere il contenuto leggibile quando usi media di sfondo.

I gradienti sostituiscono i colori pieni e i gradienti di overlay sostituiscono i colori di overlay. I valori vuoti o trasparenti di solito conservano lo stile di fallback della sezione, mentre colori, gradienti o media espliciti rendono l’area 404 visivamente più indipendente dal resto della pagina.

Se usi un’immagine o un video, mantienili discreti in modo che la pagina continui a sembrare un messaggio utile e non un elemento visivo. I media possono anche influire su ritaglio, caricamento, fallback e leggibilità, soprattutto quando i media desktop e mobile sono configurati separatamente.

Consiglio

In genere un gradiente delicato o un’immagine con pochi dettagli funziona meglio di media troppo affollati in una pagina 404.

Impostazioni dei separatori

Impostazioni dei separatori aggiungono una linea nella parte superiore o inferiore della sezione. Questo può aiutare la pagina 404 a sembrare incorniciata in modo più intenzionale, soprattutto quando si trova all’interno di un layout di pagina più ampio.

Se lasci il colore del separatore trasparente, la sezione usa il colore del bordo del tuo tema. Nella maggior parte dei casi, un separatore discreto funziona meglio di uno molto marcato.

Impostazioni di larghezza

Impostazioni di larghezza controllano la larghezza dell’area del contenuto e del contenitore esterno della sezione. Questo è particolarmente utile per mantenere facile da leggere un testo breve o per dare più spazio alla visualizzazione degli sfondi.

Per la maggior parte delle pagine 404, una larghezza del contenuto moderata risulta più leggibile di un layout molto ampio. Se modifichi la larghezza della sezione mentre usi uno sfondo, visualizza l’anteprima del risultato nella vista live della vetrina perché le anteprime dell’editor possono rendere le modifiche di larghezza meno precise.

Note sull’uso

1. Stilizza insieme messaggio e design. Aggiorna il testo 404 predefinito così come il design della sezione, in modo che la pagina sembri intenzionale e non un fallback.
   1. Mantieni il testo chiaro e diretto.
   2. Assicurati che il trattamento visivo supporti lo stesso tono.
2. Mantieni il testo facile da scansionare. Scegli combinazioni di colori e larghezze che rendano il messaggio leggibile rapidamente sia su desktop sia su mobile.
3. Usa gli sfondi con moderazione. Scelte di colore, gradiente, immagine o video discrete supportano il messaggio meglio di elementi visivi troppo appariscenti.
4. Bilancia la spaziatura. Regola il padding in base a quanto contenuto mostri, così la pagina risulta rifinita invece che vuota o troppo compressa.
5. Fai un’anteprima su schermi reali. Controlla il risultato finale nella vetrina, soprattutto dopo aver modificato larghezza, media di sfondo o spaziatura mobile.
6. Rivedi entrambe le dimensioni del viewport. I controlli desktop e mobile possono produrre comportamenti diversi di allineamento, visibilità e media, quindi verifica la pagina 404 su entrambe le dimensioni prima della pubblicazione.