Vizualinio turinio kryptis Ką reikia žinoti
The vizuali turinio kryptimi yra mažiau plačiai aptartas, bet esminis aukšto konversijos interneto dizaino aspektas. Kiekvienas lankytojas pirmuoju puslapiu įkelia naują svetainę - ar tai daro sąmoningai, ar ne.
Estetika atlieka svarbų vaidmenį, bet tai daugiau apie bendras dizaino jausmas. Šį jausmą gali paveikti erdvė, tipografija, simetrija, bet dažniausiai santykiai tarp puslapio elementų.
Dizaineriai nori lankytojų likite puslapyje ir nuolat slinkite užfiksuoti jų dėmesį ir išlaikyti juos dominančius. Projektavimo principai visada turėtų būti sutelkti funkcija prieš formą. Tai reiškia, kad dizainas turėtų papildo turinį, neužklijuokite jo kaip vėlesnio mąstymo.
Šiame pranešime norėčiau parodyti keletą patarimų, kaip galite pagerinti savo išdėstymus ir vaizdo turinį svetainėje.
Dėmesys kompozicijai
Kiekviena svetainės dalis sukurta pagal bendrą išdėstymą. Šis bendras išdėstymas sukuria kompoziciją, kuri atitinka Gestalto teorijos taisykles visuma yra didesnė už dalių sumą.
Atskiros puslapio sritys susitinka sudaro visumą. Dizaino elementai turi būti sukurti a gravitacinis traukimas apie turinį; viskas puslapyje turėtų natūraliai veda lankytojus toliau, kol jie pasieks puslapio apačią.
Štai kodėl santykiai tarp skirtingų turinio dalių (vaizdai, tekstas, mygtukai ir kt.) Yra labai svarbūs dizainui.
Jūsų tikslas turėtų būti skatinti žmones naršyti svetainę nuo savo polinkio. Tai lengviau pasakyti, nei padaryti, bet jūs galite daug išmokti tikrus pavyzdžius.
Monkopo pagrindinis puslapis yra puikus vizualinės hierarchijos pavyzdys teksto ir vaizdo. Tarp elementų yra daug vietos, o tipografija papildo firminius vektorinius iliustracijas.
Naršydami pastebėsite tiesūs horizontalūs puslapių blokai padalintas iš spalvų, sienų ir grafikos. Jie yra pastatyti dizaino modelius omenyje pasiūlyti nuoseklumą visą puslapį.
Dugno link rasite a dviejų stulpelių padalijimas vaizdus vienoje pusėje, tekstą iš kitos pusės. Vaizdai taip pat apsikeitimo pusių dešinėje kairėje dešinėje kairėje. Tai atkreipia dėmesį ir sugriauna monotoniją tipiško puslapio išlaikyti natūralų srautą turinio.
A panaši dizaino estetika galima rasti „Picjumbo“ tinklalapyje, „Photoshop“ ir „Sketch“ naudotojų nuotraukų priedų puslapyje.
Pagrindinis puslapis sutelkia dėmesį į logotipą ir peržiūros vaizdo įrašą. Naršydami pastebėsite tinkamas animacijas, kurios judės per visą puslapį. Ši animacija tikrai atkreipia dėmesį, ir gauna žiūrovą domina toliau slinkti.
Apskritai, puslapis jaučiasi atviras ir lengva naršyti. Turinys yra suskirstyti į horizontalius blokus su aiškia tipografija ir švariomis piktogramomis.
Apsvarstykite, kaip skirtingi puslapių elementai subalansuoti, erdvė tarp elementų, kontrastas tarp spalvų ir skirtingų formų. Visi šie dalykai atlieka bendrą vaidmenį. Kiekviena svetainė natūraliai patenka į turinį.
Nėra absoliutaus atsakymo, nes jis skiriasi kiekvienoje svetainėje. Pavyzdžiui, kai kurios navigacijos nuorodos atrodo geriau, kai jos yra didelės ir negabaritinės. Kiti tinka geriau, kai jie mažos su didžiosiomis raidėmis.
Siūlome studijuoti kitas svetaines savo nišoje. Tikrai analizuokite, kaip jie sujungti. Netgi pabandykite pertvarkyti išdėstymus, kad pamatytumėte, kurie elementai pagaliau padarys dizainą „susilieja“.
Tipo projektavimo klausimai
Kaip projektuojate savo tipografiją turinio kryptį svetainėje. Tai susiję su tipo hierarchija ir įvairių puslapių elementų dizaino stiliai kaip pastraipos, antraštės, užrašų sąrašai, kabutės ir specialieji išdėstymo elementai, pvz., stulpeliai ar lentelės.
Vizualai taip pat gali paveikti maketą, todėl yra gera idėja kurti turinį su natūraliu progresavimu. Rašykite turinį taip, kad srautas žemyn, ir saugo žmones skaitymo per kiekvieną pastraipą.
Didžiausia jūsų turima priemonė yra jūsų akis dizainui. Sužinokite, kaip atpažinti tipografinių elementų skirtumus ir kaip jie susiję su kitais puslapio elementais. Sukurkite ryšius tarp puslapio sekcijų, kad būtų galima atskirti turinio sritis.
Keli dalykai, kuriuos galite apsvarstyti:
- Teksto dydis
- Šrifto šeima
- Spalvų kontrastas
- Puslapio sekcijos santykiai
- Linijos aukštis ir pastraipos paraštės
- Tarpai tarp raidžių ir didžiosios / mažosios raidės
Pavyzdžiui, žiūrėkite kampanijos monitoriaus pagrindinį puslapį. Viršutinės navigacijos nuorodos naudoja visas dangteles su mažomis raidėmis. Kitos antraštės puslapyje vadovaukitės tais pačiais dangteliais kuris sukuria vienodumo jausmą.
Kitos didesnės svetainės antraštės yra daug labiau pastebimas, ir jie tikrai šokinėja iš puslapio. Tiesiog žiūrint į tipišką antraštės dizainą, jis turėtų būti lengvas Pasakyk skirtumą tarp antraštės ir suporuotos kūno kopijos.
„Kampanijos monitoriaus“ tipografiniai stiliai yra išskirtiniai, ir jie natūraliai susilieja į maketą. Tokio rezultato pasiekimas reikalauja praktikos, bet kuo daugiau bandysite, tuo lengviau.
Jei norite sužinoti daugiau, labai rekomenduoju šias nuorodas:
- Projektavimo principai: vizualinis svoris ir kryptis
- Darbas su vizualiniu svoriu jūsų dizainuose
- 19 Veiksniai, darantys įtaką kompoziciniam balansui
Orientacinis turinys
Suprasti tai skirtingų tipų svetaines turėti skirtingus metodus lankytojams per svetainę. Pavyzdžiui, nukreipimo puslapiai nori lankytojus nukreipti informacijos santraukos, mažos piktogramos, ekrano nuotraukos, ir atsiliepimai.
Kitos svetainės, pvz., Dienoraščiai, paprastai neperkelia žmonių į pagrindinį puslapį. Dauguma žmonių nusileisti ant straipsnio puslapio, todėl tinklaraščio įrašų išdėstymai skirti paryškinkite antraštę, ir atkreipkite žmones į turinį. Tai yra vieta, kur žaidimo kokybė rašoma, nes norite, kad skaitytojai pakabintų kiekvieną žodį.
Reikia socialinių tinklų ir žiniatinklio programų kokybišką vartotojo patirtį, taigi tai šiek tiek kitokia tema, bet apsvarstykite, kaip „Facebook“ kanalas yra sukurtas skatinti naršymą ir vartotojo sąveiką.
Naudojami projektavimo metodai, kad žmonės galėtų naršyti svetainėje laikui bėgant. Bet apskritai jūsų tikslas yra padės lankytojams vizualinio turinio kryptimi.
Pažvelkime į a nukreipimo puslapis ir a dienoraščio dizainas pastebėti skirtumus.
Kaktusas yra statinis svetainės generatorius OS X. Jų pagrindinis puslapis atidžiai seka „Apple“ dizaino stilių - daug erdvių ir plonų sans-serif šriftų.
Turinys yra suskirstytas į stulpelius, blokus ir teksto dalis su paprasta grafika. Tos pačios estetikos yra bendras su Apple produktais, todėl „Mac“ naudotojai galės mėgautis šiuo dizainu.
Informacija apie gaminį, įskaitant funkcijas ir sąranką, yra nurodyta pagrindiniame puslapyje. Pats puslapis skatina slinkti naudojant unikalų turinį, pagrindines piktogramas ir kintamąjį kairiojo / dešiniojo turinio blokų stulpelį.
Tikslas yra pateikti informaciją esamų vartotojų, parduoti naujų vartotojų Kaktuso idėja.
Dabar palyginkite šį dizainą su „The Next Web“ pagrindiniu puslapiu. Turinys yra daug sporadiškesnis dienoraščio pagrindiniame puslapyje, nes yra daug skirtingų pranešimų temų.
Stačiakampiai sukuria tinklelio sistemą, kuri apgaubia kelis įrašus į vieną išdėstymą. Tikslas yra gauti naudotojų skaityti turinį svetainėje. Nesvarbu, ar lankytojai parsisiunčia ką nors, bet nesvarbu, ar jie laikykitės, kad kažką perskaitytumėte.
Yra būdas, kaip žmonės skaityti puikios nuotraukos ir intriguojančios antraštės. TNW atlieka puikų darbą, o jų išdėstymas yra pastatytas siekiant išlaikyti žmonių naršymą su susijusiomis pranešimų miniatiūromis šoninėje juostoje ir po turinio.
Kiekvienos svetainės lankytojai yra skirtingi. Bet jūs galite daug išmokti mokydamiesi, ką daro kitos sėkmingos svetainės, ir išmokti kopijuoti.
Pasitikėkite savo akimis
Individualios projektavimo savybės gali būti paaiškintos analitiniu būdu, tačiau kiekvienos svetainės įgyvendinimo pokyčiai. Hero vaizdas su nuoroda „Toliau“ nevykdo to paties visose svetainėse.
Mokymasis kurti yra labai a vizualinis procesas. Jūsų akis už dizainą yra svarbiausias aspektas. Tau reikia pamatyti dalykus tinkamai tai nustatyti vizualinė hierarchija. Jei matysite jį kitose svetainėse, galėsite jį kopijuoti savo svetainėse.
Geriausias patarimas tik pasitikėkite savo akimis. Sukurkite mėgstamų svetainių sąrašą ir praleiskite 5 minutes naršydami kiekvieną. Užsirašykite savo mėgstamus elementus puslapyje ir kaip jie veikia dizainą. Tai padės jums internalizuoti šias sąvokas iš UI / UX perspektyvos, o ne vartotojo perspektyva.
Taip pat nebijokite pabandyti dalykų! Niekas negerėjo dizaino tiesiog skaitant straipsnius apie dizainą. Taip, jie padeda - jie iš tikrųjų gali daug padėti. Bet tu reikia į sukurti dalykų nuo nulio, kad sužinotumėte, kas veikia ir ką ne.
Mokykite savo akis mokydamiesi norimų svetainių išdėstymų ir atkurkite juos. Laikui bėgant, savo prote sukursite modelio biblioteką, kuri padės lengviau kurti naujas svetaines.
Apvyniojimas
Tikimės, kad šie patarimai bus pradėti ir suteiks jums pagrindinį veiksmų planą. Tai nėra lengva tapti žiniatinklio dizaineriu, bet pasauliui reikia talentų, ir niekada nebuvo taip paprasta išmokyti šių pagrindinių sąvokų.
Tyrimas geriausius tinklalapių su puslapių elementais pavyzdžius. Traukinys atpažinkite santykius ir greitai plėtoti įgūdžių, reikalingų kartoti tuos santykius savo darbe.
