15 Inspiroiva lähestymistapa CSS: ään
HTML vie vain web-suunnittelija tähän mennessä ja jos haluat luoda dynaamisen, houkuttelevan, reagoivan web-suunnittelun niin sinun täytyy oppia ja toteuttaa CSS. Ei vain voit luoda parempia suunnittelualoja sivuillesi, mutta voit odottaa nopeampia latausaikoja, helpompaa ylläpitoa ja vähemmän aikaa uusien sivujen luomiseen tai olemassa olevien päivittämiseen.
Alla on 15 parhaita CSS-verkkosivustoja, jotka tarjoavat erilaisia lähestymistapoja web-suunnitteluvaiheeseen. Kerää joitain inspiraatiota, korjaa CSS-vinkkejä ja ota ne käyttöön omassa suunnittelussa.
Beercamp
Beercamp Beercamp sivusto toimii kuten ponnahdusikkuna ja käyttäjät voivat kääntää sivuja ponnahdusikkunoiden näyttämiseksi. 3D-muotoa voidaan kääntää ja sivut kääntyvät napsauttamalla sivua ja kääntämällä. Sivusto on vuorovaikutteinen, houkutteleva ja värikäs, ja se kiinnostaa sen kävijöitä.
Inzeit
Vaikka se voi näyttää hieman enemmän kuin hyvännäköinen staattinen verkkosivusto Inzeit etusivulle kirjaimellisesti elää, kun alat vierittää sivua alaspäin. Eri kerrokset liikkuvat eri suuntiin ja eri nopeuksilla. Kun kävijöitä on kannustettava tekemään oikeita liikkeitä, sivusto toimii aktiivisena, kun ryhdytään toimiin, jotta kävijät palkitaan toimien toteuttamisesta.
ShockBlast
Shockblast on valokuvagalleria, ja toisesta sivusta latautuu joka hiiren hiiren suunta, joka auttaa tuomaan sivun eloon. Etusivulla on paljon upeita valokuvamalleja, mutta se mahdollistaa ShockBlastin kategorisoimalla ja sivuillaan kuvia, jotka tekevät navigoinnista yksinkertaisen ja erittäin tehokkaan.
TepTek
TepTek TepTek sivusto on toinen, joka sisältää useita intricamente suunniteltuja kerroksia yhdeksi malliksi. Alustava näyttö muuttuu, kun vierität alaspäin ja kehykset rullaavat sivua, sivunumerot näkyvät ja häviävät. Mustavalkoinen väri tarjoaa rapean ja tyylikkään viimeistelyn, joten kävijä keskittyy täysin sisältöön.
FineGoods
FineGoods FineGoods verkkosivustolla on muutama hieno pikku yllätyksiä, jotka odottavat sinua, kun liikutat navigointipaneeleiden yläpuolelle, vieritä sivua alaspäin ja tarkastele hintatunnisteita (HTML-teksti) tarkemmin. Tavaroiden valinta voi olla rajoitettua, mutta se on osa syytä, miksi ainutlaatuinen muotoilu toimii niin hyvin.
Envy Labs
Envy Labs on yksi suosikeistamme. CSS-muunnoksia käytetään muodostamaan pyörivä karuselli ja kun napsautat "seuraavia" ja "edellisiä" kuvakkeita, katselet karusellin pyörimistä, kunnes seuraava kuva näkyy. Loput sivut ovat suhteellisen yksinkertaisia mutta erittäin tehokkaita, jotka käyttävät CSS: ää useilla muilla tavoilla.
Driver Club
Driver Club Driver Club sivusto oli suunniteltu Ubisoftille, kun uusi ohjauspeli julkaistiin ja heti kun vierailet sivustolla näet linkin verkkosivun ja pelin välillä. Toinen hyvä muunnosten käyttö tarkoittaa sitä, että kun vierität alas, koko verkkosivusto näyttää elävän jopa antaa ulkonäön liikkuvan luottoja.
Mammoth Booth
Mammoth Booth on toinen suosikki ja se pelaa teoriaa, että me kaikki haluamme, mitä meidän ei pitäisi. Napsauta Fire-painiketta ja sarja kuvia kasaantuu näytölle ja luo valokuvakotelo. Sivusto on loistava tapa edistää valokuvalevypalvelua, jota yritys tarjoaa.
Jeclat
Syötä Jeclat verkkosivusto ja sinut kutsutaan purjehtimaan ympäri maailmaa, tarkastamaan nähtävyyksiä ja avaamaan sivulevyt. Vieraileminen sivuttain on harvinaista useille verkkokäyttäjille nyt ja napata patsas, joka rakentaa intrigaatiota ja osallisuutta myös käyttäjältä.
Vacheron Constantin
Vacheron Constantin Vacheron Constantin sivusto on ranskalainen, mutta kannattaa käydä, vaikka et lukenut sitä. Napsauta ja pidä alhaalla vierityspainiketta alhaalla ja nauti näytöstä. Tyylikäs verkkosivusto, joka ei vain näytä yhtä tyylikkäitä kelloja, mutta näyttää myös inspiraation malleista.
Nosta interaktiivinen
Joskus yrität liittää liian monta tyylejä ja tehosteita yhdelle sivulle voi osoittautua kalliiksi, kun sivu sekaantuu, mutta näin ei ole Nosta interaktiivinen . Käy ja nauti monia temppuja. Katso 3D-kirjaefektit sekä otsikkokuvien kerrostetut liikkeet.
VZug
VZug VZug sivusto on dynaaminen aikajana. Sen sijaan, että selkeä ja yksinkertainen kuva näytetään staattisella sivulla, kun vierität alaspäin dynaamisessa aikajanassa, saat houkuttelevan ulkoasun ja huomautetun sivun. Sivuston tarkoituksena on juhlia 100 vuotta yrityksen historiaa ja suunnittelu auttaa tekemään sen hyvin.
Dego
Jokainen, joka on pelannut Little Big Planet -pelissä, tunnistaa tämän tyyppisen verkkosivuston tyylin Dego suunnittelutoimisto. Navigointi näyttää näennäisesti satunnaisesta suunnasta ja vie sinut läpi lukuisat vaiheet, joita Dego-suunnitteluryhmä väittää ottavansa asiakkaitaan ja potentiaalisia asiakkaitaan.
WeAreX3
Tämä sivusto on ainutlaatuinen tapa yritys etsiä harjoittelua. Historiallinen scifi-muotoilu yhdistyy ainutlaatuiseen horisontaaliseen sivun vieritykseen ja pystysuuntaisiin elementteihin. Vierailijoille näytetään, kuinka vierittää sivuja ja X3 toivoo, että sivuston ainutlaatuinen ulkoasu ja elementit herättävät sellaista muotoilunharjoittajaa, jota he etsivät.
Cymetriq
Cymetriq on toinen loistavasti suunniteltu salkun tyyppinen verkkosivusto, joka yhdistää useita eri elementtejä ja tyylejä yhdeksi ainutlaatuiseksi katsomalla ja vaikuttavalla sivustolla. Selaa gallerianäytteitä alaspäin, siirrä hiiren osoitin CSS-elementtien navigointipalkin päälle ja jatka selailua ylhäältä alaspäin jonkin tyylikkään tyylin ja mallin mukaan.
Oletteko jättäneet yhden suosikkisi? Oletko ylittänyt yhden esimerkin tästä? Kerro meille kommentit.