Good Mood

Non hai mai una seconda possibilità di fare una prima impressione why ecco perché la tua home page è senza dubbio una delle pagine web più importanti del tuo sito web.

Per qualsiasi azienda, la homepage è la sua porta d’ingresso virtuale. Se a un nuovo visitatore non piace quello che vedono, la loro reazione istintiva è quella di premere il pulsante “indietro”.

Proprio così unfortunately sfortunatamente, molte persone giudicano ancora un libro dalla sua copertina.

Cosa rende il design della homepage di un sito Web brillante invece che blando?, Ci vuole più che guardare da solo has deve anche funzionare bene. Ecco perché le homepage più brillanti di questa lista non solo ottengono un punteggio elevato in bellezza, ma anche in cervello e creatività.

Ma prima di immergerci negli esempi, analizziamo alcune delle migliori pratiche di progettazione della homepage.

Tutti i disegni della homepage mostrati qui utilizzano una combinazione dei seguenti elementi.

Non tutte le pagine sono perfette, ma i migliori progetti di homepage hanno molti di questi giusti.,

Il design chiaramente risposte “Chi sono”, “Cosa fare” e/o “che Cosa si può (il visitatore) fare qui.”

Se sei un marchio o un’azienda ben nota (ad es.,, Coca-Cola) Lei può essere capace di cavarsela con non dovendo descrivere chi Lei è e che cosa Lei fa; ma la realtà è, la maggior parte aziende ancora hanno bisogno di rispondere a queste domande così che ogni visitatore sa loro sono nel “posto giusto.”

Steven Krugg lo riassume al meglio nel suo libro best-seller, Don’t Make Me Think: Se i visitatori non riescono a identificare ciò che fai in pochi secondi, non rimarranno a lungo.

Il design risuona con il pubblico di destinazione.

Una homepage deve essere strettamente focalizzata-parlando alle persone giuste nella loro lingua., Le migliori homepage evitano “gobbledygook aziendale” ed eliminano la lanugine.

Il design comunica una proposta di valore convincente.

Quando un visitatore arriva sulla tua home page, ha bisogno di costringerli a restare. La homepage è il posto migliore per inchiodare la tua proposta di valore in modo che le prospettive scelgano di rimanere sul tuo sito web e non navigare verso i tuoi concorrenti.

Il design è ottimizzato per più dispositivi.,

Tutte le homepage elencate qui sono altamente utilizzabili, nel senso che sono facili da navigare e non ci sono oggetti “appariscenti” che ostacolano la navigazione, come banner flash, animazioni, pop-up o elementi eccessivamente complicati e non necessari. Molti sono anche ottimizzati per i dispositivi mobili, che è un must-have incredibilmente importante nel mondo mobile di oggi.

Il design include call-to-action (CTA).

Ogni homepage qui elencata utilizza efficacemente chiamate all’azione primarie e secondarie per indirizzare i visitatori al passaggio logico successivo., Gli esempi includono “Prova gratuita”, “Pianifica una demo”, “Acquista ora” o ” Scopri di più.”

Ricorda, l’obiettivo della homepage è quello di costringere i visitatori a scavare più a fondo nel tuo sito web e spostarli più in basso nella canalizzazione. I CTAS dicono loro cosa fare dopo in modo che non vengano sopraffatti o persi. Ancora più importante, i CTA trasformano la tua home page in un motore di vendita o generazione di lead, e non solo brochure-wear.

Il design è in continua evoluzione.

Le migliori homepage non sono sempre statiche. Alcuni di loro sono in continua evoluzione per riflettere le esigenze, i problemi e le domande dei loro visitatori., Alcune homepage cambiano anche da test A/B o contenuti dinamici.

Il design è efficace.

Una pagina ben progettata è importante per creare fiducia, comunicare valore e far passare i visitatori al passaggio successivo. In quanto tali, queste homepage utilizzano efficacemente layout, posizionamento CTA, spazi bianchi, colori, caratteri e altri elementi di supporto.

Ora, preparatevi a conoscere eccellente homepage design attraverso i seguenti 23 esempi di vita reale.,

Dropbox (Business)

4 Fiumi Smokehouse

Cobb Terapia Pediatrica Servizi

Melyssa Griffin

Jill Konrath

Evernote

Telerik da Corso

eWedding

Basecamp

la carità: acqua

TechValidate

Chipotle

Medie

Digiday

TIPO di Snack

Ahrefs

A24 Films

Ellevest

HubSpot

FreshBooks

VISUALIZZA TUTTA la HOMEPAGE

Perché È Brillante

• È facile da consumare., C’è molto dibattito sul fatto che le homepage brevi o lunghe funzionino meglio. Se si sceglie di fare quest’ultimo, è necessario rendere più facile scorrere e leggere — e questo è esattamente ciò che questo sito fa. Si comporta quasi come una storia.
• C’è un grande uso del contrasto e del posizionamento con le chiamate all’azione primarie — è chiaro su cosa l’azienda vuole che tu converta quando arrivi.
• La copia utilizzata nel call-to-action “Get Started for Free” è molto convincente.
• FreshBooks utilizza testimonianze dei clienti sulla homepage per raccontare storie del mondo reale del perché utilizzare il prodotto.,
• Il sottotitolo è anche grande: “Unisciti a oltre 10 milioni di proprietari di piccole imprese che utilizzano FreshBooks.”FreshBooks impiega sapientemente la prova sociale million 10 milioni è un grande numero to per costringere il suo pubblico di destinazione a unirsi ai loro coetanei e provare lo strumento.

Airbnb

Visualizza tutta la homepage

Perché È Brillante

• include la destinazione e la data modulo di ricerca che la maggior parte dei visitatori provengono cercando, proprio di fronte, guidare i visitatori per il passo logico successivo.,
• Il modulo di ricerca è “intelligente”, il che significa che riempirà automaticamente l’ultima ricerca dell’utente se ha effettuato l’accesso.
• La chiamata primaria all’azione (“Ricerca”) contrasta con lo sfondo e si distingue; ma la chiamata secondaria all’azione per gli host è visibile anche sopra la piega.
• Offre suggerimenti per escursioni e fughe Gli utenti Airbnb possono prenotare sullo stesso sito come loro alloggi per ottenere i visitatori più entusiasti di prenotare il loro viaggio sul sito. Mostra anche quali di queste offerte sono più popolari tra gli altri utenti.,

Pixelgrade

Perché è brillante

• – Sai subito che cosa sono tutti circa: Temi WordPress. Il grande titolo, seguito da un sottotitolo descrittivo, consente ai visitatori di sapere cosa aspettarsi.
• Il design è semplice e la combinazione di colori fa un ottimo lavoro nel far risaltare la chiamata all’azione.
• Il lato destro aiuta a dare un’occhiata a come appaiono i loro temi WordPress, senza dover scorrere o scavare più a fondo.,

Mint

Visualizza l’intera homepage

Perché è brillante

• È un design super semplice con un titolo e un sottotitolo forti e senza gergo.
• La homepage emana un’atmosfera sicura ma easy-going, che è importante per un prodotto che gestisce le informazioni finanziarie.
• Contiene anche semplice, diretto, e convincente call-to-action copia: “Iscriviti gratis.”Il design CTA è anche brillante the l’icona del lucchetto protetto colpisce ancora una volta il messaggio di sicurezza.,

Dropbox (Business)

Visualizza tutta la homepage

Perché È Brillante

• Dropbox porta il suo design semplice e di branding. Include solo ciò che è importante: un’immagine grande e pertinente con copia di supporto e un pulsante di chiamata all’azione “Prova gratis per 30 giorni”
• La homepage e il sito Web di Dropbox sono l’ultimo esempio di semplicità. Limita l’uso di copie e immagini e abbraccia gli spazi bianchi.,
• Il suo sottotitolo è semplice, ma potente: “La soluzione sicura per la condivisione di file e l’archiviazione di cui i dipendenti e gli amministratori IT si fidano.”Non c’è bisogno di decodificare il gergo per capire cosa fa davvero Dropbox.

4 Fiumi Smokehouse

Perché è brillante

• Sbavare. Questo è quello che penso quando arrivo al sito web per 4 Rivers Smokehouse. Combinato con grande fotografia, il titolo ” Petto. 18 anni da padroneggiare. Il tuo da assaporare.”sembra un’esperienza che vale la pena provare.,
• Lo scorrimento parallasse ti guida in un tour attraverso i servizi, i menu e le persone che si divertono great un grande uso di questa tendenza di design popolare.
• L’unico negativo? Non vivo abbastanza vicino a questo posto. Bu.

Cobb Pediatric Therapy Services

Visualizza l’intera homepage

Perché è brillante

• Il titolo e il sottotitolo attraggono il lato emotivo dei visitatori: “Lavora con un’azienda che lo ottiene”; ” Fidati di noi. Ci siamo passati anche noi! Troveremo un lavoro dove tu possa prosperare.,”Questa proposta di valore è unica e avvincente.
• È difficile da dire dallo screenshot qui sopra, ma il titolo è su un carosello rotante che si rivolge a personaggi specifici, dai candidati di lavoro alle persone alla ricerca di un terapeuta per le loro scuole.
• Ci sono diversi percorsi che i visitatori possono intraprendere quando arrivano sulla pagina, ma gli inviti all’azione sono posizionati bene, formulati semplicemente e in contrasto con il resto della pagina.,

Melyssa Griffin

Visualizza l’intera homepage

Perché è brillante

• Melyssa dimostra immediatamente la prova sociale “Unisciti a oltre 200.000 altri…”
• Qualifica il motivo di un visitatore per visitare il suo sito Web con un rapido sondaggio e ogni opzione si collega a un’offerta di contenuti diversa.
• Aggiunge un volto al suo marchio. Lei non è solo un sito web casuale; lei mette in chiaro che lei è un essere umano che le persone possono connettersi a.,
• La pagina utilizza colori vivaci senza essere travolgente e rende facile capire quali sono le offerte aziendali centrali di Melyssa.

Jill Konrath

Visualizza l’intera homepage

Perché è brillante

• È semplice e arriva dritto al punto. Dal titolo e dal sottotitolo, è chiaro esattamente cosa fa Jill Konrath (e come può aiutare la tua attività).
• Offre anche un facile accesso ai materiali di leadership di pensiero di Jill, che è importante per stabilire la sua credibilità come relatore principale.,
• È facile iscriversi alla newsletter ed entrare in contatto two due dei suoi principali inviti all’azione.
• L’abbonamento pop-up CTA utilizza la prova sociale per arrivare a unirsi a lei migliaia di altri fan.
• Esso comprende news outlet loghi e testimonianze come prova sociale.

Evernote

Perché è brillante

• Nel corso degli anni, Evernote si è trasformata da una semplice applicazione di salvataggio delle note in una suite di prodotti aziendali., Questo non è sempre facile da trasmettere su una homepage, ma Evernote fa un buon lavoro confezionando molti potenziali messaggi in alcuni vantaggi chiave.
• Questa homepage utilizza una combinazione di colori ricchi e tenui nel video e le sue caratteristiche luminose luci verdi e bianche per far risaltare i percorsi di conversione.
• Seguendo un semplice titolo (“Ricorda tutto”), il percorso dell’occhio ti porta quindi alla sua call-to-action, “Iscriviti gratis.”
• Evernote offre anche un processo di iscrizione con un solo clic tramite Google per aiutare i visitatori a risparmiare ancora più tempo.,

Telerik di Progress

Perché è brillante

• “Stuffy enterprise” non è la sensazione che si prova quando si arriva al sito web di Telerik. Per un’azienda che offre molti prodotti tecnologici, i suoi colori audaci, design divertenti e videografia emanano un’atmosfera simile a Google. Solo un aspetto importante per far sentire i visitatori benvenuti e far loro sapere che hanno a che fare con persone reali.
• Adoro la panoramica semplice e di alto livello delle sue sei offerte di prodotti., È un modo molto chiaro di comunicare ciò che l’azienda fa e come le persone possono imparare di più.
• La copia è leggera e facile da leggere. Parla la lingua dei suoi clienti.

eWedding

Perché è brillante

• Per quegli uccelli d’amore che pianificano il loro grande giorno, eWedding è un’ottima destinazione per costruire un sito web di nozze personalizzato. La homepage non è ingombra e include solo gli elementi necessari per convincere le persone a iniziare a costruire i loro siti web.
• Il sottotitolo ” Oltre 800.000 siti web di nozze costruiti!,”è una grande prova sociale.
• E ‘ incluso eccellente grafica del prodotto, un grande titolo, e un call-to-action che riduce l’attrito con la copia, “Start sito web.”

Basecamp

Perché è brillante

• Per molto tempo, Basecamp ha avuto homepage brillanti, e qui puoi capire perché. Spesso dispone di titoli impressionanti e cartoni animati intelligenti.
• Il call-to-action è audace e sopra la piega.,
• In questo esempio, l’azienda ha scelto una homepage più simile al blog (o un approccio al sito a pagina singola), che fornisce molte più informazioni sul prodotto.
• Il preventivo del cliente è una testimonianza audace ed enfatica che parla dei benefici e dei risultati dell’utilizzo del prodotto.

charity: water

Perché è brillante

• Questo non è il tuo tipico sito web senza scopo di lucro. Un sacco di immagini, copia creativa, e l’uso di web design interattivo rendono questo spiccano.
• L’immagine intestazione animata è un ottimo modo per catturare l’attenzione.,
• Impiega grandi usi di video e fotografia, in particolare nel catturare emozioni che causano azione.

TechValidate

Perché è brillante

• Questa homepage è splendidamente progettata. Amo particolarmente l’uso di spazi bianchi, colori contrastanti e design incentrato sul cliente.
• Il titolo è chiaro e avvincente, così come gli inviti all’azione.
• C’è anche una grande gerarchia di informazioni, che lo rende facile da scansionare e capire la pagina rapidamente.,

Chipotle

Visualizza l’intera homepage

Perché è brillante

• La homepage è un ottimo esempio di agilità e cambiamento costante. L’attuale homepage di Chipotle riguarda la prossima vacanza, che utilizza come proposta di valore unica per iniziare a fare clic sul tuo sito. Quando penso a Chipotle, non penso necessariamente al catering, ma il sito è un ottimo promemoria per considerare diversi usi per i burritos che già conosci e ami.,
• La fotografia del cibo è dettagliata e bella, e in realtà mi fa venire fame a guardarla. Ora questo è un uso efficace delle immagini.

Medium

Visualizza l’intera homepage

Perché è brillante

• Questo è forse uno dei migliori usi degli spazi bianchi che ho visto. Esso consente di Media app tagline e foto al centro della scena, mentre ancora disegnando l’occhio per i titoli della sezione più scura sul sito.
• Medium rende facile iscriversi — sul sito, o con un semplice messaggio di testo sul tuo cellulare., Sono molto più reattivo a un testo di una e-mail, quindi questa è una grande strategia per mantenere le persone impegnate nel processo di iscrizione.
• La homepage utilizza la prova sociale per ottenere i visitatori di iniziare a fare clic in giro: Il “Popolare su medio” e “Personale Raccoglie” sezioni fammi sapere dove trovare contenuti di alta qualità.,

Digiday

Visualizza tutta la homepage

Perché È Brillante

• a Differenza di altre notizie online le pubblicazioni che inondano i siti con molti titoli e immagini possibili, Digiday prima sezione vetrine di un solo articolo. La sua immagine in primo piano (in questo caso, uno spaventoso) è accattivante, e il titolo è solo chiedendo di essere cliccato ora che il visitatore ha un’idea di quello che stanno andando a leggere.,
• La parte superiore della home page, dove siti web normalmente vetrina una tonnellata di diverse sezioni e opzioni per fare clic attraverso, ha una sola icona per fare clic – che porta a una pagina di abbonamento.

Spuntini GENTILI

Visualizza l’intera homepage

Perché è brillante

• I colori audaci producono contrasto, rendendo le parole e le immagini spiccano sulla pagina.
• Il CTA – “Shop KIND” – è intelligente. Esorta il visitatore a fare clic per saperne di più mentre fa un gioco sulla parola “tipo” impl il che implica che è una buona scelta per fare acquisti lì.,
• Lo slogan di KIND Snacks è brillante brilliant quando l’ho letto, il messaggio ha immediatamente risuonato e mi ha fatto venire voglia di leggere l’etichetta dello snack bar.

Ahrefs

Visualizza l’intera homepage

Perché è brillante

• Il contrasto di colore tra i colori blu, bianco e arancione è accattivante e rende il titolo e CTA pop.
• Il sub-headline e CTA sono una coppia avvincente: essere in grado di iniziare a monitorare e superare i concorrenti gratuitamente è una grande offerta.,
• La homepage presenta una moltitudine di opzioni per il visitatore, ma non è ingombra grazie al solido sfondo e alla semplice tipografia.

A24 Films

Visualizza l’intera homepage

Perché è brillante

• La homepage della casa cinematografica è composta solo da trailer per i suoi nuovi film. Sappiamo che il contenuto video è formato il pubblico vuole vedere di più, e questa è una grande strategia per mostrare il lavoro di A24 in un modo altamente coinvolgente.,
• Nella parte superiore della homepage, A24 offre immediatamente una miriade di modi per entrare in contatto tramite social media ed e-mail something qualcosa che apprezzo come visitatore quando tanti altri siti seppelliscono le informazioni di contatto nella parte inferiore della pagina.

Ellevest

Visualizza l’intera homepage

Perché è brillante

• “Investi come una donna: perché il denaro è potere.”Questi titoli sono potenti e mi fanno venire voglia di saperne di più sul prodotto both sia come donna, sia come qualcuno interessato a fare scelte finanziarie intelligenti.,
• Le immagini mostrano, piuttosto che raccontare, una delle proposte di valore dell’azienda: un sito desktop e un’app mobile che si muovono con te.
• “Get Started” è un ottimo CTA in infatti, lo usiamo noi stessi qui a HubSpot. Quando si fa clic, porta i visitatori attraverso alcuni semplici passaggi per impostare un profilo e iniziare a investire.,

HubSpot

Visualizza tutta la homepage

Perché È Geniale (Se siamo Noi a Dirlo)

• I personaggi LEGO che cattura la vostra attenzione (perché sono carino), poi abilmente illustrare e rafforzare la messaggistica nel titolo e sottotitolo.
• Porta un altro accattivante “Get Started” CTA with con bonus microcopy dettagliare le nostre versioni gratuite gli utenti possono scegliere di aggiornare in futuro.,
• In tutta la homepage, i nostri temi di colore blu e arancione continuano a tornare per attirare l’occhio su link e CTA.

Cerchi più ispirazione? Dai un’occhiata a queste incredibili pagine su di noi.