Questo è l'articolo che avrei voluto trovare quando ho sentito parlare di Webflow per la prima volta.
In una sera di vento del 2017, al terzo caffè, mi ritrovai a sbattere la testa cercando di capire come creare un sito web personalizzato usando HTML e CSS.
I template preconfezionati non mi soddisfacevano, e volevo costruire un sito completamente su misura — senza dover imparare a programmare.
Dopo qualche ricerca su Google, mi imbattei in Webflow per la prima volta. Entusiasta, mi iscrissi.
Ma poco dopo capii che questo non era il solito costruttore di siti. Frustrato dalla curva di apprendimento, mollai tutto.
Sarebbe passato quasi un anno prima che, lavorando in un'agenzia di marketing, avrei trovato la nostra creative director che costruiva i siti dei clienti con Webflow. Il suo entusiasmo per la piattaforma mi incuriosì, e decisi di dare a Webflow un'altra possibilità.
Questa volta avrei provato a trasferire proprio questo sito da WordPress a Webflow per vedere cosa sarebbe successo. Quattro anni dopo, non sono mai tornato indietro.
Mi sono innamorato talmente tanto della piattaforma che ho finito per lavorare nel team marketing di Webflow per diversi anni, ma questa è un'altra storia.
Sono però pienamente consapevole che Webflow potrebbe non fare per tutti.
In questo articolo ti darò una recensione completa (e dettagliata) di cosa sia davvero Webflow, la direzione in cui si sta muovendo l'azienda, se fa davvero al caso tuo, e com'è costruire siti web con questa piattaforma.
Parlerò anche del mio rapporto complicato con la piattaforma e del vero motivo per cui ho deciso di darle un'altra chance.
Questa potrebbe essere un po' diversa dalla solita recensione di Webflow che trovi online. Principalmente perché ho avuto la possibilità di lavorare internamente a Webflow, quindi potrei avere una prospettiva diversa rispetto al tipico blogger che recensisce strumenti web.
Se sei davvero serio nel voler sapere di più su Webflow, ti incoraggio a leggere questo articolo fino in fondo. Sì, è molto lungo. Ma ho impiegato giorni a metterlo insieme per non lasciare nulla di intentato. È l'articolo che avrei voluto trovare quando ho scoperto Webflow per la prima volta.
Ecco alcuni degli argomenti che tratteremo, sono tanti:
- Cos'è Webflow?
- Webflow è davvero buono?
- Webflow è adatto agli sviluppatori web?
- Webflow è adatto ai web designer?
- Webflow è buono per SEO e marketing?
- 6 tipi diversi di siti che puoi costruire con Webflow
- Come funziona: l'ecosistema Webflow spiegato
- Il set di funzionalità del prodotto Webflow
- Tutte le risorse di Webflow
- Quanto costa davvero Webflow?
- Piani workspace vs piani sito
- Chi dovrebbe usare Webflow? Fa per te?
- Webflow è difficile da usare?
- Come imparare Webflow velocemente
Pronti? Si parte!
Cos'è Webflow?
Webflow è una piattaforma visuale di sviluppo web che permette ai designer di costruire siti web completamente personalizzati e professionali in un'interfaccia simile a Photoshop — senza dover sapere come programmare.
Se dovessi spiegarlo in parole semplici, immagina che Photoshop e WordPress si fossero messi insieme e avessero avuto un figlio. Ecco, quello sarebbe Webflow.
Webflow è apparso al pubblico per la prima volta nel 2013, quando i co-fondatori lanciarono un prototipo dello strumento su Hacker News. Il prototipo era una versione semplificata di quello che è Webflow oggi — uno strumento di web design che ti permette di scrivere visualmente HTML, CSS e JavaScript.
Anche se può sembrare che Webflow sia spuntato dal nulla nell'ultimo decennio, il CEO Vlad Magdalin aveva avuto l'idea originale già nei primi anni 2000. Aveva tentato di avviare l'azienda più volte mentre cresceva una famiglia e lavorava a tempo pieno.
Ma fu solo nel 2013 che Vlad si unì ad altri due soci e i tre co-fondatori si candidarono a Y Combinator per ottenere il loro primo round di investimento. Un risultato davvero impressionante e ispirazionale.
Certo, esistevano piattaforme come Adobe Dreamweaver o Muse, ma nessuna si avvicinava alla flessibilità e al codice pulito e semantico conforme agli standard W3C che Webflow offriva.
Nei primi anni, il prodotto Webflow era solo il Designer (ci arriveremo tra poco). Fu solo nel 2015 che venne lanciato il CMS di Webflow. Questo cambiò tutto.
Con l'aggiunta di un CMS (content management system), era ora possibile progettare con dati reali in Webflow — non più solo semplici pagine web. Si potevano creare blog, siti directory, o qualsiasi sito che richiedesse contenuti dinamici.
Ecco il loro video pubblicitario per Webflow CMS del 2015:
Avanzando veloce fino ad oggi, Webflow è il principale costruttore no-code con una valutazione multimiliardaria — dotato di funzionalità ecommerce, logic e membership per gli utenti.
Webflow è sulla strada per diventare una piattaforma dove puoi creare software senza sapere come programmare. Oggi puoi letteralmente ricostruire web app come Airbnb in Webflow.
Unicorn Factory, un marketplace per freelance, è attualmente costruito interamente con Webflow, e questo dovrebbe già dirti qualcosa sulla potenza di questa piattaforma.
Webflow è davvero buono?
Sì, Webflow è uno dei migliori strumenti sul mercato per progettare e costruire siti web completamente personalizzati e dinamici in un'interfaccia drag and drop.
Se sei un designer, Webflow ti permetterà di trasformare i tuoi design web personalizzati in siti web completamente funzionali e su misura. Se sei uno sviluppatore, Webflow ti permetterà di costruire rapidamente prototipi ed esportare HTML, CSS e JavaScript puliti.
La cosa fantastica di Webflow, e ciò che lo distingue dalla maggior parte dei costruttori di siti e landing page, è che è una piattaforma guidata dalla community.
Fin dall'inizio, Webflow ha ascoltato i suoi clienti e aggiunto funzionalità alla piattaforma provenienti direttamente dalla loro wishlist.
La Webflow Showcase (ne parleremo più avanti) è anche piena di web designer che creano diversi componenti Webflow. Nella showcase puoi trovare diversi asset di design che puoi clonare e usare nei tuoi progetti.
Webflow ha una delle community più forti tra tutte le aziende software, rendendo facile trovare una grande quantità di template per siti web, UI kit e risorse su come usare la piattaforma per diversi casi d'uso.
Inoltre, molte grandi aziende hanno iniziato a usare Webflow — Upwork, Discord, Metamask (oltre 12 milioni di visitatori al mese), Adobe, Michael Kors e Chipotle, solo per citarne alcune.
Si può tranquillamente affermare che Webflow è una piattaforma di cui ci si può fidare.
Verso la fine di questo articolo, menzionerò quali risorse puoi usare per imparare Webflow il più velocemente possibile, e ti svelerò il mio piccolo segreto su come ho imparato personalmente a usare Webflow in un solo weekend.
Webflow è adatto agli sviluppatori web?
Webflow è ottimo per gli sviluppatori web perché se sai già programmare, puoi costruire molto più velocemente. È molto più rapido usare un'interfaccia drag and drop che scrivere a mano lo stesso design in codice.
Molti sviluppatori web front-end che usano Webflow lo fanno per la velocità di produzione, la capacità di integrarsi facilmente con codice personalizzato (e altri strumenti), e la facilità di accesso al codice del sito.
Webflow è l'unica piattaforma visuale di sviluppo web (al momento) che genera codice pulito. A differenza di altri costruttori di siti che generano codice gonfiato e che può causare vulnerabilità di sicurezza e rallentare le prestazioni del sito, Webflow produce HTML, CSS e JavaScript puliti (l'ho già detto?).
Puoi anche esportare facilmente il codice generato da Webflow per usarlo altrove, se lo desideri.
Webflow è adatto ai web designer?
Webflow è fatto per il web designer. È attualmente il miglior strumento sul mercato per i designer che vogliono costruire siti web completamente funzionali e personalizzati.
Webflow offre un'interfaccia familiare come Photoshop o Figma, rendendo facile per i designer orientarsi rapidamente nello strumento.
Tuttavia, se non sei molto tecnico, potrebbe esserci una leggera curva di apprendimento per costruire correttamente un sito web da zero in Webflow. Questo perché con Webflow stai lavorando con veri HTML, CSS e JavaScript — il "linguaggio" di internet.
Quindi se non conosci cose come il box model o come le pagine web sono fondamentalmente costruite sul web, ci sarà una curva di apprendimento (approfondiremo questo più avanti).
Se sei più tecnico, riuscirai a padroneggiare Webflow in poche ore (o meno).
Webflow è buono per SEO e marketing?
Webflow è ottimo per i marketer perché ti permette di creare landing page personalizzate su scala, mantenendo al tempo stesso il pieno controllo delle impostazioni SEO.
La SEO su Webflow è sorprendentemente potente. Come qualcuno che in passato era un fan di WordPress per ragioni di ottimizzazione per i motori di ricerca, ero piuttosto scettico riguardo ad altri costruttori di siti web che si pubblicizzano come SEO-friendly. Tuttavia, dopo aver migrato questo sito da WordPress a Webflow, ho effettivamente visto un aumento nel posizionamento. Altri siti web hanno riscontrato miglioramenti simili.
La crescita del traffico derivante semplicemente dalla migrazione a Webflow può essere dovuta a diversi fattori. Eliminare molto JavaScript extra che i plugin aggiungono al codice di un sito, avere un design più responsive che crea una migliore esperienza utente, e avere velocità di hosting incredibilmente elevate che permettono al sito di caricarsi rapidamente — tutto questo aiuta con la SEO.
Durante il mio periodo in Webflow, stavo effettivamente guidando le iniziative SEO internamente. Il sito di Webflow era (ed è ancora) costruito interamente su Webflow, quindi è stato un ottimo modo per vedere quanto fosse davvero potente la piattaforma.
Con un team di scrittori ed editor di talento, siamo riusciti a far crescere il traffico SEO al Blog di Webflow da 25.000 visitatori al mese a oltre 250.000 visitatori al mese — e questo dovrebbe già dirti qualcosa su come Google vede questa piattaforma.
E tra me e te, il fondo di crescita di Google, CapitalG, è un investitore in Webflow (e in aziende come Airbnb, Stripe, Snapchat, Robinhood, Lyft e altre). Quindi Google è ben consapevole dello status premium che i siti web Webflow portano con sé.
Se vuoi sapere come Webflow può essere utilizzato per i team di marketing e i professionisti SEO, ti consiglio di dare un'occhiata ad alcuni articoli del blog di Webflow. Questo post spiega come i team di marketing possono utilizzare Webflow per le loro campagne, e questo post illustra tutte le funzionalità SEO di Webflow.
Ci sono anche tantissimi strumenti SEO integrati che ti permettono di modificare la sitemap, aggiungere markup schema e modificare i metadati su qualsiasi pagina del tuo sito Webflow.
6 tipi diversi di siti che puoi costruire con Webflow
Con Webflow puoi costruire quasi qualsiasi tipo di sito tu possa immaginare. Dai negozi online ai siti portfolio personali, puoi fare tutto in un unico posto.
Ecco alcuni (ma non tutti) i diversi tipi di siti web che puoi costruire con Webflow:
Siti web SaaS e aziendali
Questo è probabilmente il tipo di sito Webflow più popolare in assoluto. Alcuni dei migliori siti SaaS come Jasper (ex Jarvis), Pipe e Ramp usano Webflow per alimentare l'intera loro operazione di content marketing.
Se vuoi vedere altri siti web aziendali costruiti con Webflow, puoi visualizzarli nella showcase.
Siti media e blog
Il CMS (content management system) di Webflow ti permette di costruire siti media che possono scalare e che sono apprezzati da Google.
Living Cozy è un sito media Webflow nel settore dell'arredamento che riceve oltre 150.000 visitatori al mese solo dalla SEO organica di Google.
Anche questo sito, Agenzia SEO, è un sito di curation costruito con Webflow. La homepage si aggiorna ogni giorno feriale con notizie di marketing, risorse e guide fresche.
Se vuoi vedere altri blog costruiti con Webflow, puoi visualizzarli nella showcase.
Negozi ecommerce
Webflow Ecommerce può essere molto potente. Ma può anche essere molto complesso proprio per via della sua potenza.
Se sei un piccolo negozio che vuole costruire rapidamente un sito ecommerce con una gestione backend minima, probabilmente è meglio usare Shopify (al momento).
Webflow Ecommerce è un'opzione valida per i siti che necessitano di soluzioni totalmente personalizzate, dal design alla logistica di spedizione. A differenza di Shopify che ti offre un backend completo, il backend di Webflow Ecommerce è piuttosto essenziale e richiede l'integrazione con strumenti di terze parti come Shippo o Shipstation.
Per alcuni grandi store ecommerce (pensa a hims, Curology o Depop) questo è un vantaggio, ma per le piccole imprese può essere una seccatura. Dipende tutto dal tuo caso d'uso.
È anche possibile usare sia Webflow che Shopify contemporaneamente. Dai un'occhiata a Udesly per saperne di più.
Dove Webflow Ecommerce brilla attualmente è con i prodotti digitali. Ecco un esempio di un negozio ecommerce di prodotti digitali realizzato in Webflow.
Se vuoi vedere altri siti ecommerce costruiti con Webflow, puoi visualizzarli nella showcase.
Siti membership e marketplace
Webflow ha annunciato recentemente che sta portando logic e membership sulla piattaforma. Questo significa che puoi creare siti web complessi con accesso membership protetto.
Che tu stia creando un marketplace, un corso online, un sito di prodotti digitali o una newsletter in stile Substack, potrai fare tutto in Webflow.
Prima che Webflow annunciasse la possibilità di usare logic e membership, potevi usare piattaforme come Zapier (per la logic) e Memberstack (per le membership). Molti siti web hanno ancora questa configurazione.
Infatti, molti siti Webflow che sono essenzialmente web app attualmente funzionano tramite Webflow (la piattaforma principale), Zapier (logic), Airtable (database) e Memberstack (login utenti).
Ma presto, tutto ciò di cui avrai bisogno sarà Webflow.
Se vuoi vedere altri siti membership costruiti con Webflow, puoi visualizzarli nella showcase.
Portfolio e siti personali
Ci sono due tipi di siti molto popolari costruiti in Webflow — siti aziendali e portfolio.
I portfolio in Webflow sono così popolari che Webflow University ha pubblicato un corso molto seguito sull'argomento.
Ci sono portfolio di web design e fotografia straordinari costruiti con Webflow. Molti di essi hanno persino vinto premi sul sito di web design Awwwards — un sito di premi molto rispettato nel settore.
Se vuoi vedere altri portfolio costruiti con Webflow, puoi visualizzarli nella showcase.
Landing page
Potresti pensare che le landing page non siano un "tipo di sito web". Ma ho deciso di dedicargli una sezione a parte perché Webflow è uno strumento davvero impressionante per costruire landing page su scala.
Con Webflow CMS, puoi creare un sistema di design per landing page (pensa a un template) che puoi riutilizzare più e più volte.
Questo è molto potente se hai bisogno di creare landing page per diversi casi d'uso del prodotto, categorie o pagine per audience specifiche. Che tu abbia bisogno di landing page per campagne pubblicitarie o per catturare più keyword nella ricerca organica, costruire landing page in Webflow è piuttosto sottovalutato.
C'è un articolo molto interessante sul Blog di Webflow su come Upwork usa Webflow CMS per creare esperienze di landing page straordinarie. Lo consiglio vivamente.
Se vuoi vedere altre landing page costruite con Webflow, puoi visualizzarle nella showcase.
Come funziona: l'ecosistema Webflow spiegato
Webflow è davvero grande. Può essere difficile conoscere tutto ciò che la piattaforma e l'azienda hanno da offrire.
Qui ti spiego tutto quello che devi sapere su Webflow nel suo insieme, dalle funzionalità del prodotto alle risorse create dal team.
Il set di funzionalità del prodotto Webflow
Nella sua essenza, Webflow è un costruttore di siti web estremamente robusto e flessibile. Ci sono diverse parti della piattaforma, rilasciate in momenti diversi, che permettono agli utenti di costruire siti web davvero complessi.
Il Designer
Il Webflow Designer è il cuore di Webflow. Il Designer si riferisce all'interfaccia in cui costruisci e progetti siti web responsive in Webflow — è la tua tela.
Nel Designer hai accesso al pannello degli elementi, ai simboli (layout precostruiti), al navigatore, alle impostazioni ecommerce, alle impostazioni CMS e al pannello degli stili.
Il Designer ti permette di trascinare elementi HTML sulla tela. Da lì, puoi visualizzare i tuoi elementi nel navigatore (sul lato sinistro del Designer).
Una volta che hai i tuoi elementi sulla tela, usi il pannello degli stili a destra per applicare lo stile tramite CSS.
Il Designer è fondamentalmente dove avviene tutta la progettazione del sito web. Approfondirò questo aspetto quando arriveremo alla sezione "come imparare Webflow velocemente".
Il CMS
Il Webflow CMS è dove vengono archiviati tutti i tuoi contenuti e dati. Se il Designer è il tuo corpo fisico, il content management system (CMS) è il tuo cervello.
Qui puoi scrivere, modificare e aggiornare i contenuti del tuo sito. Puoi anche usare il CMS per creare diverse strutture di contenuto, che tu abbia bisogno di articoli del blog, pagine/biografie degli autori, ricette di cucina, pagine directory, landing page e altro ancora.
Tutto ciò che crei nel CMS può essere collegato ai tuoi design nel Designer.
Quindi se stai progettando una pagina di articolo del blog nel Designer, puoi collegare la tua raccolta CMS chiamata "articoli del blog" al tuo design. In questo modo, quando pubblichi un articolo nel CMS, si popola nel design della pagina articolo che hai creato nel Designer.
Per renderlo un po' più chiaro, prendi questa pagina che stai leggendo ora. Questa è una pagina template CMS che ho creato nel Webflow Designer — specificamente realizzata per gli articoli del blog. Ho creato questo template per gli articoli una sola volta e poi ho detto a Webflow che per ogni articolo che aggiungo al CMS, deve popolarsi all'interno di questa pagina template CMS.
Puoi accedere al CMS direttamente all'interno del Designer, oppure puoi usare il Webflow Editor (che è semplicemente un modo più user-friendly per modificare i contenuti per diversi membri del team, come marketer ed editor di contenuti, che non stanno effettivamente progettando un sito web in Webflow).
Ecommerce
Webflow Ecommerce è ciò che usi per creare, hai indovinato, siti ecommerce.
Non c'è molto da aggiungere oltre al fatto che Webflow Ecommerce è uno strumento molto flessibile per creare soluzioni ecommerce totalmente personalizzate. Continui a progettare tutto come faresti normalmente con qualsiasi altro sito web, nel Designer.
L'unica cosa che cambia è che devi essere specificamente su un piano ecommerce che ti dà accesso alle schede prodotto, all'inventario e agli ordini. Parleremo dei piani tariffari più avanti.
Se una piattaforma come Shopify è l'intera automobile, Webflow Ecommerce è un po' come il telaio + il motore. Hai quasi tutto il necessario per guidare l'auto con Webflow Ecommerce, ma dovrai abbinarlo a strumenti di terze parti per farlo funzionare davvero bene.
Per i grandi brand ecommerce che non usano Shopify, questo può essere un vantaggio. Perché possono molto probabilmente continuare a usare la propria logistica di evasione e spedizione personalizzata, ma ora hanno la libertà di creare un sito totalmente personalizzato su misura per il loro brand — dalla pagina prodotto alla pagina di checkout.
Per i siti più piccoli, o i negozi dropshipping, potresti voler restare con Shopify. Anche se, se fai dropshipping con Printful, puoi usare Webflow — c'è una integrazione creata appositamente per questo caso d'uso.
Logic
Al momento della scrittura di questa recensione, Logic non è ancora disponibile al pubblico. Ma è in arrivo nel 2022. Logic permetterà agli utenti di creare flussi di lavoro più personalizzati all'interno di Webflow.
Pensa all'automazione.
Supponiamo che tu abbia un sito di offerte di lavoro costruito in Webflow. Quando qualcuno pubblica un'offerta, Logic prenderà quella submission e la trasformerà in un vero annuncio di lavoro sul tuo sito — senza che tu debba farlo manualmente. Naturalmente, puoi impostare regole e personalizzare le cose per adattarle esattamente al flusso di lavoro di cui hai bisogno.
Puoi farlo già adesso con strumenti come Zapier o Integromat, ma presto non avrai più bisogno di quegli strumenti di terze parti.
Infatti, uso Zapier su questo sito specificamente per creare logic. Ad esempio, quando invii una risorsa ad Agenzia SEO, quella submission viene inviata a un database tramite Zapier. Quindi, Logic sarà un enorme miglioramento per il modo in cui le persone costruiscono in Webflow.
Questo è un passo avanti verso la costruzione di applicazioni web complete usando solo Webflow.
Memberships
Webflow Memberships è un'altra funzionalità che, al momento della scrittura di questo articolo, è attualmente in beta privata. Dovrebbe essere disponibile al pubblico quest'anno, nel 2022.
Con Memberships, potrai creare login utente sul tuo sito Webflow. Questo ti permetterà di creare contenuti protetti e pagine specifiche del tuo sito accessibili solo a coloro che si registrano e accedono al tuo sito.
Proprio come con Logic, puoi farlo attualmente tramite uno strumento di terze parti come Memberstack. Ma presto potrai farlo tutto in Webflow.
Immagino che creare software senza sapere come programmare potrebbe non essere poi così lontano.
Hosting
E last but not least, per mettere tutto insieme, abbiamo il Webflow Hosting.
Webflow Hosting è il servizio di web hosting proprietario di Webflow. In effetti, Webflow Hosting è stato uno dei motivi principali per cui ho finito per migrare a Webflow come piattaforma di scelta per la costruzione di siti web.
Costruito su Amazon Web Services, Webflow Hosting è usato e apprezzato da grandi aziende di tutto il mondo.
Ma i maggiori punti di forza per me personalmente sono la velocità, la scalabilità del traffico, l'SSL gratuito e la sicurezza di livello enterprise.
Sapere che un sito come Metamask, che riceve oltre 12 milioni di visitatori al mese, è ospitato su Webflow mi dà la certezza di non incorrere in problemi di banda.
Risorse Webflow
Ecco una serie di risorse diverse prodotte dal team di Webflow:
Webflow University
Webflow University è una risorsa completamente gratuita per imparare a costruire siti web in Webflow. Le recensioni di Webflow University sono ottime anche perché è un posto eccellente per imparare il web design in generale.
Hanno corsi che spaziano dai tutorial su Webflow, ai tutorial per freelance, fino alle basi del web design.
Webflow TV
Webflow TV è la piattaforma di curation di Webflow che raccoglie in un unico posto tutti i contenuti relativi a Webflow e al web design.
I contenuti su Webflow TV sono una combinazione di video creati dal team di Webflow e da creatori della community.
Template Webflow
Il Marketplace dei Template Webflow è il tuo punto di riferimento per i template premium per siti web Webflow. Tutti i template nel marketplace sono progettati da designer professionisti.
La cosa fantastica di Webflow è che ogni sito web è totalmente personalizzabile. Questo significa che anche i template sono completamente modificabili. Se non ti piace un certo aspetto del template, puoi cambiarlo facilmente da solo.
Puoi persino copiare e incollare elementi da altri template per mixare e creare qualcosa di completamente nuovo.
Webflow Showcase
La Webflow Showcase è piena di contenuti generati dagli utenti e asset Webflow. I designer che costruiscono in Webflow possono mostrare i loro progetti nella showcase, permettendo ad altri di usarli o trovare ispirazione.
Puoi trovare tantissimi progetti "clonabili" nella showcase. Alcuni designer decidono di restituire qualcosa alla community condividendo gratuitamente i loro componenti.
Se hai bisogno di trovare una certa sezione per un sito web, come un feed di social media, una pagina contatti o una bella animazione di bottone, è probabile che ci siano alcuni progetti clonabili che puoi copiare e incollare nel tuo sito Webflow.
A volte troverai persino persone che pubblicano template di siti web completi da clonare gratuitamente.
Tuttavia, a differenza del marketplace dei template, chiunque può pubblicare nella Webflow Showcase — senza un controllo qualità ufficiale. Quindi vorrai verificare la qualità del design di alcuni progetti clonabili.
Webflow Experts
Se non hai il tempo, o le competenze, per creare il tuo sito Webflow, puoi far fare il lavoro a un esperto Webflow.
Webflow Experts è un ottimo modo per trovare designer Webflow freelance pronti a costruire esattamente il sito Webflow che stai cercando