Share
Negli ultimi anni, il design piatto è diventato sempre più popolare e continua a dominare il mondo del web e del design grafico.
Cos'è il design piatto? In sostanza, il design piatto è incentrato sull'usabilità e sulla mancanza di ombre, smussi, sfumature e altri elementi estetici che distolgono l'attenzione da ciò che conta davvero: i tuoi contenuti. Di solito è caratterizzato da tipografia grande e in grassetto, icone di linea e sfondi a tinta unita che utilizzano colori brillanti.
Il design piatto è stato reso popolare in primo luogo da Microsoft in quanto ha ridisegnato l'intera interfaccia utente in Windows 8. È stato rapidamente adottato da Google e Apple, e lentamente è diventato mainstream, ed è ora utilizzato in numerosi modelli di web design.
In questo tutorial, imparerai come creare rapidamente un design piatto per il tuo sito web utilizzando un tema WordPress in stile piatto. Ma prima, alcuni fantastici esempi di design del sito flat:
Prima di approfondire questo tutorial, ecco cinque esempi di siti web piatti che ti ispirano per il tuo prossimo progetto:
Blocklevel è un'agenzia di design digitale dei Paesi Bassi. Il loro sito web presenta un design sito Web piatto con uno sfondo scuro e pop di colori vivaci in tutta la loro homepage. Il sito ha anche un sacco di spazio bianco attorno agli elementi che danno un aspetto pulito a tutto il sito. Per questo motivo, il sito è facile da navigare e i visitatori sono immediatamente attratti da diverse sezioni sulla home page.
Prodotto da FibbRealizzato da Fibb è un altro esempio di agenzia che utilizza il design piatto. Noterai immediatamente il colore giallo brillante, un menu di navigazione che è stato messo da parte in modo da non ingombrare il resto della pagina e una tipografia in grassetto facile da leggere.
Playground Inc.Playground Inc. ha optato per uno sfondo rosso acceso abbinato a una tipografia bianca nell'intestazione e uno sfondo bianco con un carattere nero e grassetto. Il sito usa anche il design di siti Web in stile piatto con icone animate che sono acchiappatori di attenzione perfetti.
GeckoboardLa specialità di Geckoboard è la creazione di dashboard personalizzati in modo che proprietari di aziende e team manager possano tenere traccia delle metriche importanti. Il loro sito web utilizza uno sfondo grigio scuro con pop di verde vivido ed elegante tipografia in uno stile di design piatto.
TripIAgentTriplAgent, agenzia di viaggi, ha optato per un design in stile piatto con colori viola e una splendida fotografia per illustrare le varie guide che hanno sul loro sito. Il menu principale è stato spostato lateralmente e la tipografia bianca associata ai pulsanti fantasma rende le chiamate all'azione facili da notare.
Se vuoi creare un sito Web moderno per la tua attività, portfolio o blog, optare per un tema piatto è un'ottima scelta. Nel post di oggi, ti mostreremo come utilizzare uno dei nostri modelli di siti Web di WordPress per creare un sito Web bello che attirerà sicuramente l'attenzione dei tuoi visitatori.
Userò il tema Kirion che è un modello di sito web WordPress multiuso con un design elegante e piatto. Grazie alla sua versatilità, può essere utilizzato per siti aziendali e siti di portfolio. Offre numerose demo pre-create, un generatore di pagine facile da usare e numerose opzioni di personalizzazione per renderlo davvero tuo.
Kirion modello di progettazione sito Web WordPress piatta.Prima di iniziare a costruire il design del tuo sito web, è necessario scegliere un nome di dominio e acquistarlo, così come ottenere un piano di hosting professionale che ospiterà tutti i file del tuo sito web.
È anche una buona idea scegliere un tema WordPress e preparare il testo e le immagini che andranno sul tuo sito web. In questo modo sarà più facile copiare e incollare semplicemente il contenuto, piuttosto che scriverlo da zero mentre crei il tuo sito.
Scegliere il nome di dominio giusto non è certamente facile. Tuttavia, ci sono alcune cose che dovresti tenere a mente che ti aiuteranno a restringere le tue scelte.
Pensa allo scopo del tuo sito. È un sito aziendale per un'azienda già consolidata? Stai creando un portafoglio personale? Forse vuoi iniziare il tuo blog?
Per i siti aziendali, è una buona idea attenersi alla propria ragione sociale, mentre i proprietari di portafogli personali di solito possono utilizzare il proprio nome. Se sei un blogger, considera gli argomenti del tuo blog e scegli un nome correlato a ciò di cui parlerai. Ciò renderà più facile per i lettori sapere cosa possono aspettarsi in termini di contenuto.
Quando possibile, prova ad andare con un'estensione .COM e ricorda di mantenere il nome facile da pronunciare e facile da pronunciare.
Dovrai scegliere una società di hosting in modo da poter installare WordPress sul loro server e rendere il tuo sito disponibile ai visitatori. Ci sono un sacco di società di hosting là fuori e WordPress ha anche raccomandazioni per host rispettabili.
Il prossimo passo è scegliere e acquistare un tema per il tuo sito. Come accennato in precedenza, ci sono molti temi piatti di WordPress e la parte migliore nella scelta di un tema WP premium è il supporto garantito dell'autore. Puoi anche essere sicuro che il tema verrà aggiornato regolarmente in modo da non rimanere bloccato con un design del tema del sito obsoleto.
L'ultima fase di preparazione è quella di scrivere il contenuto e raccogliere tutte le immagini e le risorse visive come il logo, la favicon, eventuali immagini o motivi di sfondo e averli in qualche luogo facilmente accessibili.
Ora che hai il tuo nome di dominio, un piano di hosting, un tema pro e tutti i tuoi contenuti pronti, è ora di iniziare a progettare il tuo sito web. Dovrai installare WordPress, il tema, i plugin richiesti, configurare le tue pagine e personalizzare il tuo sito. Cominciamo!
Quando acquisti i tuoi piani di hosting, il fornitore di hosting ti invierà un'e-mail di benvenuto contenente le informazioni sul tuo account. Avrai bisogno del nome utente e della password che ti hanno fornito in modo da poter accedere alla dashboard del tuo account. Una volta effettuato l'accesso, scorrere fino alla sezione Sito Web o Script e cercare WordPress. Selezionalo e quindi segui i passaggi per installare WordPress sul tuo sito.
Nella maggior parte dei casi, è necessario inserire il titolo e la descrizione del sito, impostare il nome utente e la password desiderati, nonché compilare il proprio indirizzo e-mail. Dopo aver completato tutte le informazioni, fare clic su Installare pulsante.
Il processo di installazione richiede in genere un paio di minuti. Dopodiché, vedrai un messaggio che WordPress è stato installato. Per accedere alla tua dashboard, vai su www.yoursitename.com/wp-admin e inserisci il nome utente e la password che hai creato durante l'installazione.
Ora che hai effettuato l'accesso alla tua dashboard, devi installare il tema WordPress piatto che hai acquistato. Vai a Aspetto> Temi> Aggiungi nuovo. Quindi, fare clic Carica tema.
Successivamente, trova la cartella zippata che contiene i file del tema WP e caricala. Al termine dell'installazione, fare clic su Attivare.
Se stai utilizzando il tema Kirion come in questo tutorial, devi installare il tema principale, LayersWP, che può essere scaricato gratuitamente e non è necessario attivarlo. Basta caricare LayersWP, quindi caricare il tema Kirion WordPress e attivarlo.
Il prossimo passo è installare i plug-in richiesti. Noterai una notifica nella tua bacheca che ti dirà quali plugin sono richiesti, insieme a un link che ti porterà direttamente alla schermata di installazione.
Installazione dei plugin WordPress richiesti.Seleziona tutti i plugin e scegli Installare dal menu a discesa. Quando i plugin sono stati installati, vai a Plugin> Tutti i plugin e selezionare Plugin inattivi quindi scegli Attivare dal menu a discesa.
Ora che il design del tema WordPress e i plug-in sono stati installati e attivati, puoi iniziare a configurare le pagine del tuo sito web e personalizzare i colori, i caratteri e altro. Nella maggior parte dei casi, il modo migliore per accelerare il tempo di impostazione del tema e facilitare la modifica dei contenuti è importare il contenuto della demo.
Se si desidera utilizzare il contenuto della demo, è necessario andare alla dashboard e trovare il sottomenu chiamato Strumenti> Importa. Lì, trova WordPress Importer, installarlo, quindi fare clic Esegui importatore. Di solito, la cartella del tema avrà una sottocartella chiamata Demo Import o Dati di esempio. Usa i file XML in una di quelle cartelle per importare tutti i post, le pagine, i layout e le immagini.
In alternativa, se stai usando il tema Kirion, vai a Livelli> Aggiungi nuova pagina. Come puoi vedere dallo screenshot qui sotto, Kirion include diversi modelli di pagina che puoi usare per creare il tuo sito web. Ho scelto il Kirion Home Layout One per la homepage.
Inserire il nome della pagina e quindi fare clic vai su Personalizzar. La tua pagina verrà creata immediatamente e verrai reindirizzato a Customizer schermo.
Al caricamento del Customizer, è possibile visualizzare tutte le opzioni disponibili. È possibile modificare il layout facendo clic sul Modifica il layout opzione. L'editor è piuttosto semplice e facile da usare. Tutto quello che devi fare è selezionare l'elemento desiderato e sostituire il contenuto con il tuo. Puoi anche modificare lo sfondo, caricare le tue immagini in primo piano, sostituire le immagini del cursore e molto altro.
Modifica del layout.Per creare e modificare pagine aggiuntive, vai a Livelli> Aggiungi nuova pagina e scegli il layout con cui ti piacerebbe lavorare.
Aggiunta di nuove pagine del sito Web in Kirion.Se si desidera modificare gli stili, selezionare Impostazioni del sito. Qui puoi modificare colori, caratteri, caricare il tuo logo e altro ancora.
Personalizzazione dei colori nel tuo sito web piatto.Infine, dovrai creare un menu per il tuo sito. Nel Customizer, clicca su Menu> Menu principale. Innanzitutto, scegli una posizione per il menu. ho scelto intestazione menu. Quindi, fare clic su Aggiungi articoli. Aggiungi tutte le pagine che hai creato e quindi salva il menu.
Se desideri saperne di più sulla progettazione piatta e applicare i suoi principi al tuo sito, abbiamo raccolto alcuni tutorial e corsi per aiutarti a iniziare:
Questo tutorial offre i migliori consigli sulla creazione di grafica che funzionerà bene con qualsiasi sito Web di tipo piatto. Imparerai un po 'sulla storia del design piatto e su come creare icone semplici ma di forte impatto, come usare i colori e altro ancora.
Questo corso è un tour approfondito dell'estetica piatta e come ottenerlo nei propri progetti. Imparerai come impostare il tuo file Photoshop, creare un layout per un sito web piatto e progettare tutti gli elementi che verranno utilizzati come icone, moduli, menu e altro ancora.
Se ti piace lavorare con Affinity Designer, adorerai questo corso. Imparerai tutto sul processo di creazione di icone vettoriali piatte; consigli e trucchi utili per lavorare con forme geometriche di base, modificandole e utilizzando varie operazioni per combinare le forme. Il corso copre anche come allineare e disporre gli oggetti e le funzioni principali del programma.
Prova questo corso se pensi di creare elementi di progettazione dell'interfaccia utente. Il corso illustra come creare menu, pulsanti, schede, lettori video, selettori di date e altri elementi dell'interfaccia utente utilizzando uno stile di design piatto.
Questo corso copre sia Adobe Photoshop che Adobe Illustrator, due potenti programmi considerati lo standard del settore per quanto riguarda il design. Nel corso, imparerai come creare design di icone piatte, come esportarli e come monetizzare i tuoi sforzi creativi.
Creare un sito Web semplice non è mai stato così semplice grazie a WordPress e ai temi piatti belli, premium e di alta qualità. Inizia a lavorare sul tuo sito web piatto oggi sfogliando la nostra collezione di temi flat di WordPress.
Accentsconagua