Sisältö
- Määritä ruudukko
- Neljä hienoa esimerkkiä
- 01. Apple
- 02. Gene's Sausage Shop
- 03. Andy Clarke
- 04. Tyyli-vakooja
Ruudukko ei ole ensisijaisesti visuaalisen suunnittelun työkalu, se on käyttökokemuksen apuväline - kuten kadut kaduilla. Hyvä ruudukko vahvistaa normin ja rytmin verkkosivuston katselemisesta siten, että käyttäjät eivät ajattele, mistä lukea tai katsella seuraavaksi, vaan intuitioivat sen ruudukkoon asettamasi järjestyksen ja hierarkian vuoksi. Voit oppia lisää Grid Theory -suunnittelijan oppaasta.
Jos kaikki kuitenkin noudattaa ruudukon ohjelmaa, menisimme kaikki käkiin visuaalisesta ikävyydestä. Joskus haluamme, että mallissa on elementtejä, jotka ponnahtavat riviltä ja sanovat: "Hei, katso minua! Olen viileä sääntöjen rikkomiselle".
Määritä ruudukko
Jos et määritä ensin vahvaa verkkoa, sen rikkominen ei tarkoita mitään. Vahva puhdas ruudukko, jolla on selkeä rakenne ja runsaasti tilaa hengityshuoneelle, on yksi sisällön hyvän visuaalisen rakenteen tärkeimmistä osista.
Sääntöjen hienovarainen rikkominen voi olla hyvä tapa kiinnittää huomiota suunnittelun yksityiskohtiin. Tehty oikein, se voi auttaa suunnittelua irtautumaan rajoitetusta ja laatikkomaisesta ulkoasusta - yleisestä kritiikistä verkkosuunnittelulle.
Rajan ulkopuolelle vedetty kuva tai tarran tarra, joka on juuttunut pieneen sisältöön, vie pitkälle lisätäksesi mukavan, haastavan yksityiskohdan muotoiluusi. Liian suuri määrä tätä tekniikkaa tappaa kuitenkin vivahteen, ja menetät kiinnostuksen. Valitse sääntösi rikkomalla huolellisesti.
Neljä hienoa esimerkkiä
01. Apple
Pari vuotta sitten Apple.com sai iMacinsa ponnahtamaan sisällön pääkehyksen hyvin määritellyn reunan yli, mikä antaa ymmärtää, että näitä Mac-tietokoneita ei rajoiteta.
02. Gene's Sausage Shop
Voit käyttää merkkiä, tarraa, lippua tai nauhaa rikkoa ruudukko ja toimittaa vähän hauskaa, kuten Gene's Sausage Shop & Delicatessen täällä.
03. Andy Clarke
Hienovarainen, mutta tehokas kuva, joka menee päällekkäin suunnittelija Andy Clarken salkun aiemman toistamisen kanssa. Tämä tekniikka on loistava tapa pitää kuvapino tuoreena.
04. Tyyli-vakooja
Kuvat eivät ole ainoa tapa rikkoa ruudukko. Muotiblogin thestylespy.com otsikkokoodi lentää ehdottamaan energiaa ja hauskaa.
Jos olet nähnyt esimerkkejä sivustoista, jotka rikkovat hienovaraisesti ruudukkoa, miksi et mainitsisi niitä kommenteissa?
Sanat: Matthew Smith
Tämä artikkeli julkaistiin alun perin verkkolehdessä.