Le intestazioni dei siti Web sono un aspetto molto importante di qualsiasi progetto Web, indipendentemente dal fatto che il sito Web sia un blog, un portfolio, un sito informativo o persino un negozio online. È, insieme al logo, una delle prime cose che un nuovo utente vedrà visitando il tuo sito web. Il tuo sito web, proprio come un essere umano, dovrebbe avere una personalità; il modo migliore per "presentare" la personalità del tuo sito web è attraverso il design dell'intestazione. Ciò consente al visitatore di determinare rapidamente non solo la qualità del sito, ma se i contenuti sono qualcosa che pensano che apprezzeranno.
Questo post mostra 35 fantastici disegni di intestazione per aiutarti a ispirarti per il tuo prossimo progetto di web design. Tutte le intestazioni in mostra catturano l'attenzione del loro pubblico di destinazione incredibilmente bene, quindi mantenendole sul sito web per un periodo di tempo più lungo. E facci sapere qual è la tua intestazione preferita nei commenti!
Non appena questa meravigliosa testata è stata caricata, siamo stati accolti in un ambiente felice e allegro con un tocco personale. La sensazione amichevole dell'intestazione contrasta il fatto che la navigazione non sembra esistere affatto.
Ancora una volta ci viene presentato un ambiente allegro con il design dell'intestazione "Meomi". L'illustrazione è, infatti, animata utilizzando Flash, quindi assicurati di dare un'occhiata al sito web dal vivo. Anche se il design è piuttosto impegnativo, è facile adattarlo, rendendo più facile orientarsi nel sito senza problemi. L'uso di una tag line sotto il menu di navigazione rende chiaro ai nuovi visitatori che cos'è il sito Web e a chi è rivolto - solo nel caso in cui non fossi già stato raccolto dalle splendide illustrazioni di Flash.
Et Toque! utilizza anche un'intestazione illustrata animata Flash. Includono un design simpatico dei personaggi con colori vivaci e accattivanti e una composizione superba. La navigazione si trova nella parte inferiore della pagina che, in un certo senso, è piuttosto inusuale; Et Toque! tuttavia sono riuscito a farcela molto bene.
Il sito web del portfolio di Matt Hamm ha seguito una tendenza relativamente recente e moderna, consentendo ai suoi nuovi visitatori di sapere cosa fa in caratteri grandi e in grassetto. Per sottolineare la parola "Ciao". un colore blu scuro è stato usato - questo rende la personalità del sito web amichevole e molto personale. L'uso di un'ombra diretta sul menu di navigazione nella parte superiore della pagina lo fa risaltare più di quanto non faccia già - è quasi impossibile non fare clic sui collegamenti. Per completare il tutto, è stata usata un'illustrazione comica di Matt che tiene in mano un'icona di Twitter, dicendo al pubblico che ha un profilo Twitter.
Questa intestazione fa un grande uso di immagini, trame e ombre, tutto per produrre una compilation memorabile. L'uso di un logo di un sito Web di grandi dimensioni rende il sito ancora più memorabile e la riga di tag sottostante facilita l'individuazione dei contenuti del sito. La navigazione è incredibilmente semplice da usare, con i collegamenti dei contatti, ecc. Mostrati nella parte superiore dell'intestazione e i link di navigazione del contenuto utilizzati al di sotto.
L'uso di texture grungy e elementi disegnati a mano in questo design di intestazione rende il sito molto personale e invitante. Anche la navigazione è disegnata a mano, ed è piuttosto inusuale usando un layout simile a quello di un diagramma a ragno; sebbene non sia una tecnica comune, è molto semplice navigare nel sito Web senza troppa riflessione e sforzo.
Dopo aver prima caricato questo web design altamente strutturato, siamo quasi subito colpiti da una raffica di verde brillante (e attraente). Un verde leggermente più leggero e sottile viene utilizzato dietro il pappagallo per portare gli occhi nel menu di navigazione, che è stato posizionato sopra la maggior parte dello sfondo con texture, per una visualizzazione più semplice. Viene utilizzato un grande logo con una tag line incorporata, che è stato anche collocato sopra la maggior parte dello sfondo con texture, rendendo più facile la memorizzazione come logo indipendente piuttosto che parte del web design.
L'intestazione Joby utilizza una combinazione di lettere piccole, maiuscole grandi e maiuscole e caratteri Sans Serif per attirare l'attenzione dei visitatori e fargli sapere in che cosa consiste il sito in un modo molto memorabile ed emozionante. L'uso di un'illustrazione disegnata a mano / dipinta aggiunge un tocco personale al design.
Questo è probabilmente uno dei progetti di intestazione più belli ed energici in questa compilation. L'uso di colori tenui e grigi e un verde intenso, con una combinazione di buchi strappati e texture leggere del grunge, ne fanno un piacere assoluto da guardare. Oltre ad avere un bell'aspetto, la navigazione è facilissima da usare con un elegante effetto evidenziatore bianco quando si posiziona il mouse sui collegamenti. Le icone degli sponsor sono anche collegate, facendo uso dello spazio vuoto in modo superbo per alcune campagne pubblicitarie.
Questo design di intestazione minimalista ma di grande qualità tipografica ha tutto. L'intestazione tipografica grande, colorata e fotografica è accattivante ed è molto facile da ricordare. Dopo aver smesso di fissare la deliziosa combinazione di colori del logo, probabilmente leggerai la tag line, spiegando di cosa tratta il sito e se è qualcosa che vuoi continuare a leggere. Se lo è, ti vengono presentati alcuni collegamenti di testo molto semplici ma accattivanti per orientarti nel sito.
TUT Candy era molto vicino a essere inserito nella categoria successiva, 'Intestazioni e Intestazioni Bokeh', a causa del suo sfondo stellato e spaziale. È, tuttavia, basato sulla tipografia tridimensionale, assicurandogli un posto in questa categoria. Dopo aver ammirato gli splendidi effetti di testo e aver letto la tag line che attira l'attenzione, i collegamenti e la barra di ricerca sono molto facili da individuare e utilizzare nella parte superiore dell'intestazione.
Rareview usa sottili Flash animati (ma incredibili) nella loro intestazione, quindi assicurati di andare oltre per controllare la versione live - non rimarrai deluso. L'atmosfera creata dall'animazione, specialmente se visualizzata su un grande monitor lucido, ti fa sentire come se fossi in un mondo diverso; è davvero così potente. Il logo minimalista in bianco e nero e i link di navigazione li rendono molto facili da localizzare e usare, e fanno uso di alcuni fantastici effetti al passaggio del mouse (di nuovo, vedi la versione live).
Questa è facilmente l'intestazione più elegante in questa vetrina. L'uso di trame dell'acquerello e l'uso minimo del colore aggiungono un tocco molto personale al design. La sottile linea nera nella parte superiore dell'intestazione aiuta a liberare il potenziale del logo raffinato e della tipografia di navigazione.
Dopo aver esaminato questi fantastici esempi di intestazioni ben progettate, dovresti sentirti riposato e pronto ad affrontare il tuo prossimo progetto di web design, o addirittura ridisegnare il tuo header esistente - dopo tutto, a volte sono necessari solo piccoli ritocchi per rendere il tuo design completamente completo potenziale.