Suosituimmat verkkosuunnittelutrendit Edge Animatessa

Adobe Edge Animaten avulla voit luoda kaikki tässä luetellut suunnittelutrendit. Tässä esitellyt web-suunnittelutrendit edustavat enimmäkseen uusia koodaustekniikoita, mutta myös uusia tapoja, joilla yleisösi voi olla vuorovaikutuksessa sivustosi kanssa kiinnostavalla tavalla. Kun kiinnität yleisösi huomion ja houkuttelet heitä verkkosuunnittelussasi, olet hyvällä tiellä säilyttääksesi yleisösi.

Lisää kuvia ja piirroksia

Oletko kyllästynyt ja kyllästynyt katsomaan tekstiseinää? Ovatko kaikki nuo pienet kuvat ja kuvakkeet alkaneet näyttää hieman vanhentuneilta? Saako tasainen taustaväri haukottelemaan? Jos sinusta tuntuu siltä, ​​on hyvä mahdollisuus, että yleisösi tuntee samoin.

Kuvien ja kuvien lisääminen sivustollesi voi parantaa web-suunnitteluasi huomattavasti. Jotta sivustosi näyttäisi ajankohtaisemmalta, lisää hienovarainen taustakuva valkoisen, harmaan tai mustan taustan sijaan.

Voit helposti tuoda kuvia käytettäväksi Animate-kokoonpanon kanssa ja kuinka käsitellä niitä. Tutustu kuvien käyttämiseen taustalla ja div- ja img-tunnisteen eroihin kuvissa. Voit määrittää kuvillesi asettelun esiasetukset.

Vaakasuora vieritys

Verkkosuunnittelun luominen vaakasuuntaisella vierityksellä voi vaatia rohkeutta – sitä on harvoin tehty – mutta se ei tarkoita, etteikö sitä olisi tehty aiemmin ja erittäin tehokkaasti. Yksinkertainen verkkohaku "hyvin vaakasuuntaisilla verkkosivustoilla" ei jätä sinua pettymään. Löydät monia upeita esimerkkejä taidesivustoista, gallerioista ja luovista sivustoista, jotka käyttävät vaakasuoraa vierittämistä tehokkaasti.

Vaikka tämäntyyppinen navigointi on vielä suhteellisen uutta, luomalla sivuston tällä tavalla voit asettaa itsesi muodikkaan web-suunnittelun kärjeksi.

Pystysuuntainen vieritys

Juuri vaakasuuntaisen vierityksen vastakohta on pystysuuntainen vieritys. Pystysuuntainen vieritys on ollut suosittu web-suunnittelutrendi useiden vuosien ajan, mutta viimeisen vuoden tai kahden aikana sitä on liioiteltu suuresti.

Monet sivustot käyttävät loputonta pystysuuntaista vieritystekniikkaa, joka pitää yleisön sivulla. Tämä loputon esitystyyli on suunniteltu pitämään yleisön huomio jatkuvassa lisäsisällön haussa.

Kiinteät otsikot

Jos päätät suunnitella animoidun verkkosivun käyttämällä loputonta pystysuuntaista vieritysmenetelmää, sinun kannattaa harkita kiinteän otsikon lisäämistä sivustoosi. Kiinteä otsikko on navigointivalikko, joka sijaitsee sivun yläosassa ja pysyy näkyvissä, kun yleisösi vierittää sivua alaspäin.

Tämän ominaisuuden avulla yleisösi voi navigoida nopeasti sijainnistaan ​​sivustosi eri osiin – ja tietää aina, missä he ovat.

Kiinteä otsikko on kätevä, jota yleisösi voi arvostaa, koska heidän ei tarvitse vierittää sivun yläreunaan asti löytääkseen valikon. Ominaisuudet, jotka pitävät käyttäjien mukavuuden mielessä, pitävät myös yleisösi sivustollasi pidempään.

Luova navigointi

Luova navigointi täydentää siististi kuvien ja kuvien lisäämistä verkkosuunnittelussasi. Käytä perustekstivalikon sijasta kuvia linkin merkitsemiseen. Kun käyttäjäsi oppivat, että he voivat klikata kuvia siirtyäkseen sivustossasi, he alkavat etsiä linkkejä epätavallisista paikoista sivustollasi.

Tällainen vuorovaikutus avaa mahdollisuuden luoda pääsiäismunia sivustollesi. Pääsiäismuna edustaa tässä yhteydessä näennäisesti piilotettua sisältöä, joka voi yllättää ja innostaa yleisöäsi, kun he törmäävät siihen.

Loistava tapa näyttää yleisöllesi, että kuva tai kuvake on linkki, on käyttää Animate-sovelluksen Cursor-attribuuttiominaisuutta. Kun yleisö siirtää hiiren osoittimen linkitetyn kuvan päälle, osoitin voi muuttua osoittimesta kädeksi, mikä osoittaa linkin.

Tarinankerronta

Kaikki rakastavat mukaansatempaavaa tarinaa. Joten miksi et suunnittele sivustoa tai animaatiota, joka kertoo yleisöllesi mukaansatempaavan tarinan? Sen sijaan, että luot ravintolan perussivuston, jossa on vain kuvia ruoasta ja ainesosien kuvaukset, miksi et luo mielikuvituksellista taustatarinaa?

Sen lisäksi, että listaat parhaat ruoasi paikallisesti luomuksi, maatilalla kasvatetuiksi, kestävän kehityksen mukaisiksi herkkuiksi, miksi et lisäisi pääruoan ja jälkiruoan väliin tarinaa kihlautuneesta parista? Voit lisätä animaation, jossa sormus putoaa samppanjahuiluun, täydennettynä nousevilla kuplilla.

Sivuston vierailijat ovat saattaneet saapua ravintola-sivustollesi etsimään hyvää ateriaa, mutta he jäävät saamaan lisätietoja siitä, mitä muissa pöydissä tapahtuu. Tarinankerrontasivuston animaatiot eivät vain paranna esitystä, vaan ne voivat yhdistää vierailijoiden elämänkokemuksiin.

Navigointi yhdellä sivulla

Yksisivuiset verkkosivustot – aikoinaan tunnetut esitesivustoina – tekevät paluun. Pitämällä yleisösi yhdellä sivulla, joka voi näyttää useilta eri sivuilta, voit hyötyä vieritystrendistä.

Sen sijaan, että klikkailisit eri sivuja yrittääkseen löytää jotain, yleisösi voi sen sijaan selata sivustoasi edetessään sisällössäsi. Kuvina toimivat linkit voivat myös auttaa yleisöäsi siirtymään suoraan tiettyihin paikkoihin sivustolla, kun he tietävät mitä haluavat – samalla kun he houkuttelevat satunnaisesti etsivää henkilöä.

Luomalla sivuston tässä osiossa kuvatulla tavalla hyödynnät todella muutamia tämänhetkisiä web-suunnittelutrendejä: selaamalla tietoja, käyttämällä enemmän kuvia ja toteuttamalla luovaa navigointia.

Siirtyminen pois salamasta

Adobe Flash oli aikoinaan tulevaisuuden aalto, mutta se aalto on törmännyt rannalle ja uusi aalto on tulossa sisään. Kun Flash oli aiemmin hallitseva työkalu animaatioiden ja verkkosivustojen luomiseen, työkalun kukoistusaika on tullut ja mennyt.

Adobe Edge Animate ei ehkä ole aivan valmis korvaamaan Flashia kokonaan, mutta se on matkalla saavuttamaan juuri sen. Loppujen lopuksi et voi katsella Flashia i-laitteissa, kuten iPhoneissa ja iPadeissa, ja kuka haluaa luoda sisältöä, joka näyttää rikkinäisiltä joissakin suosituimmista mobiililaitteista?

HTML5, CSS3 ja JavaScript

Verkkosuunnittelun ja koodaustekniikoiden maailma kehittyy jatkuvasti. Suuri trendi koodissa on HTML5 ja CSS3, jotka vain juurtuvat yhä enemmän web-o-sfääriin. Google Chrome johtaa viimeisimmät standardit - Firefoxin ja Safarin rinnalla.

Sitten on Internet Explorer – tällä hetkellä hieman myöhässä esiintyminen juhlissa – mutta Microsoft ottaa suuria harppauksia päivittääkseen selaimensa pysyäkseen tahdissa.

Suojaa animaatiosi näyttämästä rikki Internet Explorerin vanhemmissa versioissa käyttämällä Down-level Stagea ja erilaisia ​​verkkojulkaisuvaihtoehtoja, joita Edge Animate tarjoaa. Näissä asioissa pelkkä Adobe Edge Animaten käyttäminen voitaisiin katsoa itse web-suunnittelutrendiksi!

Responsiivinen verkkosuunnittelu

Responsiivinen web-suunnittelu (RWD) on tämän päivän uusinta raivoa. RWD:n ideana on suunnitella yksi sivusto käytettäväksi useilla laitteilla pöytätietokoneiden näytöistä tabletteihin ja puhelimiin. Vaikka verkkosuunnittelijat saattavat olla eri mieltä siitä, luodaanko mobiilisivusto erillään pöytäkonesivustosta vai luodaanko yksittäinen sivusto, joka pystyy vastaamaan selaimen kokoon, suuntaus on kallistumassa reagoivien leirien puolelle.

Syy tähän on melko yksinkertainen: luomalla yhden responsiivisen sivuston sinun ei tarvitse jatkuvasti päivittää kahta eri sivustoa. RWD:n luominen osoittaa tulevaisuuden suuntaan; Mitä kehittyneempiä koodaustekniikoita ja työkaluja tulee, sitä paremmin ne toimivat RWD:n kanssa. Ajattele sitä vielä yhdellä tapaa, jolla Adobe Edge Animate tuo sinut web-suunnittelutrendien kärjessä.