Le tendenze del web design degli anni 2010 restano qui?

Divulgazione: Il tuo supporto aiuta a mantenere il sito in esecuzione! Guadagniamo una commissione di riferimento per alcuni dei servizi che raccomandiamo in questa pagina.


Tendenze del web design per il 2018

All’inizio del World Wide Web, era alla moda che i webmaster usassero tutti i possibili effetti: gif animate, testo lampeggiante e mid di riproduzione automatica sono stati ricercati per l’attenzione su ogni sito che hai navigato.

Mentre i selvaggi giorni di frontiera di Internet erano eccitanti e rivoluzionari, tendenze come il testo rosso su sfondi a motivi geometrici non erano esattamente facili per gli occhi o facili da usare.

Per fortuna, abbiamo fatto molta strada dalla nascita del web. La tecnologia che usiamo per andare online si è evoluta dai tempi in cui ascoltavamo strillare i modem dial-up collegati, incrociando le dita che nessuno ti ha cacciato offline raccogliendo il telefono fisso.

I web designer hanno dovuto evolversi per stare al passo anche con la tecnologia in evoluzione. Negli ultimi decenni, ondate di tendenze del design sono andate e sono andate evolvendo per focalizzare l’attenzione sull’esperienza dell’utente. Oggi i designer sono più che mai concentrati sul minimalismo, sulla leggibilità e sulla facilità d’uso.

Ma, mentre le cose migliorano continuamente, c’è sempre la possibilità di svolte e insidie ​​sbagliate lungo la strada, anche con tendenze che sembrano essere miglioramenti. Lo scorrimento infinito può aiutare a visualizzare più informazioni e a mantenere il visitatore sulla pagina più a lungo, ma gli utenti potrebbero trovarlo frustrante quando provano a visualizzare un piè di pagina del sito Web che continua a saltare via quando vengono caricati più articoli.

La popolarità degli elementi fissi è comprensibile: vuoi mantenere informazioni cruciali davanti agli occhi del tuo visitatore. Ma potrebbe ritorcersi contro se quei pulsanti di condivisione iniziano a bloccare il contenuto della tua pagina. I web designer dovrebbero tenere il passo con le tendenze, ma anche usare la loro creatività per trovare nuove soluzioni innovative a problemi come questi.

Quando si tratta delle tendenze di quest’anno, è impossibile dire quali innovazioni vinceranno e rimarranno e quali rideremo tra 10 o 20 anni da oggi. Con questa suddivisione delle tendenze del web design del 2014, puoi decidere tu stesso quali tendenze vale la pena continuare e quali dovrebbero essere lasciate indietro.

Web-Design-Tendenze

Design of the Times: 2014 tendenze del web design

Il Web si è evoluto in modo drammatico dai primi anni ’90 in cui abbiamo visto colori e caratteri folli e musica automatica in sottofondo non appena è stato caricato un sito Web. Il Web di oggi vede un approccio più minimalista, tutto progettato per renderlo semplice e più user friendly. Ecco cosa puoi aspettarti di vedere di più nel 2014.

Responsive Design

  • Design reattivo significa che un sito Web si adatta automaticamente alle dimensioni dello schermo su cui viene visualizzato.
    • Questo è fondamentale per il web design poiché le persone si allontanano dallo schermo di un computer tradizionale.
      • Il 90% degli adulti americani ora possiede un telefono cellulare
      • Il 58% degli adulti americani ora possiede smartphone
        • Il 60% dei proprietari di telefoni cellulari utilizza il proprio telefono per connettersi a Internet
      • Il 42% degli adulti americani possiede ora compresse
  • Il web design reattivo prevede l’utilizzo di un mix di flessibile:
    • layout
      • Tutto è dimensionato in proporzione, anziché in pixel.
    • immagini
      • Tutto è dimensionato in base alla relazione, piuttosto che ai pixel.
    • Query CSS
  • Esempi di design reattivo includono:
    • com
    • com
    • com
  • Crea i tuoi modelli responsive o acquista un framework responsive esistente.
    • Esempi inclusi:
      • Karma
      • Avada
      • avvolgere
  • Professionisti:
    • Meno manutenzione: un sito, anziché più siti da progettare e mantenere.
    • Migliore ottimizzazione per i motori di ricerca (SEO): un sito significa una serie di URL, che rende SEO più gestibile.
    • Non devi preoccuparti se il tuo sito sarà o meno compatibile con le dozzine di nuovi dispositivi che colpiscono continuamente il mercato.
  • Contro:
    • L’implementazione può richiedere più tempo del previsto.
    • La tecnologia è ancora in via di sviluppo.
    • Poiché le immagini vengono ridimensionate e non ridimensionate, ciò può influire negativamente sul tempo di caricamento della pagina, sconvolgendo i visitatori.

Più scorrimento

Nel 2014 vedremo più scrolling, a causa di quanto sia facile da implementare.

  • Scorrimento di parallasse: consente allo sfondo del sito Web di spostarsi a una velocità diversa rispetto al resto della pagina.
    • Esempio: Nasa Prospect
    • Professionisti:
      • Può stupire i visitatori con l’animazione
      • Indirizzare gli utenti al call of action
      • Incoraggia i visitatori a rimanere sulla pagina più a lungo mentre scorrono l’intera cosa
    • Contro:
      • La SEO subisce un colpo perché esiste solo una serie di meta informazioni
      • Molti dati su una singola pagina rallentano il tempo di caricamento della pagina, il che può portare a utenti frustrati
  • Scorrimento orizzontale: scorre da sinistra a destra anziché su e giù.
    • Esempio: World Wildlife Foundation Earth Hour 2012
    • Professionisti:
      • Consente ai progettisti di ospitare più contenuti sullo schermo.
    • Contro:
      • Gli utenti potrebbero non rendersi conto che devono scorrere lateralmente o potrebbero non voler scorrere lateralmente per ottenere l’esperienza completa.
  • Scorrimento infinito: carica il contenuto della pagina mentre l’utente scorre
    • Esempio: feed di notizie di Facebook
    • Professionisti:
      • Navigazione più veloce
      • Interagisce bene con i dispositivi touch
      • Esposizione del contenuto: lo scrolling infinito espone ugualmente contenuti nuovi e vecchi, dando ai vecchi contenuti una “shelf life” più lunga.
    • Contro:
      • Navigazione:
        • Gli utenti non sono in grado di tornare indietro o aggiungere ai segnalibri una cosa particolare e dovranno ricominciare da capo.
        • Lo scorrimento infinito non dice agli utenti quanti dati ci sono da guadare.
      • Focus dell’utente: quando ti allontani dalla pergamena, verrai riportato all’inizio, piuttosto che al punto di riferimento precedente, rendendo più difficile per gli utenti concentrarsi su ciò che stavano facendo / leggendo.

Meno testo

  • Invece del design pesante del testo, vedremo più design incentrato su immagini, icone e video.
    • com contiene meno di 10 parole e richiede agli utenti di guardare un video per capire come utilizzare l’app.
    • com contiene un piccolo paragrafo di testo e alcune parole nella barra di navigazione della sua homepage.
    • The-Studio.co.il contiene solo poche parole e immagini.
  • Professionisti:
    • Web design più sofisticato
  • Contro:
    • Più difficile realizzare siti web conformi alla norma 508
      • La conformità 508 si riferisce alla conformità del Web per le persone con disabilità che non possono accedere a Internet in modo tradizionale.

Interfaccia utente piatta

  • Flat User Interface (UI) si riferisce a un design incentrato sulla funzionalità, piuttosto sullo stile.
    • Gli elementi sono fatti per assomigliare più a come prendono il nome.
    • Tutto è progettato per:
      • Chiarezza
      • Semplicità
    • Significa rimuovere:
      • Shadows
      • Sfumature
      • Bordi smussati
      • Riflessi
  • Lo abbiamo già visto in:
    • Windows 8
    • Apple iOS 7
    • WordPress 3.8
  • Il design piatto funziona contro il design scettomorfo.
    • Il design skeuomorphic utilizza dettagli visivi per far sembrare qualcosa come qualcos’altro.
      • Esempio: utilizzo di pannelli in legno all’interno dell’auto
  • Professionisti:
    • Interfaccia utente semplice
    • L’uso di colori vivaci / audaci aumenta l’umore
    • Concentrati su una grande tipografia
    • Le immagini sono nitide e pulite
  • Contro:
    • Problemi di usabilità: le persone potrebbero non sapere sempre dove fare clic o toccare per interagire.
    • Le tavolozze dei colori possono essere difficili da abbinare: più colori usi, più difficile può essere per abbinarli correttamente.
    • Il design tipografico debole diventa più facile da individuare.
    • Il design complessivo può sembrare troppo semplice.

Contenuto fisso

  • Questo si riferisce a un elemento della pagina, come la barra di navigazione o una sezione di contenuto che rimane in posizione sulla pagina mentre l’utente scorre.
    • ca consente lo scorrimento orizzontale mentre la navigazione della barra laterale rimane in posizione.
    • net presenta una barra social media a posizione fissa sul lato sinistro del sito Web, che consente agli utenti di scorrere i contenuti mentre la barra rimane in posizione.
  • Professionisti:
    • Vantaggi dell’usabilità: gli utenti possono trovare ciò che stanno cercando molto più facilmente.
  • Contro:
    • Il contenuto fisso può sprecare spazio oltre lo scorrimento.
    • Alcuni elementi fissi, come una barra di navigazione, possono essere difficili da tradurre in un ambiente mobile.

fonti

  • Scheda tecnica sulla tecnologia mobile – pewinternet.org
  • Responsive Web Design: cos’è e come si usa – coding.smashingmagazine.com
  • Che cos’è il Responsive Web Design? – smallbiztrends.com
  • 17.389 Temi per siti Web e temi Da $ 3 – themeforest.net
  • Pro e contro di Responsive Web Design – business2community.com
  • Che cos’è Parallax Web Design? – Definizioni, suggerimenti & Considerazioni – unleashed-technologies.com
  • NASA: Prospect – nasaprospect.com
  • WWF Food Story – assets.wwf.org.uk
  • Lo scorrimento infinito non è per tutti i siti Web – nngroup.com
  • Verso l’infinito e oltre! Pro e contro dello scrolling infinito – inspiredm.com
  • Snapchat – snapchat.com
  • The Studio – the-studio.co.il
  • Meno testo più multimedia – Nuovo approccio nella progettazione di siti Web – designmodo.com
  • Lost and Found – Pagina di mappatura – howto.gov
  • Che cos’è il design piatto? – gizmodo.com
  • Pro e contro del design piatto – designmodo.com
  • 18 principali tendenze del web design per il 2014 – econsultancy.com
  • Barre di navigazione fisse: Pro e contro – awwwards.com
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map