Nano Banana 2.1 ONLINE — L'ultimo di Google | Provalo →
WAVESPEED AI TESTER RESPONSIVE Il tuo codice resta sul tuo dispositivo
100% GRATIS

Tester di design responsive gratuitoGuarda la tua pagina in tutte le dimensioni di schermo contemporaneamente.

Inserisci l'indirizzo di un sito web o incolla il tuo HTML e visualizzalo in cornici grandi quanto veri schermi di smartphone, tablet, laptop e desktop, affiancate o una alla volta.
Trascina una cornice a qualsiasi larghezza, ruotala, passa tra i breakpoint più comuni, individua i contenuti che sbordano lateralmente e salva gli screenshot del tuo HTML.

Oltre 40 dimensioni di schermoVista affiancataRilevamento overflow
Senza registrazione Nessun proxy Senza filigrana

Caricamento del tester…

L'HTML incollato resta nel tuo browser. I siti web si caricano direttamente dai loro server.
TRE SEMPLICI PASSAGGI

Come testare un design responsive

01

Aggiungi la tua pagina

Digita l'indirizzo di un sito web, oppure passa a HTML e incolla il tuo codice o apri un file .html. La pagina di esempio mostra come funziona.

02

Scegli gli schermi

Guarda un solo dispositivo e trascinane i bordi, oppure metti affiancati smartphone, tablet, laptop e desktop. Ruota quello che vuoi.

03

Correggi e cattura

Leggi gli avvisi sui contenuti più larghi dello schermo, modifica il tuo HTML e guarda ogni cornice aggiornarsi, poi salva gli screenshot.

Consigli per layout che reggono a ogni dimensione

Parti da 320 pixel

Gli smartphone più stretti in uso sono larghi da 320 a 360 pixel CSS. Se il layout regge lì, regge quasi ovunque.

Trascina, non limitarti a scegliere dispositivi

I layout si rompono anche tra un dispositivo e l'altro. Trascina lentamente la cornice da stretta a larga e osserva il momento in cui qualcosa salta o si sovrappone.

Non dimenticare mai il tag viewport

Senza <meta name="viewport" content="width=device-width, initial-scale=1"> i telefoni impaginano la pagina a circa 980 pixel di larghezza e la rimpiccioliscono finché il testo diventa minuscolo.

WaveSpeed AI

Dal layout alle immagini

Quando la pagina funziona a ogni dimensione, crea le immagini e le clip che le servono con WaveSpeed AI.

  • Oltre 1.000 modelli AI
  • Immagini, video e 3D
  • Paghi a consumo

$1 in crediti gratuiti per i nuovi account idonei. Nessuna carta richiesta. I generatori hanno requisiti separati di account e crediti. Questo strumento è gratuito: Tester responsive.

Domande frequenti sul tester responsive

Questo tester di design responsive è gratuito?

Sì. Nessun account, nessun limite di dispositivi o pagine, nessuna filigrana sugli screenshot e niente da installare: funziona nel browser.

Come provo il mio sito web su diverse dimensioni di schermo?

Inserisci l'indirizzo del tuo sito o incolla il tuo HTML, poi scegli tra oltre 40 dimensioni di smartphone, tablet, laptop e desktop, una alla volta o affiancate. Trascina una cornice a qualsiasi larghezza, ruotala o passa ai breakpoint più comuni.

Quanto sono precise le dimensioni dei dispositivi?

Ogni cornice è una viewport del browser con la larghezza e l'altezza esatte di quello schermo in pixel CSS, quindi media query, layout e breakpoint rispondono proprio come su quel dispositivo.

Posso testare il mio HTML o un sito locale?

Sì. Incolla il tuo HTML o apri un file .html per vederlo in anteprima a ogni dimensione e modificarlo dal vivo. I siti web si caricano via https; per un server di sviluppo locale usa un tunnel https o incolla l'HTML generato.

Trova i problemi di layout?

Sì. Nel tuo HTML segnala gli elementi più larghi dello schermo, la causa tipica dello scorrimento laterale sugli smartphone, e avvisa quando manca il meta tag viewport.

Posso salvare gli screenshot?

Sì, per l'HTML incollato: salva l'area visibile o la pagina intera come PNG al rapporto pixel del dispositivo, così una cornice larga 393 pixel a 3x produce un'immagine larga 1179 pixel.

Cosa significa l'etichetta del rapporto pixel?

Gli smartphone racchiudono da due a quattro pixel fisici in ogni pixel CSS. L'etichetta mostra questo rapporto e gli screenshot dell'HTML incollato vengono salvati con esso, così hanno la stessa nitidezza dello schermo reale.

La mia pagina passa dai vostri server?

No. Un sito web viene caricato dal tuo browser direttamente dal suo server, dentro le cornici, senza proxy in mezzo. L'HTML incollato e gli screenshot restano nel tuo browser; l'ultima pagina e le impostazioni vengono conservate nello spazio di archiviazione di questo browser.

Perché un sito web resta vuoto?

Alcuni siti scelgono di non essere mostrati all'interno di altre pagine. Apri "Perché è vuoto?" per controllare le intestazioni del sito, oppure incolla l'HTML della pagina.

Tutti gli strumenti gratuiti

Controlla il tuo layout a ogni dimensione

Incolla il tuo HTML o inserisci un indirizzo e confronta smartphone, tablet e desktop affiancati.

Apri il tester