9 Pro Vinkkejä Website Design Kaikkien on Read

1. Precedence (taide valvoa Eye)
Hyvä Web design, ehkä jopa enemmän kuin muu suunnittelu, on kyse tiedot. Yksi tärkeimmistä työkaluista teidän arsenaali tehdä tämä on etusijalla. Kun navigoit hyvä suunnittelu, käyttäjä olisi johdettava ympäri ruutua suunnittelija. Kutsun tätä edelle, ja se &todellisten tuloste; s kuinka paljon visuaalista painoa eri puolilla suunnittelua on.
Yksinkertainen esimerkki etusija on, että useimmat sivustot, ensimmäinen asia, näet on logo. Syynä ovat usein se &todellisten tuloste; s suuri ja asetetaan mitä on osoitettu tutkimuksissa olevan ensimmäinen paikka ihmiset etsivät (ylhäällä vasemmalla). Tämä on hyvä asia, koska todennäköisesti haluat käyttäjä heti tietää, mitä sivusto on ne katselee.
Mutta etusija pitäisi mennä paljon pidemmälle. Sinun pitäisi ohjata käyttäjä &'; silmät läpi peräkkäiset vaiheet. Esimerkiksi, saatat haluta käyttäjätunnuksesi mennä logo /tuotemerkin ensisijainen paikannus lausuman, vieressä iskevä kuva (antaa sivuston persoonallisuus), sitten runko teksti, navigointi ja sivupalkin ottaen toissijainen asema sekvenssin.
mitä käyttäjä pitäisi tarkastella on sinun, web-suunnittelija, selvittää.
saavuttamiseksi nimitän edelle sinulla on monia työkaluja käytettävissänne:
1. Sijoitus – jossa jotain on sivulla selvästi vaikuttaa missä järjestyksessä käyttäjä näkee sen.
2. Väri – käyttämällä rohkeita ja hienovaraiset värit on helppo tapa kertoa käyttäjälle, mistä etsiä.
3. Kontrasti – on erilainen tekee asioista erottuvat, samalla sama tekee niistä toissijaisia.
4. Koko – iso menee vähän (ellei kaikki on iso, jolloin pikku voisi erottua ansiosta Kontrasti)
5. Sisustuselementtejä – jos on jättimäinen nuoli osoittaa jotain, arvaa missä käyttäjä näyttää?
2. Väli
Kun aloitin suunnittelussa, halusin täyttää kaikkea käytettävissä olevaa tilaa kanssa juttuja. Luulin tyhjä tila tuntui tuhlaavainen. Kuitenkin, löysin on päinvastainen.
Väli tekee asiat selkeämmin. Web design on kolme osa tilaa, että sinun pitäisi harkitsee:
Riviväli: Kun lay tekstiä ulos, rivien välisen tilan vaikuttaa suoraan miten luettavissa se näkyy. Liian vähän tilaa on helppo silmään leviävät yhdestä rivi seuraavaan; liikaa tilaa tarkoittaa, että kun olet yksi rivi tekstiä ja siirtyä seuraavalle silmä voi eksyä. Joten sinun täytyy löytää kultainen keskitie näiden kahden välillä. Voit hallita riviväliä CSS kanssa &'; line-height &'; valitsin. Yleensä pidän Oletusarvo on yleensä liian vähän väli minun makuun. Riviväli on teknisesti kutsutaan johtava, joka juontuu prosessi, tulostimet tapana käyttää erottamaan riviä tekstiä ennen vanhaan – asettamalla baarit lyijyn rivien välistä.
Täyte: Yleisesti ottaen tekstiä pitäisi koskaan kosketa muita elementtejä. Kuvat, esimerkiksi, ei pitäisi olla koskematta tekstiä, ei pitäisi rajoja tai taulukoita.
Vanuna väli elementtien ja tekstin. Yksinkertainen sääntö on, että sinun pitäisi aina on tilaa siellä. Poikkeuksiakin tietysti, erityisesti jos teksti on jonkinlainen nimikkeen /grapic. Mutta pääsääntöisesti, mikä väli tekstin ja muualla maailmassa tekee äärettömän luettavuutta ja miellyttävä.
Valkoinen tila: Ensinnäkin, valkoinen tila doesnt &'; t tarvitse olla valkoinen. Termi yksinkertaisesti viittaa tyhjässä sivun (tai negatiivinen tilaa kuin se &todellisten tuloste; s joskus kutsutaan). Valkoinen tila käytetään antamaan tasapaino, osuus ja toisin sivulle. Paljon valkoista tilaa taipumus tehdä asiat näyttävät enemmän tyylikäs ja kalliiden, niin esimerkiksi jos menet kallis arkkitehti sivuston, Käytät ll lähes aina nähdä paljon tilaa. Jos haluat oppia käyttämään tyhjämerkkien tehokkaasti, läpi lehden ja katsoa miten ilmoitukset on aseteltu. Mainoksia suurten merkkien kelloja ja autoja, ne ovat yleensä paljon tyhjää tilaa käytetty rakennepiirteellä.
3. Navigointi
Yksi turhauttavaa kokemuksia sinulla voi olla mikä tahansa sivusto on voinut selvittää minne mennä tai missä olet. I &'; Haluaisitko ajatella, että useimmat web-suunnittelijat, navigointi on konseptin &'; ve onnistui mestari, kuitenkin, on aina yksi, joka todistaa minua väärin. On kaksi puolta navigointi pitää mielessä:
Navigation: Minne voi mennä?
On olemassa muutamia järkeä sääntöjä muistaa täällä. Painikkeet matkustaa ympäri sivuston pitäisi olla helppo löytää – yläosaa kohti sivun ja helppo tunnistaa. Niiden pitäisi näyttää navigointi painikkeet ja hyvin kuvattu. Teksti painalluksella pitäisi olla aika selvää, missä se &todellisten tuloste; s vie sinut. Sen lisäksi järkeä, se &todellisten tuloste; s myös tärkeää tehdä navigointi käyttökelpoinen. Esimerkiksi, jos sinulla on rollover alivalikon, varmistaen henkilö voi saada osa-valikkokohdat menettämättä jatkaminen on tärkeää. Samoin muuttamalla väriä tai kuvan jatkaminen on erinomaista palautetta käyttäjälle.
Suunta: Missä olet nyt?
On monia tapoja, joilla voit suunnata käyttäjä joten ei ole mitään tekosyytä olla. Pienissä sivustot, se saattaa olla vain kysymys iso nimikkeen tai &'; alas &'; versio sopiva painike valikosta. Vuonna suurempi sivusto, saatat käyttää leivän sisuksen polkuja, väliotsikot ja Sitemapin todella menetetty.
4. Suunnittelu rakentaa
Life on saanut paljon helpompaa, koska web-suunnittelijat siirtynyt CSS ulkoasuja, mutta jo nyt se &todellisten tuloste; s edelleen tärkeää miettiä, miten aiot rakentaa sivuston kun Käytät uudelleen vielä Photoshop. Mieti asioita, kuten:
Voiko se todella tehdä?
Olet ehkä poimittuja hämmästyttävä fontin kehon kopioida, mutta on se todella standardia HTML fontin? Saatat olla muotoilu näyttää kauniilta, mutta on 1100px leveä ja johtaa horisontaalinen scrollng varten enemmistö Internetin käyttäjistä. Se &'; s tärkeää tietää, mitä voi ja voi &'; t tehdä, minkä vuoksi uskon kaikki web-suunnittelijat pitäisi myös rakentaa sivustoja, ainakin joskus.
Mitä tapahtuu, kun näyttö on koko muuttuu?
Tarvitsetko toistuvia taustat? Miten ne toimivat? Onko suunnittelu keskitetty tai vasemmalle tasattu?
Teetkö sinä mitään, mikä on teknisesti vaikeaa?
Vaikka CSS paikannus, joitakin asioita, kuten pystysuunnassa ovat vielä hieman kivulias ja joskus paras välttää kokonaan.
Voisiko pieni muutoksia suunnittelua yksinkertaistavat miten rakentaa sitä?
Joskus liikkuvat esineen ympäri muotoilu voi olla suuri ero siinä, miten olet koodin CSS myöhemmin. Erityisesti kun elementit suunnittelu rajat toistensa päälle, se lisää hieman monimutkaisuutta rakentaa. Joten jos suunnittelu on, sanovat neljä elementtiä ja kukin alkio on täysin erillään toisistaan, se olisi todella helppo rakentaa. Toisaalta jos kaikki neljä päällekkäin, se voi silti olla helppoa, mutta luultavasti hieman monimutkaisempi. Sinun pitäisi löytää tasapaino sen välillä, mitä näyttää hyvältä ja pieniä muutoksia, jotka voivat yksinkertaistaa rakentaa.
Suurten sivustoja, varsinkin, voitko yksinkertaistaa asioita?
Oli aika, jolloin käytin tehdä kuvan painikkeet minun sivustoja. Joten jos oli ladata painikkeen, esimerkiksi haluaisin tehdä vähän lataa kuva. Viime vuonna tai niin, I &'; ve siirtynyt CSS tehdä minun painikkeita eikä ole koskaan katunut. Toki, se tarkoittaa minun painikkeita Don &'; t on aina joustavuus voisin toivoa, mutta säästöt rakentaa aika ei tarvitse tehdä kymmeniä pientä painiketta kuvat ovat valtavat.
5. Typografia
teksti on yleisin rakenteen osaa, joten se &todellisten tuloste; s ole yllättävää, että miettinyt on mennyt sen. Se &'; tärkeää harkita asioita, kuten:
Font Vaihtoehdot: Erilaiset fontteja sanovat erilaisia ​​asioita suunnittelu. Jotkut näyttävät moderni, jotkut näyttävät retro. Varmista, että käytät oikea työkalu työhön.
Fonttikoot: Vuosia sitten se oli trendikäs olla todella pientä tekstiä. Onneksi näinä päivinä ihmiset ovat alkaneet ymmärtää, että teksti on tarkoitettu luettavaksi, ei vain katsoi. Varmista, että tekstin koot ovat johdonmukaisia, riittävän suuri luettavaksi, ja mittasuhteiltaan niin, että otsikot ja alaotsakkeisiin erottuisivat sopivasti.
Välit: Kuten edellä, väli linjat ja pois muut esineet on tärkeää ottaa huomioon. Sinun pitäisi myös ajatella väli kirjeitä, vaikka Webissä tämä on vähemmän merkitystä, koska sinulla ei' t ole niin paljon valvontaa.
Pituus: Ei ole kova ja nopea sääntö, mutta yleensä sinun riviä tekstiä Ei olisi &'; t olla liian pitkä. Mitä kauemmin he ovat, sitä vaikeampi niitä lukea. Pieni tekstin palstat paljon paremmin (ajatella miten sanomalehden esille, teksti).
Väri: Yksi pahimmista tottumukset tekee matalan kontrastin tekstin. Se näyttää hyvältä, mutta doesnt &'; t lukea niin hyvin, valitettavasti.
Kappalejako: Ennen kuin aloitin suunnittelussa, rakastin perustella tekstiä kaikessa. Se teki mukava reunat molemmin puolin minun kappaleita. Valitettavasti tasattua tekstiä taipumus luoda outo välit sanojen jossa he ovat automaattisesti erillään. Tämä ei ole &'; t mukava silmään lukiessasi, niin kiinni tasattu vasemmalle, ellei sinulla sattuu olemaan maaginen määrä tekstiä, joka sattuu tilaa täydellisesti.
6. Käytettävyys
Web design isn &'; t vain noin kauniita kuvia. Niin paljon tietoa ja vuorovaikutusta voidaan suorittaa Web-sivuston, se &todellisten tuloste; s tärkeää, että te, suunnittelija, säätää kaiken. Tämä tarkoittaa teet Web-sivuston suunnittelu käyttökelpoinen.
Me &'; ve jo keskusteltu joitakin käytettävyyden – valikkoon, edelle, ja tekstiä. Tässä on kolme enemmän tärkeitä:
Kiinni Standardit: On tiettyjä asioita ihmiset odottavat, eikä heille aiheuttaa sekaannusta. Esimerkiksi, jos teksti on alleviivaus, voit odottaa sen olevan linkin. Muunlainen ei ole hyvä käytettävyys käytäntöjä. Toki, voit rikkoa joitakin sopimuksia, mutta useimmat Web-sivuston pitäisi tehdä mitä ihmiset odottavat sitä tekemään!
Mieti, mitä käyttäjät todella tehdä: prototyypit on yhteinen työväline suunnittelu todella &', kokeile &'; suunnittelukilpailun. Tämä tapahtuu, koska usein, kun itse käyttää suunnittelu, huomaat pikku asioita, jotka tekevät suuren eron. ALA oli artikkeli taas takaisin nimeltään koskaan käytä Varoitus When You Mean Kumoa, joka on erinomainen esimerkki pienen käyttöliittymän suunnittelu päätös, joka voi tehdä elämän imeä käyttäjälle.
Ajattele käyttäjän tehtävistä: Kun käyttäjä tulee sivuston mitä he itse yrittää tehdä? Luetella erilaisia ​​tehtäviä ihmiset saattavat tehdä sivuston, miten he saavuttamiseksi, ja kuinka helppoa haluat tehdä sitä heille. Tämä saattaa tarkoittaa, ottaa todella yhteisiä tehtäviä omalla etusivulla (esim &'; aloittaa ostosten &' ;, &'; oppia, mitä teemme, ja' jne.) Tai se saattaa merkitä varmistaa jotain, jolla hakukentän aina helposti saatavilla. Lopussa päivän, Web suunnittelu on työkalu ihmisten käyttöön, ja ihmiset eivät &'; t kuten käyttämällä ärsyttävää työkaluja!
7. Tasaus
pitäminen asioita rivissä on yhtä tärkeää web design kuin se on painatusgrafiikalla. Että &'; s ei ole sanoa, että kaiken pitäisi olla suorassa linjassa, vaan että sinun pitäisi mennä läpi ja yrittää pitää asiat johdonmukaisesti sijoitetaan sivulla. Linjaukseen tekee suunnittelu enemmän tilata ja sulavaa, sekä tehdä se näyttää enemmän kiiltävä.
8. Clarity (Terävyys)
Pidä suunnittelu selkeitä ja tarkkoja on erittäin tärkeää Web design. Ja kun se tulee selkeyden, se &todellisten tuloste; s kaikki noin pikseliä.
CSS, kaikki on pikselin täydellinen niin siellä &'; s mitään syytä huoleen, mutta Photoshop se ei ole niin. Saavuttaa terävä muotoilu joudut:
Pidä muoto reunat napsahti pikseliä. Tämä saattaa liittyä manuaalisesti siivota muotoja, viivoja, ja laatikot jos Käytät uudelleen luoda niitä Photoshop.
Varmista, että kaikki teksti on luotu käyttämällä asianmukaista pehmennystä asetus. Käytän &'; Sharp &'; paljon.
 varmistaminen kontrasti on niin suuri, että rajat on määritelty selkeästi.
 Yli-korostaen rajojen vain hieman liioitella kontrastia.
9. Johdonmukaisuus
Johdonmukaisuus tavalla, jolla kaikki ottelussa. Nimike kokoja, font valintoja, väritys, painike tyylejä, väli, sisustuselementtejä, kuvitus tyylejä, kuva valintoja, jne. Kaiken pitäisi olla teemalla tehdä oman suunnittelun johdonmukainen sivujen välillä ja samalla sivulla.
Pitäminen suunnittelu johdonmukainen on noin on ammattilainen. Epäjohdonmukaisuudet suunnittelu ovat kuin kirjoitusvirheet essee. He vain alentaa käsitys laadusta. Mikä tahansa suunnittelu näyttää, pitää se johdonmukainen tuo aina uusi taso. Vaikka se &todellisten tuloste; sa huono suunnittelu, ainakin tehdä se johdonmukainen, huono suunnittelu.
Yksinkertaisin tapa säilyttää johdonmukaisuus on tehdä nopeasti päätöksiä ja pitää niistä kiinni. Jossa on todella suuri sivusto, mutta asiat voivat muuttua suunnitteluprosessissa.
Ottaa hyvä sarja CSS tyylisivut voi myös mennä pitkä matka tehdä johdonmukainen suunnittelu. Yritä määritellä keskeiset tageja kuten ja

tavalla kuin tehdä oletusasetukset vastaavat asianmukaisesti ja välttää muistaa tiettyjä luokan nimet koko ajan.
.