Izpētīt labāku tipogrāfiju mūsdienu tīmekļa vietnēs

Digitālo tekstu var formatēt tik daudzos aromātos. Ar turpmāko tīmekļa fontu un pārlūka skriptu attīstību mēs esam redzējuši jaunu projektu izstrādātāju projektu kodu. Arī tīmekļa dizaineri meklē labāko stratēģiju, lai kodētu savas tīmekļa vietnes un veidotu vienotu tipogrāfisko stilu starp visām to lapām.

Daudzi profesionāli web dizaineri ir rakstījuši par šo tēmu, tostarp atjauninātas funkcijas un pakalpojumus. Katrai tīmekļa vietnei ir jāapsver kā vienskaitļa dokuments, kas izslēdz jūsu saknes izkārtojumu. Šajā skatījumā ir viegli redzēt, kā tipogrāfija var plūst no lapas uz lapu un piedāvāt unikālu izeju radošumam. Un tas kļūst īpaši redzams, veidojot unikālas klases jūsu punktiem un virsrakstiem.

Zemāk es pievērsīšos dažām fantastiskām idejām par iecerējušiem tipogrāfijas dizaineriem, kas interesējas par tīmekļa veidošanu. Blogi, sociālie tīkli un uzņēmumi vienmēr vēlas atjaunināt savu pašreizējo tīmekļa vietni. CSS stili tīmekļa tipogrāfijai ir lielisks avots, lai sāktu atsvaidzināt lapas.

Atšķirības mūsdienu internetā

Modernais tīmeklis kopš 2000. gada sākuma ir ievērojami attīstījies. Web dizaineriem ir daudz jaunu iespēju, lai radītu fantastiskus grafiskā dizaina darbus, logotipus, banerus un praktiski kaut ko citu. HTML5 un CSS3 specifikāciju izlaišana arī ir devusi maksu par veco veidu, kā veidot tīmekļa fontus.

Tagad ir pilnīgi iespējams iekļaut savus fontus CSS @ font-face īpašums. Varat izmantot jebkuru TrueType(.ttf) vai OpenType(.otf) failu un kopiju glabā lokāli jūsu serverī. Tad ar dažiem CSS3 burvju iekļaujiet ģimeni jebkur jūsu tīmekļa lapā!

Tikai ar šo metodi ir iespējams redzēt, kā mūsu modernais internets ir kļuvis par attīstītu.

Un ar katru dienu, kad jQuery popularitāte pieaug, nav pārsteigums, ka mēs varam veidot apbrīnojamus animācijas efektus kopā ar pielāgotiem fontiem. Kā alternatīvu iepriekš aprakstītajai metodei, jQuery TTFGen spraudnis ļauj jūsu tīmekļa lapā iekļaut jebkuru TrueType fontu.

Šī metode ir mazliet uzticamāka, jo jums nav nepieciešams moderns pārlūks, kas atbalsta CSS3 standartus, lai tas darbotos. Bet, protams, mantojuma pārlūkprogrammas, piemēram, Internet Explorer 6, cīnīsies, lai tās būtu pareizi.

Bet paldies labestībai lielākā daļa lietotāju ir pārslēgušies uz jaunāku pārlūkošanas programmatūru, kas atbalsta šos standartus! Un, kad jūs izstrādājat tīmeklī, jums ir jāapsver tieši tas, kam ir jūsu tirgus. Jūs nevarat visu laiku iepriecināt visiem, bet jūs varat pārliecināties, ka mēģināt iegūt pietiekami tuvu.

Digitālās tipogrāfijas mērķis

Kāda dīvaina ideja, kas jāapsver, bet kas ir digitālā teksta reālais mērķis? Pārraidīt informāciju, koplietot avotus un piedāvāt savu viedokli interneta lietotāju pasaulē. Teksts ir vienkāršākais mediju veids, lai dalītos domās un idejās. Bet tas ir arī ļoti sarežģīts un satur lielas detaļas, ko fotoattēli / video nevar izmantot.

Jūsu apmeklētāji, visticamāk, atradīs jūsu vietni, pamatojoties uz jūsu teksta vai virsrakstu atslēgvārdiem - tikai vēl viens iemesls, lai pievērstu īpašu uzmanību jūsu tīmekļa kopijai. Un, kad esat ieguvis zināmu uzmanību savai tīmekļa vietnei, jums ir jātur sava koncentrācija. Tas ir visvieglāk izdarāms ar trekniem virsrakstiem un vienmērīgi izvietotiem lapas tekstiem.

Ja rakstāt rakstu vai pamācību, tad jums ir jāizmanto skaidra valoda. Tas ir tikpat svarīga ir jūsu lapas teksta izskats un satura kvalitāte. Jo lielāks ir jūsu teksts, jo vieglāk būs lasīt un meklēt atslēgvārdus. Un tā kā punkti saturēs lielāko daļu jūsu satura, jums vajadzētu pavadīt daudz laika prototipu, lai iegūtu pareizo fit. Punkti tiek izmantoti, lai pārraidītu jūsu ziņojumu bitu lieluma gabalos, kas sadalīti teikumos. Saprast, kā jūs rakstāt un plānojat, lai iegūtu piemērotu lapas izkārtojumu.

Papildus ar lapas tekstu nāk medija un sekundārais saturs. Ja jūsu rindkopās ir primārā informācija, varbūt jums ir grafiki vai attēli, lai izceltu lapu. Šie akcenti ir tikai pareizais pieskāriens, kas ļauj lietotājiem pārvietoties caur jūsu vietni.

Videoklipi un attēli var izjaukt jūsu saturu un likt, ka lasītāji ātri pārvietojas caur jūsu rakstu. Bet izmantojiet šos priekšmetus taupīgi un neļaujiet kaut ko pārspēt jūsu galveno vēstījumu. Lietotāji (galvenokārt) nāk uz jūsu vietni, lai iegūtu informāciju un nevēlas pārāk daudz traucējošu.

Visas citas formatēšanas opcijas tiek izmantotas, lai norādītu funkcionalitāti vai mērķi. Piemēram, hipersaites teksts bieži vien atšķiras no pārējās, lai izceltu “klikšķināms”. Jūs varat strādāt ar trekniem vai slīprakstītiem vārdiem, liekot uzsvaru uz saviem teikumiem. Un, izmantojot bloknotes vai iepriekš formatētu tekstu, var palīdzēt definēt attiecīgi pamata apgalvojumus vai tīmekļa kodu.

Tīmekļa vietņu galvenes

Viens no svarīgākajiem jūsu tīmekļa tipogrāfijas aktīviem ir virsrakstu tagi. Ja neesat iepazinies ar HTML virsrakstiem, sākot no

uz

bijušajam, kuram ir vislielākā nozīme, un vismazāk. Šī atzīme ir noderīga, lai saprastu, jo Google arī nosaka jūsu domēnu un tīmekļa lapas, pamatojoties uz satura struktūru. Tādējādi jūs galu galā varēsiet kontrolēt, kurus atslēgvārdus jūs izmantojat un kādu kategoriju virsrakstus vēlaties.

Lai gan standarta HTML5 specifikācija ietver līdz pat 6 dažādiem virsrakstu stiliem, es ieteiktu izmantot no 3-4. Nav nepieciešams tos visus iekļaut savās lapās. Un tas ir arī ļoti maz ticams, ka jūs atradīsiet lietojumu 6 dažādām pozīcijām. Pirmo reizi sēžot, lai veidotu savus stilus, mēģiniet izstrādāt dažus piemērus, lai redzētu, kas jums patīk.

Photoshop ir lielisks šim scenārijam. Jūs varat arī mēģināt kodēt dažādus HTML virsrakstus, lai redzētu, kā viņi skatās pārlūkprogrammā. Svarīgi ir strādāt ar jūsu lapas plūsmas un dizaina virsrakstiem atbilstoši to rangam.

Piemēram, jūsu

tagiem vajadzētu būt vislielākajiem starp visām jūsu lapas virsrakstiem.

un

ir populārākie tagi, kurus Google iesaka, lai pārlūkotu lapas saturu. Izmantojot dizaina efektus, piemēram, treknraksta fontu, pasvītrojumus, svītrotas robežas vai dažādas krāsas, jūsu virsraksti palīdzēs izlēkt no lapas.

Arī atstatums ir svarīgs kad runa ir par virsrakstiem vai kādu no jūsu satura daļām. Pārliecinieties, vai pievienojat papildu starpību starp virsrakstiem un galveno satura apgabalu. Ja esat izveidojis savu fontu pietiekami lielā mērā, katrai pozīcijai vajadzētu izcelties kā savam galvenajam blokam. Šis izskats ir ideāls, ja vēlaties skaidri uztvert lasītāju uzmanību.

Ēkas unikālās hipersaites

Ir daudz ko teikt par lapu saitēm. Vienā vai otrā veidā savā kodā ir jāizmanto hipersaites. Tie ir ārkārtīgi svarīgi kā galvenā navigācijas saskarne starp dažādām vietnes lapām. Varat arī saiti uz citiem emuāriem vai pat jūsu arhivētiem emuāra ziņojumiem, lai tos vēlāk varētu skatīt.

Jums ir ļoti rūpīgi jāizvēlas saiti, kurā atrodas saite. Šis ir īpašais saturs, kas tiks akcentēts ar saiknes stilu. Piemēram, "noklikšķiniet šeit" ir ļoti populārs un lielākoties tiek izmantots tiešai lejupielādei. Mēģiniet izvairīties no šīs sistemātiskās pieejas un, izmantojot hipersaites tekstu, iegūt mazliet radošu pieeju. Jūsu apmeklētāji daudz biežāk noklikšķina uz saites, ja viņi var arī atpazīt kontekstu un varbūt izdomāt, kāda būs jaunā lapa.

Kad jūs plānojat savas saites, jums jāapsver šādi - kā pārmaiņas izskatīsies jūsu lapas iestatījumos, kāda veida fona krāsu jūs strādājat, un kāda krāsa ir kontrasta teksts?

Saites vajadzētu parādīties acīmredzami no lapas kā klikšķi spējīgas preces - galu galā, tā ir viņu funkcija. Tāpēc vecais zils ar pasvītrotu teksta efektu darbojas tik labi. Bet, ja konstatējat, ka alternatīva krāsa darbojas labāk, jums to vajadzētu izmēģināt. Saites dizainam nav viena izmēra risinājuma. Vienkārši pārlūkojiet tīmekli mazliet un jūs, protams, izveidosiet kaut ko izcilu.

Viens interešu punkts ir dažas iezīmes, kas jums jāmēģina izvairīties. Tādas lietas kā teksta fontu saimes vai fonta lieluma maiņa var būt ļoti kaitinošas. Tas izraisa teksta izkropļošanu un pārvietošanu, kas var novietot peles kursoru tikai no saites zonas. Līdzīgā veidā jums jāizvairās pievienot papildu robežas / polsterējumu savām saitēm vai hover efektiem. Šie darbi ir daudz labāki, ja paliekat vienkārši. Krāsu maiņa vai pievienotais pasvītrojums sniedz lielu pieredzi lietotāja pieredzē.

Stilu sarakstu izveide

Izredzes ir labas, jums ir arī jāstrādā ar sarakstiem kādā brīdī. Iekļauts ir gan pasūtīts, gan neierobežots saraksts HTML. Tie ir ideāli piemēroti, lai piedāvātu nelielu ideju, produktu, cilvēku vai saišu kolekciju ļoti nelielā daudzumā. Stilings nav viss, kas atšķiras no punktiem vai virsrakstiem.

Jūsu apmeklētājiem nekavējoties jāsaprot, ka viņi meklē vienumu sarakstu. Saglabājiet katru saraksta vienumu atsevišķi un atrodas jaunā rindā savā lapā. Ja iespējams, pievienojiet papildu telpu. Tas sniegs elpošanas telpu un parādīsies kā jauks sadalījums raksta tekstam. Ja vēlaties, jūs pat varat treknrakstā norādīt fontu vai ievilkumu, lai atteiktos no standarta izkārtojuma margām.

Papildu funkciju pievienošana, lai palīdzētu jūsu sarakstam izcelties, nav prasība. Bet, ja jums patīk bloku izkārtojuma stils, tas patiešām koncentrējas uz jūsu sarakstiem. Jūs varat mēģināt pievienot gaišu fonu vai ikonas. List Apart ir lielisks pierakstīt par taming sarakstus, kas, manuprāt, ietver dažas ļoti spēcīgs zināšanu bumbas. Bet, ja jūs saglabājat lapas saturu lineāri un izmantojat saraksta blokus tikai tad, kad tas ir vajadzīgs, jums nevajadzētu nonākt nevienā dizaina neveiksmē.

Kā izveidot lapu kotējumus

Citātu un citātu parādīšanās šajās dienās ir ļoti ierobežota. Sākotnējā tīmeklī jūs neredzat ļoti daudz šo elementu. Iespējams, redakcijās, esejās vai mācību darbos. Bet HTML5, protams, ir nedaudz atjauninājis noteikumus, kas padara citēšanas blokus daudz vieglāk.

HTML5 ārsta vietne ietver aizraujošu resursu, lai apspriestu šo precīzo tēmu. Viņi diskutē par satura izmantošanu bloku blokos, kas parādās iekšējā dokumenta struktūrā. Tātad jūs varat iekļaut arī virsrakstus, punktus un pat sarakstus un kājenes. Galvenais a