Sisu intensiivse paigutuse näpunäited ja näited
Veebi terviklike paigutuste loomiseks on oskus ja pühendumus. Veebidisainerid täidavad tööd, kus see kõige enam ei suuda, ja väga keerulisel viisil. Veebilehekülgede kujunemisel oleme näinud vajadust täita rohkem ruumi ja hoida rohkem sisu kui kunagi varem. Kui sa juba mõistad, kuidas veebilehte kujundada, on see tohutu boonus nende meetodite paremaks mõistmiseks. Veebisaidi põhifunktsioonid muutuvad harva. Siiski, kui lehekülje sisu on keskmisest rohkem, ilmnevad muud tegurid, sealhulgas valge ruum, tüpograafia, elementide positsioneerimine.
Me läheme üksikasjalikult, et katta mõned olulised nõuanded sisu intensiivse paigutuse loomiseks. Need võivad ulatuda sotsiaalsete võrgustike rakendustest, suurtest ettevõtete ja ettevõtete veebisaitidest või kõigest vahepealsest. Oluline on endalt küsida "mida ma selle disainiga püüan saavutada?"kui te kujundate lehekülgi, sest see aitab teil laiemat väljavaadet ette näha.
Kohandatud veebilehti
Ükskõik kui kogenud praktiline veebidisain võib olla, on tõsi, et meil kõigil tuli alustada kuskil. Kohandatud veebilehtede kujundamine on üldjuhul esimene samm veebiprogrammi karjääri poole enne tavapäraste specs rakendamist.
Soovitan alati luua väikese loendi lehtelemenditest, mida peetakse malli külge paigaldatuks. Kui need kõik on alla kirjutatud, muutub see kergemini välja halbade ideede väljavõtmiseks või vastamata või unustatud kalliskividele. See sillutab teed ka lihtsale planeerimisele stressist vabaneda.
Paigaldus Wireframe
5-leheküljelise üldise veebilehe puhul näete sageli samu elemente korduvalt. Ülemine nurga logo, juhtnupud, peamine sisupiirkond, mis võib olla jagatud külgriba ja muude funktsioonidega (sisselogimine, otsingukast jne).
Mõtle hea lähtepunktina üksikasjalike lehekülgede paigutamiseks. Paljudel disaineritel on kasulik kavandada võimalikke traatvõrgu kujundeid, et välistada mitte-ilmsed vead. See ei nõua mingit väljamõeldud paberit ja seda on võimalik teha isegi mahajäetud sülearvutil. Traatraami eesmärk on anda ligikaudne ettekujutus sellest, kus saitide paigutus peaks olema ruumi all, et üksikasjad hiljem täita.
Sisu raskete paigutustega tuleb arvestada, kui palju platvorm sisaldab. Suletud 2-3 veeru paigutuse loomine, et võõrustada 100+ lehekülge pikk, keerukas sisu, ei jäta palju ruumi hingamisruumile. Joonistamise ja planeerimise teel saate kontrollida lehekülje sisuks oleva ruumi suurust. See ei hõlma ainult teksti- ega blokeerimisalasid, vaid tegeleb ka piltide ja videotega.
Brilliant White Space
Valge vahekaugus on võimalik kõige olulisem tegur seda tuleb arvesse võtta sisu intensiivsel kujundamisel. Veebisaidi sisu reguleerib seda alll, rohkem kui ükskõik milline tavaline veebisait. Kui lugejad ei suuda sisu mõista, sest ei ole ruumi oma sõnade seedimiseks, on liiklus täpiline ja rahul.
Lõikud ja lehekülje päised on suurepärane koht, kus alustada kohandustega. Kasutades CSS-i omadusi, peaksite olema võimelised manipuleerima väliseid marginaale ja katkestama iga plokirea tekstielemendi. Nende hulka kuuluvad kõik rubriigid 1-6, lõiked, blokkkoodid, nimekirjad, eelvormitud tekst ja mõned väiksemad elemendid.
Kui soovite oma lugeja tähelepanu hoida, on oluline kasutada suuremaid tekstielemente. Lõikud ja väiksemad pealkirjad töötavad kõige paremini 15px-25px alumise marginaaliga. Suuremate leheküljeelementide nagu h1 või h2 puhul kaaluge 35px + (see sõltub ka teie fondi suurusest). Vertikaalsete elementide vaheline kaugus on oluline kerimise ja skaneerimise ajal. Kuid reakõrgus on veel üks oluline CSS omadus, mis mõjutab tekstielemendi ridade vahekaugust. Lõikudel peaks olema nende suuruse poolest palju suurem kõrgus, nii et joonte vahel on palju lisapadjaid.
Mõtle dünaamilised stiilid
Peale vahekauguse, digitaalne tüpograafia tuleks manipuleerida viisil, mis muudab selle lehelt välja. Tänapäeva maailmas on sadu miljoneid veebisaite tavaline näha sama kirjatüüpi (de) kõikjal.
Kui projekteerite veebilehe sisu, mis on sisuga raske, näeb tulemus välja nagu teine lõbus mall. Edukate tüpograafiliste stiilide jaoks on palju omadusi. Teksti varjud, vähem / rohkem tähte, taustaplatvormid, ikoonid ... nimekiri on lõputu.
Tõesti sa oled disainer ja teie viimane sõna on seadus. Planeeringu kujundamine ei ole võrreldav ühe sõidurajaga maanteega, kus pole pööret. Protsessi ajal on teil võimalik minna tagasi ja muuta stiile, manipuleerida uusi elemente või mõista mõiste täielikult. Mõtle mõnda muud kasulikku CSS-i nõu ja mängida, et näha, mis sobib kõige paremini!
Kasutage rippmenüüd
Nii palju sisu on ebatõenäoline, et kõik teie lingid sobivad ühele lehele. Lehekülgede ülekoormuse käsitlemiseks on palju võimalusi. Täiendavate linkide paigutamine külgriba plokkidesse või õmmeldud saidi jalusesse veergudesse on kaks sihipärast valikut.
Kõige mugavam ja mugavam valik on luua rippmenüüst skeem koos peakategooriatega ja alamkategooriatega. Samuti on palju avatud lähtekoodiga skripte, mis pakuvad alamkategooriaid, kui teil on intensiivselt üksikasjalikud teemad.
Tõenäoliselt on kõige kiirem ja kõige vähem heidutav strateegia alustada JavaScripti raamistikust. Mõned kõige populaarsemad on jQuery, MooTools või ehk prototüüp. Kõik need raamatukogud pakuvad dokumentatsiooni ja paljudel on vabad rippmenüüst kättesaadavad skriptid.
Plaani sisu vaated
Praktikas on keerulisem luua lihtsustatud kehaosa, mis sisaldab kogu sisu, mida teie keskmine veebileht sisaldab. Muutuvate brauseristandardite ja pooleldi hämarate mobiilside toega ei ole ime, et näeme selliseid sisult intensiivseid veebisaite maha. Ole tundlik iga veebilehe stiili suhtes. Mõned neist sisaldavad mitmeid pilte, teised võivad sisaldada primaarset graafikat või videot või üldse mitte graafikat. Kui olete lõpliku paigutuse kodeerimise lõpetanud, looge mitu vaadet erinevate HTML-lehekülgedega.
Neil kõigil on sama sisemine märgistus, välja arvatud sisu sisupiirkonnas. Iga üksiku lehekülje vaate saab manipuleerida ja see annab ülevaate lõpptoote kohta. Lülitage see üles, et sisaldada kõiki peamisi vaateid, mida iga lehe puhul vajate. Teised leheküljeelementide näited võivad sisaldada kommentaari lahtreid, videoid või manustatud pilte või jagatud lehekülje linke.
Plaani strateegiad põhjalikult
Tegelikult ei ole täiesti keeruline luua jõuseadme veebiplaani. Paljud disainerid jäävad vähe üksikasjadesse, näiteks kuidas blokeerida elemente või värvi hüperlinke. Need üksikasjad on olulised, kuna nad saadavad kogu kaubamärgisõnumit, isegi väiksemate elementide puhul peaks sõnum olema koos kogu leheküljega. Mentaalselt planeerige oma disaini etapid, et välja selgitada, kuidas iga takistuse jaoks parim viis. Kui te töötate kliendiga, oleks hea arutada, millist tüüpi sisu eelnevalt lehekülgi täidab. See annab sulle võimaluse kavandada ja strateegiliselt kujundada üldise paigutuse parim lähenemine.
Teine eriti droll teema on mobiilne disain. See uus turg näeb tohutut laienemist mitte ainult nutitelefonides, vaid võimsates tahvelarvutites. See tähendab, et kasutajad pääsevad teie paigutusele mobiiliekraanilt - veenduge, et sisu ei ole ülevoolav ja esitleb korralikult.
7 Hea sisu sisu veebilehed
Allpool on toodud mõned populaarsete sisu-raskete veebisaitide ekraanipildid. Need on enamasti tuntud kaubamärgid nii füüsilistel kui ka digitaalsetel turgudel. Vaadake mõningaid allpool toodud ideid, et leida inspiratsiooni oma projektidest. Samuti võite julgelt jagada teiste sisu raskete veebipõhiste paigutustega kommentaaride jaotises.
Clicker
Clicker on uus suhtlusvõrgustiku rakendus TV ja filmiõpilastele. Saate uue konto registreerida ja leida oma lemmik klassikalisi telesaateid, mis on arhiveeritud hooaja ja episoodide loetelus. Saate võrrelda veebisaiti IMDB-ga vähem teabe ja rohkem video sisu abil!
Veebidisaini tulevik
Web Design 2011 tulevik avab Londonis selle tuleval kevadel. Lisateabe saamiseks vaadake kodulehte ja see on suurepärane näide tekstipõhisest paigutuse kujundusest. Kõik üksikasjad on tõeliselt jagatud ja pakuvad kõnelejatele, ajakavadele, seminaridele, sponsoritele ja palju muud.
Lord tõenäoliselt
Selles koomilisel paigutusel on peategelane Lord Tõenäoliselt "cartoonized" ja perforeeritud illustratsiooniks. Sait on jagatud 3 veergu, kus iga uus spordi sisu, reklaamid, söötme lingid ja arhiivid. Disain ise on väga retro ja tark joonistus.
Microsoft
Enamik tech-harrastajatest on Microsoftiga tuttavad. Tegelikult saab enamik inimesi, kes mõistavad, mida arvuti on, anda teile lühikese Microsofti ja Bill Gatesi kirjelduse. Nende koduleht sisaldab sisu kümneid tarkvarapakette, uudiste uuendusi, pressiteateid ja arendaja teavet. Väikesed võimalused lehekülje all on näha vertikaalse vahekaardi menüü, mis sisaldab dünaamilist sisu.
Otsingumootori maa
Search Engine Land on populaarne veebiajakiri, mis keskendub otsingumootoritele ja Interneti-turundusele. Nad värskendavad tihti hämmastavate kvaliteetsete postitustega ja juhivad iga päev sadu tuhandeid inimesi oma saidile. Põhilehekülg jaguneb kolmeks veeruks, mida kasutatakse iga sisumooduli ja reklaami hoidmiseks.
Valge Maja
Ameerika Ühendriikide Valge Maja disain on väga puhas ja professionaalne. Presidendi ajakava ja muude oluliste poliitiliste sündmuste kohta on palju teavet. Üks trikk lehe ruumi leevendamiseks on olnud väikese sisu liuguri lisamine lehe pealkirja suunas. See on suurepärane, kui kuvatakse 3-4 suurt uudiste pealkirja, kui külastajad saidil lehel.
Yahoo portaal
Suure sisuga veebisaitide puhul lähevad Yahoo! peab olema tippu suunav. Yahoo! pakub klientidele sadu teenuseid, sealhulgas veebimeili, uudiseid, videoid ja isegi veebiotsingut. Vaadake mõningaid Y! portaali lingid külgribalt, et näha, kuidas nende mallid võrrelda.
Järeldus
Need on vaid mõned põhipunktid ja sammud konkreetse sisuga nõudlike paigutuste loomiseks. Suure sisuga reservuaaridega veebilehti vaadeldakse sageli koormatena, mis hoiavad SEO sööta ja midagi tegelikku väärtust. Disain on kõike, sest see on esimene mulje, mida kasutaja saab igalt veebisaidilt. Suure mahuga sisu tõttu võib see muutuda segadusega ja üldistamist ületavaks katastroofiks. Ärge kunagi lõpetage praktiseerimist ja vaid mõne projektiga saate meisterlikkuse sisu intensiivsete paigutuste nägemiseks.
