Senza HTML · Senza CSS · Senza JavaScript da scrivere
Un Editor Che Chiede di Configurare, Non di Programmare
Qui costruire vuol dire trascinare un blocco sulla tela e impostarne le proprietà, non aprire un editor di testo. Questa pagina traccia il confine con onestà: quali parti di un sito sono davvero solo configurazione, a chi serve bene questo modo di lavorare, e cosa succede il giorno in cui l'idea richiede qualcosa che il registro dei blocchi non prevede.
La palette è il vocabolario intero, non un punto di partenza
Una promessa "senza codice" vale quanto ciò che sta nella barra laterale, quindi conviene partire da lì. Il registro dei componenti conta 37 tipi di blocco, e 34 si trascinano direttamente dalla palette, divisi in quattro categorie: struttura, contenuto, modulo e navigazione. Questo è l'intero vocabolario per montare una pagina: non esiste un caso in cui finire una sezione richieda di toccare il markup perché il pezzo necessario non esiste come blocco.
Le quattro categorie coprono cose diverse. I blocchi di struttura danno i contenitori e le griglie con cui si organizza la pagina. Quelli di contenuto sono titoli, paragrafi, immagini e il resto di ciò che chi visita il sito legge. Quelli di navigazione montano il menu e i suoi link. I blocchi modulo — campo di testo, area di testo, etichetta e pulsante di invio — permettono di montare un modulo di contatto o di prenotazione trascinando i campi e attivando la validazione dalle impostazioni, senza scrivere uno script; questo non afferma che l'invio arrivi da qualche parte, perché dipende da un server che questa demo non esegue.
- 34 tipi di blocco nella palette di trascinamento, dei 37 presenti nel registro completo, divisi in struttura, contenuto, modulo e navigazione.
- I tre mancanti sono pezzi di un composito, non blocchi a sé: elemento di accordion, valore statistico e tab esistono solo dentro il proprio accordion, il proprio blocco statistiche o il proprio gruppo di tab, e si aggiungono da lì, non trascinati per conto proprio.
- I 17 temi già pronti si applicano senza aprire un foglio di stile.
Lo stile si regola in un pannello, non in un foglio di stile
Il design visivo è il secondo punto in cui una promessa "senza codice" di solito si rompe, e qui invece tiene. Ogni elemento ha un ispettore con controlli di stile al posto di un file CSS da modificare a mano, e quei controlli si applicano per breakpoint: la barra degli strumenti offre cinque larghezze — mobile, mobile grande, tablet, laptop e desktop — e una modifica fatta a una di esse non si riversa sulle altre a meno che non la si ripeta di proposito. Rendere un titolo più piccolo sul telefono e più grande sul desktop sono due impostazioni, non una media query.
Il testo ha una propria barra, separata dal pannello di stile del blocco: grassetto, corsivo, barrato, un link, tre livelli di titolo ed entrambi i tipi di elenco, lo stesso insieme che offre un elaboratore di testi. Tra le due cose — stile del blocco per breakpoint e formattazione del testo in linea — le decisioni di impaginazione, spaziatura e tipografia che altrove starebbero in un foglio di stile si prendono negli stessi pannelli usati per posizionare il blocco.
Le interazioni sono un'impostazione, non un tag script
La parte di un sito che più chiaramente sembrava richiedere codice è quella che si muove: un menu che si comprime, un'immagine che si apre più grande, una sezione che appare durante lo scroll. Builder42 include 17 di questi comportamenti come voci del registro: accordion, carosello, conteggio animato, espandibile, validazione dei moduli, lightbox, marquee, modale, barra di navigazione, parallax, apparizione allo scroll, avanzamento dello scroll, scroll spy, elemento fisso, tab, cambio tema e interruttore semplice. Aggiungerne uno a un blocco è un'impostazione su quel blocco, non un frammento incollato a mano.
Ciò che accade in esportazione conta quanto ciò che accade sulla tela. Ogni comportamento effettivamente usato viene scritto nel download come JavaScript semplice, senza alcun framework: una pagina che non ne usa nessuno non porta alcun file di script, e una che ne usa tre porta esattamente quei tre moduli più il caricatore che li collega. Non è un modello generico da adattare in seguito; l'impostazione fatta nell'ispettore è ciò che lo script esportato esegue.
A chi serve bene un flusso di palette e pannelli
Questo tipo di strumento serve particolarmente bene un lavoro preciso: chi ha un'idea chiara della pagina che vuole — il menu e le prenotazioni di un ristorante, i servizi e il modulo appuntamenti di una clinica, il listino di una barbieria — e preferisce montarla con pezzi già pronti piuttosto che aprire un progetto di codice per una sola pagina. I siti multipagina fanno parte naturale dello stesso flusso: un sito può contenere più pagine, aggiunte e rinominate dallo stesso pannello che gestisce tutto il resto, e se il pubblico legge più di una lingua, le lingue di contenuto si aggiungono allo stesso modo, ognuna esportata come proprio insieme di pagine.
Serve a quel lavoro proprio perché la palette non presuppone alcuna preparazione precedente. Trascinare un blocco, scegliere una categoria, regolare una proprietà e controllare il risultato a un breakpoint sono gli stessi quattro gesti per un titolo, un modulo, una galleria o un conto alla rovescia, quindi la curva di apprendimento è un'unica abilità ripetuta, non un'abilità diversa per ogni funzione. Ciò che non copre è una pagina la cui idea centrale è un meccanismo che nessuno ha registrato come blocco, che è esattamente dove inizia la sezione successiva.
Dov'è il limite, e come uscirne
Essere onesti su uno strumento senza codice significa nominare il suo confine, non solo la sua portata. Se ciò che serve non è uno dei 37 tipi di blocco registrati, né uno dei 17 comportamenti, né una proprietà esposta in un pannello dell'ispettore, trascinare e cliccare non lo produrrà — è vero per qualsiasi editor basato su un registro, e far finta del contrario costerebbe solo un pomeriggio a cercare un'impostazione che non esiste.
La via d'uscita da quel confine è incorporata, non aggiunta dopo, ed è il download stesso. Quello che arriva sul tuo computer è HTML, CSS e JavaScript comuni, senza alcun framework: il tipo di codice che qualsiasi sviluppatore può leggere e ampliare a mano, non un formato proprietario che chiude l'ultimo tratto dentro questo editor. Quindi il limite è reale senza essere un vicolo cieco: il lavoro esce da qui nei linguaggi che il web già parla, e chi lo riprende dopo non deve impararne uno nuovo prima.
Due argomenti restano appena oltre questo confine e ricevono una sola frase, senza una propria sezione: cosa contiene l'archivio esportato, file per file, è il compito della prossima guida, e dove vive una bozza mentre si lavora — qui, senza account, nello stesso browser che si sta usando — è quello della guida precedente. Entrambe vale la pena leggerle se il limite del «senza codice» è ciò che si vuole capire.
Quattro pagine aziendali che un flusso senza codice copre bene
Le prenotazioni e il menu di un ristorante, i servizi e i prezzi di una barbieria, i trattamenti e il modulo appuntamenti di una clinica dentale, gli orari e le recensioni di una spa: nessuna ha richiesto una riga di codice, e ognuna è una pagina completa da apri e smontare.
Le domande che arrivano prima
C'è qualcosa che devo scrivere come codice per finire una pagina normale?
No. Posizionare i blocchi, impostarne le proprietà, dar loro uno stile per breakpoint e aggiungere un comportamento avviene tutto tramite pannelli. Il codice compare dopo, nel sito che scarichi, e solo se vai a cercarlo: niente nel percorso di creazione ti chiede di scriverlo.
Posso montare un modulo di contatto o di prenotazione senza scrivere uno script?
Sì, fino al punto di montarlo e validarlo. Il registro ha blocchi di campo di testo, area di testo, etichetta e pulsante di invio, e la validazione è un comportamento che si attiva dalle impostazioni, non codice che si scrive. Dove arrivi l'invio dipende da un server, e questo sito statico non ne ha uno.
Cosa succede se il blocco di cui ho bisogno non è nella palette?
A quel punto trascinare e cliccare non bastano più, che è il limite onesto di qualsiasi editor basato su un registro. Quello che scarichi è HTML, CSS e JavaScript comuni, così chi sa programmare può continuare esattamente da dove finisce la palette.
Devo conoscere il CSS per far vedere bene la pagina a dimensioni diverse?
No. L'ispettore applica le modifiche di stile per breakpoint — mobile, mobile grande, tablet, laptop e desktop — con gli stessi controlli usati per qualsiasi altra proprietà, così regolare un titolo per il telefono è un'impostazione, non una media query.
Le parti interattive, come un accordion o un modale, sono già pronte o vanno montate?
Sono già pronte: sono 17 comportamenti — tra cui accordion, modale, carosello e apparizione allo scroll — che si attivano su un blocco dalle sue impostazioni. Solo quelli che una pagina usa davvero vengono scritti nell'esportazione, come JavaScript semplice e senza framework.