5 Varsinaiset verkkosuunnittelutrendit vuodelle 2016

Aina kun näen linkin nimeltä Web Design Trends tälle vuodelle, napsautin sitä onnellisena vain pettymään muutamassa minuutissa. Se on aina, ilman epäonnistumista, viime vuoden trendit tai muut kuin trendit, kuten: kuvitukset. Kuten tiesitkö, että animaatiot ovat ilmeisesti iso trendi? Vakavasti, jos kirjoitat trendiluettelon ja sisällytät koko näytön taustavideon trendiksi vuodelle 2016, sinun pitäisi todella yrittää siirtyä verkkoon ja katsoa verkkosivustoja ennen luettelon muokkaamista. Kukaan ei napsauta syöttiä. Joka tapauksessa, ilman enempää, tässä on luettelo viidestä todellisesta trendistä tämän vuoden ensimmäisellä puoliskolla.

1) Koko näyttö ja ei vieritettävissä

Muut kuin vieritettävät sivustot saavat lopulta pitoa. Kun yhdestä ikuisuuden läpi vieritettystä verkkosivustosta, jonka yläosassa on tarttuva ankkurilinkki, oli melkein tullut tavanomainen tapa tehdä kotisivuja, on mukava nähdä sivuja, joissa sinun on napsautettava navigoidaksesi. Niin paljon kuin ihmiset vihaavat vieritysnostoa, se voi olla toisinaan mukavaa. Näiden sivustojen suunnittelussa avain on käyttää näyttöä rajoituksiin. Prototyyppi Keynotessa. Näppäimistönavigointi on yleistä näillä sivustoilla.

Facebookin yksityisyyden perusteet

Kolme esimerkkiä koko näytön sivustoista vierittämättä:

  1. Facebookin yksityisyyden suojan perusteet - Facebookin upea sivusto, vaikkakaan ei reagoiva, ja selittää askel askeleelta, kuinka yksityisyys toimii heidän palvelussaan. Upeita kuvia!
  2. Fantasy - Suunnittelutoimiston Fantasyn odotettu uusi verkkosivusto, joka avattiin aiemmin tänä vuonna, ja se ei pettynyt. Erityisesti tarkista Work-osa, kaikki pysyy näytöllä.
  3. KLM 50 Travels - Kaunis kampanjasivusto KLM: lle. Se vie sinut läpi 50 määränpäätä, yksi näyttö kerrallaan. Selaa näppäimistön nuolien ja välilyönnin avulla.

2. Sticky otsikko sivulle

Verkkosuunnittelun viimeisimpien suuntausten vuoksi on aina viisasta katsoa agentuurisivustoja tai pikemminkin suunnittelusstudioita. Ja viime aikoina on ollut á la -tila, että otsikot vierittävät tekstin puolelle. Kaikki hienot lapset tekevät sen. Tämä on vain työpöydälle suuntautuva suuntaus, joten lukeessasi tätä puhelimellasi sinun on vain luotettava minuun tässä, käymättä esimerkkilinkkejä.

Koodi ja teoria

Kolme esimerkkiä tarttuvista otsikoista sivulla:

  1. Koodi ja teoria - Kaupungin otsikot pysyvät kuvassa, kun selaat avoimen sijainnin läpi tällä kauniilla verkkosivustolla.
  2. Pino ylivuoto - Tämä ei sovi sataprosenttisesti laskuun, mutta se ei ole toimisto-sivusto, joka antaa sille luvan. Vieritettäessä alinavigointi pysyy tahmeana oikealla. Kiva.
  3. DDB Sthlm - Olen Ruotsista, joten heitän myös ruotsalaisen esimerkin. Jos painat työpaikkaa heidän valikossa ja vierität alaspäin, huomaat, että pystysuuntainen otsikko pysyy sivussa.

3) logo on kuormaaja

Tämä on valtava suuntaus, ja siitä on tullut melkein synonyymi agentuurisivustojen kanssa tänä vuonna. Jokaisella on se. Ja niin heidän pitäisi, koska se näyttää hyvältä ja antaa kävijälle tunteen, että verkkosivusto on osa brändiä. Erittäin taitava.

väline

Kolme esimerkkiä logon käytöstä laturina:

  • Instrumentti - Tämä sivusto näyttää heidän logonsa vain, kun sivu latautuu ja kun avaat navigointivalikon. Se on uusi ja pallo.
  • Fubiz - Tämä sivusto teki suuren roiskeen käynnistyessään ja hyvistä syistä. Sivustolla on eri logo kaikilla osioilla, kaikilla erittäin hienoja animaatioita.
  • Tämä myös - loistava suunnittelusstudion verkkosivusto, jota ei ole koskaan ennen nähty taiteen johtajana agentuurisivustoille. Vaikka navigointikuvake ei teknisesti ole logo, se on täällä lataaja, mutta se sijaitsee siinä, missä logo yleensä on, joten se sopii.

4) Häiriintyneet taustakuvat

Koko selainikkunan täyttävän taustakuvan saaminen ei ole mitään uutta, se on todennäköisesti perinteisen Verkkojen suunnittelun trendit 2013 -lehden yläosassa, mutta se vie sen uudelle tasolle. Lisää hiiren osoittimen tehosteita taustakuvaan ja voit mennä.

Aktiivinen teoria

Kolme esimerkkiä häiriintyneistä taustakuvista:

  1. Saa minut pulssiksi - Siirrä hiiri taustan yli ja näe, että vuoret elävät, erittäin hyvin tehty.
  2. Aktiivinen teoria - Jos luot verkkosivustosi toimistollesi, mikä on parempi tapa osoittaa, että sinulla on hulluja verkkotaitoja kuin saada se näyttämään Google-kokeilulta? Ei mitään.
  3. Tiedot - Tämä vie vierittämistä. Tämä sveitsiläinen suunnittelutoimisto ei ilmeisesti usko ankkurilinkkeihin, joten jos vierität sivun alaosaan 4/4 Nos Experts ja siirrät valokuvia, näet heissä vääristymisen. Kiva!

5) Ylin animaatiot

Tämä on teknisesti mahdollista nyt, joten miksi et? Jos se tehdään oikein, se voi olla erittäin visuaalisesti miellyttävä ja viihdyttävä kokemus, jos se tehdään väärin, se on Flash-sivustoja uudestaan. Viisaiden sana: käytä varoen, mutta mene ylhäältä, kun käytät sitä.

Waaark

Kolme esimerkkiä suosituimmista animaatioista:

  1. Waaark - Lol, tämä pieni suunnittelustudio on tuottanut tämän vuoden upeimpia visuaalisia kokemuksia. Jätä se ranskan päälle mennäksesi yläreunaan, kun kyse on animaatioista.
  2. Animocons - Tässä on joitain esimerkkejä kuvakkeista, joissa on näyttäviä napsautusanimaatioita, kaikki tehty web-koodilla.
  3. Rally Interactive Beta - Rally tekee hienoa työtä, koska sivustolla ei ole juuri oikean määrän animaatioita. Ne ovat menneet hulluiksi yläosassa ja pitävät sen sitten täyteläisenä, kun napsautit ja valitsit jotain.

Bonus: ei vielä oikein trendi, nähnyt sen vain yhdessä tai kahdessa paikassa, mutta reagoivien verkkosivustojen rakentaminen, joiden mittakaava on mittaamaton, tulee olemaan valtava. Eli sivusto näyttää täsmälleen samalta 1280px-näytöllä kuin iMac 27 "Retina 5100+ px -näytöllä, se on vain suurempi. Tutustu esimerkiksi Brasilian teleoperaattorin Oin upeaan sivustoon.

Nimeni on Nils ja työskentelen suunnittelijana Apessa, digitaalistudiossa Tukholmassa, Ruotsissa. Elämme erinomaisen suunnittelun, tekniikan ja viestinnän puolesta. Jos haluat tietää enemmän meistä, tutustu verkkosivustoomme, jolla ei valitettavasti ole mitään yllä luetelluista suuntauksista.

Lisäksi, jos pidit tästä artikkelista, paina alla olevaa suositusta. Se auttaa paljon.