Typografi i webdesign: grundlæggende og brugsregler. Prøv at bruge standardskrifttyper

Verden af ​​webdesign har gennemgået en lang proces med at introducere typografiske effekter på websteder. Sådanne effekter for et par år siden var enten umulige eller understøttet af en eller to browsere. Heldigvis har dette ændret sig, og vi nyder en kreativ eksplosion i brugen af ​​typografi på hjemmesider. I dette tilfælde forbliver ressourcerne tilgængelige og vises korrekt. I løbet af de sidste par år er der kommet flere skrifttyper, designstile, overlejringseffekter, ikoner og emoji i teksten, hvilket gør teksten mere varieret, rigere og mere udtryksfuld.

Store skrifttyper

Brugen af ​​store fede skrifttyper- trend. Det giver teksten personlighed og fortrænger gradvist billeder fra hovedpositionerne. Typografi indtager en ledende rolle og erstatter billeder og videoer, som mister meget af deres effektivitet på mobilenheders skærme.

Seriffer kommer tilbage

Serif-skrifttyper er en gammelt glemt ting på det seneste er blevet så populær, at det er blevet til noget helt nyt. Store serif-skrifttyper er symbolet på 2018! Så tag den glemte Clarendon fra hylden, du får brug for den igen!

Typografi ud over standardlayouts

Tendenser tyder på, at penseltegnede skrifttyper mister popularitet. Netverdenen er ved at blive erobret af 3D-stile, illustrerede skrifttyper, animerede, mere livlige bogstaver. Designere forlader klassiske gitterlayouts uden tøven. Tekster på hjemmesider minder mere og mere om typografi i udgivelsesdesign. Lad os sige "tak!" progressiv standardisering af Flexbox og CSS Grids og introduktion af variable skrifttyper.

Første roller i teksten

Teksterne på siden udfører ikke kun en æstetisk funktion. Typografi er en måde at udtrykke et produkts personlighed, dets stemme og intonation på. For at forstærke denne effekt bruges alle mulige værktøjer: ikoner, emoji, piktogrammer, lyd- og billedoverlejring. Tekst er nu så respekteret, at et almindeligt tekstafsnit kan være et af hovedelementerne, nogle gange endda konkurrere med overskriften.

Tekst dekoration

Der er mange typiske (og fuldstændig atypiske) måder at formatere tekst på. Jeg kan kombinere klassisk understregning og kursiv i ét afsnit forskellige størrelser. Sådan lægger vi vægt og styrker budskabet. Spredt i teksten er en række museover-effekter, farverige understregningseffekter, konturskrifttyper, typografiændringer, skift mellem serif- og sans serif-skrifttyper (nogle gange i samme sætning), ikoner, emojis. Alt dette forfølger både dekorative og semantiske mål. EN hovedopgave— gør teksten så dynamisk som muligt. Kombinationerne af designmetoder er uendelige, og mange er resultatet af eksperimenter i nutidens modetrends - brutalisme og maksimalisme.

Udvikling af afsnittet

Skriftstørrelser og afsnitslængder er vokset overraskende hurtigt på det seneste. Artiklens forfattere kunne ikke lade være og lavede en lille graf over, hvordan afsnit udviklede sig i webdesignets historie.

Typografi trends 2018

Her er lidt om, hvilke typografiske tendenser, der hersker i 2018:

I dag har webdesignere nok værktøjer og værktøjer i deres hænder til korrekt at præsentere tekst på hjemmesider. Desværre, enten på grund af mangel på tid eller uvidenhed, bruger ikke alle udviklere aktivt selv de mest grundlæggende regler for typografi. Mange mennesker forstår ikke, hvorfor de bøvler med webtypografi i første omgang, hvis der er en masse andre elementer til at designe websider.

Formålet med ethvert websted er et målrettet informationsbudskab, og det første, de besøgende er opmærksomme på, er naturligvis teksten. Det viser sig, at den overordnede succes for et webprojekt afhænger af kvaliteten af ​​den information, der gives? Lad os finde ud af det.

Faktisk er der visse forhold, hvorunder typografi er praktisk talt ligegyldig. De er som følger:

  • der er ingen grund til at skabe og yderligere vedligeholde billedet af en webressource;
  • information videregives til slutbruger brug af medier;
  • tekstdelen af ​​siden er så unik, at der ikke er behov for at præsentere den for brugeren på nogen særlig måde.

I betragtning af det faktum, at internetpladsen er på stadiet af permanent udvikling, er det unikke ved enhver webressource ret relativ. I sidste ende, normalt blandt konkurrerende websteder med næsten det samme indhold, vinder den mest effektive. Brugen af ​​typografi i webstedsdesign bestemmer i høj grad denne effektivitet. Som du kan se, er der heller ingen måde at undvære det her.

Regler og grundlæggende om typografi i webdesign

Fordi typografi er så vigtig, når man laver hjemmesider, er der visse regler for brugen af ​​den.

Skrifttype til webstedet

Det korrekte valg af skrifttype bestemmer i høj grad webstedets koncept og påvirker den overordnede opfattelse.

Top tip! Du bør ikke bruge skrifttyper til webstedet, der ikke er tilgængelige som standard. Desværre lige nu automatisk installation skrifttyper giver ikke altid resultater, og der er en risiko forkert visning websted i brugerbrowsere.

Tekst dekoration

Korrekt computer sæt- en af ​​sektionerne af typografi.

Placer tegnsætningstegn, mellemrum, parenteser, bindestreger, anførselstegn osv. korrekt nogle kræsne brugere er nogle gange endda ufrivilligt opmærksomme på disse typer fejl.

Makro- og mikrotypografi i hjemmesidedesign

Makro typografi - generel struktur tekstdel i sammenhæng med webstedsdesignet som helhed. Og tekstens design (mellemrum mellem ord, afstand mellem linjer, skrifttyper osv.) små detaljer) - det er det allerede mikrotypografi.

Makrotypografi giver dig mulighed for at vælge den rigtige farve, skrifttyper og gøre tekstblokken solid og levedygtig, og selve webstedet attraktivt og organisk. Mikrotypografi er designet til at gøre indhold let at læse.

For eksempel, da designeren oprettede webstedet www.crowleywebb.com, stolede designeren netop på makro- og mikrotypografi:

Sådanne websteder kan i øvrigt også oprettes baseret på skabeloner. Et eksempel er en HTML-skabelon:

Skriftstørrelse og stilsæt

Den mest behagelige skriftstørrelse i tekst er 12-16 pixels. Men overskrifter og underoverskrifter (H1, H2, H3) er normalt noget større. Det er meget vigtigt at udvikle dit eget stilsystem og bruge det i alle tekst design på ressourcen. Det er tilrådeligt at bruge til overskrifter og citater forskellige muligheder stilen på den anvendte skrifttype, eller prøv at bruge en helt anden skrifttype for at få speciel kontrast. At fokusere mest på vigtige steder i teksten skal den fremhæves med fed eller kursiv. For eksempel som på hjemmesiden www.hausofdesign.co.uk:

Gode ​​layoutteknikker

Læsbarhed af tekster er det, der sikrer succes.

Sådan kan det se ud på et eksempelwebsted:

Og dette er et eksempel på et vellykket flash-skabelonlayout. For at se det mere detaljeret, klik på billedet.

Eksperimentering opfordres her, men gå ikke for langt ud over de almindeligt accepterede regler.

CSS stilarter

CSS-styling hjælper med at eliminere eventuelle mangler - skriftstørrelser, farver, uspecificerede skrifttyper osv. CSS sikrer enhed og konsistens af typografi på tværs af alle sider på et websted. Selvom du tydeligt overvåger for eksempel rækkefølgen af ​​brug af visse skrifttyper på en ressource, kan selv den mindste afvigelse fra stilen forårsage dissonans i opfattelsen. Det er derfor, du ikke bør ignorere brugen af ​​style sheets.

Justering af tekst i blokke

Her er det nemmere at sige, hvad man ikke skal gøre. Du bør ikke justere teksten til midten eller endda til bredden. Skarvede kanter Centreret tekst på siderne gør det ofte svært at læse. Tekst i bredden forkæler oftest også visuelt blokken med indhold. Den almindeligt accepterede regel for at arrangere tekst på en hjemmeside er at justere den til venstre eller søge alternativ måde præsentation af information.

MED udvikling af HTML og borde CSS stilarter Der er flere og flere muligheder for at organisere sig tekstoplysninger på hjemmesidens sider. Nu, i stedet for billeder, der viser overskrifter og andre sektionsnavne, bruger professionelle designere typografiregler.

Godt typografisk design - effektiv måde for at implementere en original designidé er reglerne for webtypografi dog ikke så enkle, som de måske ser ud til. Ud over teori skal du højst sandsynligt have din egen flair, smag og en vis mængde erfaring. Selvom ingen har aflyst eksperimenter. Eksperimenter og må kraften være med dig!

P.S. Hvordan kan du lide artiklen? For at være ærlig, så skrev jeg det ikke. Faktisk har jeg aldrig publiceret gæsteindlæg og alle artikler på bloggen er skrevet af mig personligt. Men da Olga Vladyko, en af ​​forfatterne af TemplateMonster Russia-webstedet (dette er i øvrigt hendes artikel) kontaktede mig og tilbød at samarbejde med dette populære projekt, sagde jeg ja.

For det første er dette ikke et reklameindlæg, der er publiceret for penge, men en artikel, som jeg er sikker på vil være nyttig for mange af mine læsere. Eller tager jeg fejl? For eksempel bruger jeg som mange tegnet "-" i stedet for "-", osv. Det er bare mere praktisk, selvom det ikke er korrekt. Generelt vil det ikke skade os at kende reglerne for webtypografi.

En anden grund er, at min artikel konsekvent bringer søgegæster ind. Det betyder, at mange mennesker er interesserede i emner for siden. EN SkabelonMonster Rusland er den russiske afdeling af www.templatemonster.com - en af ​​verdens førende inden for webdesign, produktion og salg af hjemmesideskabeloner af høj kvalitet. Deres partnere omfatter: kendte mærker, som 1C-Bitrix, REG.RU, UMI.CMS osv.

Her finder du skabeloner for enhver smag: HTML, Flash, til CMS og blogs, Facebook skabeloner, til onlinebutikker og mobile enheder. Dette vil gøre det nemt. Jeg anbefaler at kigge nærmere på TemplateMonster Russia-webstedet, måske er det det, du har ledt efter i lang tid. Se nu videoen, hvor virksomhedens medarbejdere fortæller om sig selv. Hej alle sammen!

Kommunikation spiller en stor rolle i design. Det er meget vigtigt at skabe en stærk forbindelse mellem hjemmesiden og brugeren selv og så hjælpe ham med at nå sine mål. Når vi taler om kommunikation i forbindelse med webdesign, taler vi normalt om tekst. Typografi er en integreret del af denne proces:

Mere end 95 % af informationen på internettet opbevares i skriftlig form.

God typografi gør information let tilgængelig, mens dårlig typografi kræver indsats for at forstå teksten. Som Oliver Reichenstein bemærker i artiklen "Webdesign er 95% typografi":

Typografioptimering handler om at optimere læsbarhed, tilgængelighed, brugervenlighed (!) og at opnå grafisk balance generelt.

1. Brug et minimum antal skrifttyper

Ved brug mere end 3 forskellige skrifttyper din hjemmeside mister struktur og ser uprofessionel ud. Husk, at overforbrug af skriftstørrelse og stil kan ødelægge ethvert layout.

For at forhindre denne situation skal du prøve at holde antallet af anvendte skrifttyper på et minimum.

Generelt skal du holde antallet af skrifttyper på et minimum (to er mere end nok, én er ofte nok) og holde dig til at bruge de samme på hele dit websted. Hvis du beslutter dig for at arbejde med mere end én skrifttype, skal du sørge for, at skrifttypefamilierne matcher hinanden med hensyn til bogstavbredde. Tag et kig på eksemplet nedenfor. Kombinationen af ​​Georgien og Verdana (til venstre) har generelle karakteristika, som giver dem mulighed for harmonisk at kombinere med hinanden. Lad os tage kombinationen af ​​Baskerville og Impact (til højre) til sammenligning. Den "tunge" Impact undertrykker sin "hak"-partner.

Sørg for, at skrifttypefamilier matcher hinanden med hensyn til bogstavbredder

2. Prøv at bruge standardskrifttyper

I skrifttypetjenester (for eksempel Google Web Fonts eller Typekit) kan du finde mange interessante, der vil tilføje noget nyt og usædvanligt til dit design. Derudover er de meget nemme at bruge. Tag Google for eksempel:

1. Vælg en hvilken som helst skrifttype. Lad os sige Open Sans.

2. Generer koden og indsæt den i

Din HTML. 

3. Færdig!


Men hvad kunne gå galt?

Faktisk har denne metode et alvorligt problem - brugere er vant til standardskrifttyper og læser tekst skrevet i sådanne skrifttyper hurtigere.

Normalt er den bedste løsning at bruge systemskrifttyper(Arial, Calibri, Trebuchet osv.). En undtagelse kan være behovet for at holde sig til nogle skrifttyper, som klienten selv har angivet: for eksempel til branding eller for at skabe noget mindeværdigt. Husk at god typografi påvirker læsningen af ​​teksten, ikke visuel perception skrifttype.

3. Begræns linjelængde

Det korrekte antal tegn på én linje er nøglen til at gøre din tekst let at læse. Når du vælger tekstens bredde, bør du ikke fokusere på dit design, men på den skrevne teksts klarhed og præcision. Overvej dette råd fra Baymard Institute:

"Hvis du ønsker, at din læser skal være komfortabel, bør hver linje ikke indeholde mere end 60 tegn. At have det rigtige antal tegn på én linje er nøglen til at gøre din tekst let at læse."

Hvis linjen er for kort, bliver dine øjne nødt til at skifte fokus ofte, hvilket vil forstyrre dit læsetempo. Hvis linjen er for lang, bliver læserens øjne tværtimod nødt til at fokusere på det skrevne i lang tid. Foto: Materiale Design

For mobile enheder skal du holde dig til 30-40 tegn pr. linje. Nedenfor er et eksempel på to websteder, der er åbnet på mobile enheder. På én linje indeholder fra 50 til 75 tegn ( bedste mængde tegn per linje for trykt tekst og computeropløsning), og på den anden ser vi de optimale 30-40 tegn.

I webdesign kan du opnå det nødvendige antal tegn ved at reducere bredden af ​​tekstblokke ved hjælp af ems eller pixels.

4. Vælg skrifttyper, der er lette at læse i enhver størrelse

Brugere vil få adgang til dit websted fra forskellige enheder, som derfor har forskellige størrelser og opløsninger. Flertal brugergrænseflader brug tekstelementer af forskellig størrelse (kopi-knap, feltetiketter, afsnitsoverskrifter osv.). Du skal vælge en skrifttype, der vil se godt ud og forblive læsbar i enhver størrelse.

Roboto fra Google

Sørg for, at den skrifttype, du vælger, er nem at læse på små skærme! Undgå at bruge kursive skrifttyper såsom Vivaldi (billedet nedenfor): selvom de ser smukke ud, kan de nogle gange være svære at forstå.

Brug Vivaldi skrifttype gør det svært at læse tekst på en lille skærm

5. Brug skrifttyper med tydelige bogstaver

Mange skrifttyper er designet på en sådan måde, at det nogle gange kan være meget nemt at forveksle lignende bogstaver, især "I" og "L" skrevet med latinsk skrift (som på billedet nedenfor). Hos nogle er bogstaverne placeret så tæt på hinanden, at kombinationen af ​​"r" og "n" kan forveksles med bogstavet "m". Derfor skal du, når du vælger en skrifttype, teste den i forskellige sammenhænge. På denne måde kan du sikre dig, at læseren ikke får problemer med at forstå teksten på grund af skrifttypen.

6. Undgå kasketter

Tekst skrevet med caps - eller alene med store bogstaver- velegnet til situationer, hvor brugeren ikke er involveret i læseprocessen (f.eks. i forkortelser eller logoer). Men i andre tilfælde skal du ikke tvinge dine læsere med tekst med store bogstaver. Som Miles Tinker bemærker i sin berømt værk"Læsbarhed af tryk", sådan tekst læses meget langsommere end tekst skrevet med små bogstaver.

7. Hold linjeafstand på et minimum.

I typografi er der en særlig betegnelse for afstanden mellem linjer - førende (eller linjeafstand). Ved at øge indføringen øger du det lodrette mellemrum mellem linjer og forbedrer derved læsbarheden af ​​tekst på skærmen. I henhold til reglerne, for at sikre tekstens læsbarhed, skal led være cirka 30 % større end tegnets højde.

Korrekt linjeafstand fremmer bedre læsbarhed af teksten. Foto: Microsoft

Ifølge Dmitry Fadeev øger korrekt valgt afstand mellem afsnit læseforståelsen med 20 %. Designerens evne til at arbejde med hvidt rum giver brugerne mulighed for at absorbere hele tekstens indhold uden at gå glip af nogen detaljer.

Til venstre: Teksten er skrevet næsten glat. Højre: Korrekt linjeafstand forbedrer tekstens læsbarhed. Foto: Apple

8. Sørg for at have god farvekontrast

Brug ikke de samme eller lignende farver til tekst og baggrund. Jo bedre teksten er synlig, jo bedre hurtigere brugere vil være i stand til at læse den og fange hovedpunkterne. Konsortium World Wide Web anbefaler at bruge følgende forhold til brødtekst og billedtekst:

  • Små tekster skal have et kontrastforhold på mindst 4,5:1 i forhold til baggrunden.

  • Store tekster (fra størrelse 14 med fed skrift / fra størrelse 18 og opefter i standardskrift) skal have et kontrastforhold på mindst 3:1 i forhold til baggrunden. 


Denne tekst er ikke i overensstemmelse med standarden farvekontrast, så det er svært at skelne det fra baggrunden.

Denne tekst følger farvekontraststandarden, så den er let at læse.

Hvornår hentede du farveskema, skal du give din tekst at læse rigtige brugere og gerne på flere forskellige enheder. Hvis test afslører problemer med tekstgenkendelse, kan du være sikker på, at mange brugere kan støde på det samme problem i fremtiden.

9. Undgå at bruge rød eller grøn i din tekst.

Farveblindhed er et ret almindeligt fænomen, især blandt mænd (8 % af den mandlige befolkning er farveblinde). Derfor er det tilrådeligt at bruge nogle andre tegn udover farve til at fremhæve vigtig information. Forsøg også at undgå at bruge rød og grøn, da det er de farver, som oftest ikke genkendes af farveblinde.

10. Undgå at bruge flimrende tekst

Oplysninger, der blinker eller flimrer, kan forårsage ubehag for modtagelige brugere. Ud over at du bliver syg, kan dette også forårsage irritation for mange læsere, da det vil distrahere dem fra læseprocessen.

Brug ikke flimrende tekst!

Konklusion

Typografi er en meget vigtig ting. Gør rigtige valg, bringer du klarhed og klarhed til hjemmesiden. Samtidig kan det forkerte valg føre til uopmærksom læsning af teksten, da det afleder al opmærksomhed til sig selv. Typografi skal være læsbar, klar og forståelig.

Typografi skal respektere indholdet

Dette indebærer, at læseren aldrig skal føle sig utilpas, mens han læser teksten.

  • Typografi
  • Denne artikel hjælper dig med at forstå de grundlæggende termer i typografi. Og for at gøre informationen bedre og lettere at opfatte, er kedelige tekster illustreret med sjove billeder. Artiklen indeholder også de mest almindelige fejl, som webdesignere begår, når de arbejder med tekst og giver anbefalinger til, hvordan man undgår dem.

    Typografi- det stærkeste værktøj til at udtrykke et budskab i webdesign. Med dens hjælp kan du kombinere tekst og visuelle komponenter, som hjælper dig med at nå din besøgende. Korrekt brug typografi vil hjælpe med at undgå typiske fejl tilladt af designere, når de skaber deres næste mesterværk. Lad os prøve at forstå, hvad vi gør forkert, og hvordan vi undgår fejl i fremtiden.

    Lad os først forstå terminologien. De fleste af begreberne kender du sikkert, men det vil ikke skade at sætte dig ind i definitionerne igen. Måske vil dette supplere den information, du allerede har.

    Typografi- et sæt love, regler og normer for tekstdesign, baseret på studiet af læserens opfattelse af sætning. Viden og forståelse for typografi gør tekst til et kompositionsværktøj, gør den levende, giver den karakter og evnen til at formidle en idé ikke kun gennem indhold, men også grafisk.

    Headset- en skrifttype eller flere skrifttyper, der har stilistisk enhed af stil. Består af et sæt tegn. Dette begreb forveksles ofte med begrebet "skrifttype", selvom en skrifttype er en specifik tegnstil, mens en skrifttype definerer en generel "familie" af skrifttyper.

    Headsets kan opdeles i to hovedkategorier:

    • Antiqua- serif skrifttyper.
    • Grotesk, er derfor en sans-serif skrifttype.
    Du kan bruge en hvilken som helst i dine projekter, der er ingen rigtig eller forkert mulighed. Du skal se på situationen, hvilken slags projekt du laver, og hvad der er mere relevant for det.

    En serif-skrifttype ser ud til at holde en linje, og følgelig øges læsbarheden. Serif-skrifttyper skaber ofte en følelse af professionalisme og autoritet i de givne oplysninger, udtrykker respekt og understreger stabilitet og konservatisme i ordets bedste betydning. Sans serif-skrifttyper har en tendens til at understrege rationalitet, stil, ungdommelighed og modernitet. De hjælper med at skabe mellemrum mellem bogstaver og adskiller en karakter fra en anden.

    Skittle- bogstavets højde, inklusive de nederste og øverste elementer. Målt i typografiske punkter (betegnet som pt). For eksempel vil tekst indtastet i 14 punkts størrelse være 14 pt i højden.

    Førende- linjeafstand. Afstand mellem basislinjer tilstødende linjer.

    Kerning- afstand mellem bogstaver. Hovedideen bag kerning er at vælge forskellig afstand mellem forskellige par af specifikke bogstaver for at øge læsbarheden.

    Der er et vidunderligt træningsspil - Kern Type. Bare sæt alle bogstaverne på deres plads. Det er faktisk ikke så enkelt. Processen er ret kompliceret og kræver et fremragende øje. Denne oplevelse vil især være nyttig, når du opretter logoer.

    Hvad gør vi forkert?


    vi bruger stort antal skrifttyper

    Det anbefales ikke at bruge mere end 3 stilarter. Disse kan være skrifttyper fra samme skrifttype eller fra forskellige. Eksempelvis indeholder Roboto-skrifttypen et ret stort antal forskellige stilarter. Af disse kan du nemt vælge tre, som vi mener passer til vores side. Lad os sige, at disse er Light, Regular og Bold. Du kan bruge skrifttypen fed eller lys til overskrifter, fed for knapper og almindelig til brødtekst. Ved at bruge én skrifttype forsynede vi vores websted med den korrekte typografi. Det hele afhænger naturligvis af webstedets tema og ideen, som du planlægger at indarbejde i designet. Mit eksempel er universelt og foregiver ikke at være noget unikt eller ekstraordinært.

    Vi ved ikke, hvilken størrelse skrifttypen skal være

    Tekststørrelsen på nettet bør ikke være mindre end 12 pixels. Bedste valg- inden for 14–18 px for hovedteksten. Ikke for stor og samtidig læsbar. Desuden, hvis vi har valgt en størrelse på 16 px, skal den forblive 16 px på alle sider på siden og ikke hoppe plus eller minus 1 px fra blok til blok. Det gælder også for at føre det bør være ens overalt.

    Skriftstørrelser skal angives i hele tal uden brug af decimaler, f.eks. 16,28 px. Og selvfølgelig skal du i Photoshop konvertere pt til px. For at gøre dette, vælg fra menuen: Redigering - Indstillinger - Grundlæggende. Næste - Måleenheder og linealer. Skift elementerne i rullemenuerne "Tekst" og "Linjaler" til pixels. Klik på "OK".

    Linjelængde - betyder det noget?

    Linjelængden bør ikke overstige 600 px. Denne optimal størrelse for behagelig bevægelse af øjet fra en linje til en anden. En meget bred indholdsdel er svær at læse – ofte mister man simpelthen den linje, man skulle til, efter at have læst den lange forrige linje. Hvis du stadig har brug for at strække tekstblokken med 1000 px eller mere i bredden, kan du prøve at opdele teksten i to eller flere kolonner. En anden mulighed er at gøre linjeafstanden lidt større end normalt for visuelt at adskille linjerne fra hinanden. Husk at dele teksten op i afsnit, det vil også være med til at gøre den let at læse.

    Førende matcher skriftstørrelse

    Mellemrummet mellem linjer bør næsten altid være større størrelse skrifttype. Bortset fra overskrifterne. For at opnå en balance mellem tekst og luft skal du lave linjeafstanden cirka halvanden gange højden af ​​de små bogstaver. Eller indstil føringen til 150 % af skriftstørrelsen. For eksempel er tekststørrelsen 14 px, så er interliningen 21 px. 14/2 = 7 + 14 = 21.

    Vælg enhver skrifttype, du kan lide

    Jeg tror, ​​at alle allerede ved, at skrifttyper til webstedsdesign bedst bruges med fonts.google.com og webfont.ru, medmindre kunden selvfølgelig har givet dig deres egen skrifttype.

    O Lorem, lorem...

    Det er helt naturligt, at når man udvikler en hjemmeside, bliver det indhold, der vil være der, næsten aldrig brugt – ofte findes dette indhold simpelthen ikke endnu. Det er derfor, designere (og også layoutdesignere) bruger "fisk" - fri tekst, som passer ind i indholdsblokke. Dette er ret praktisk, især for designere, for nu kan den berygtede "Lorem Ipsum..." indsættes direkte fra Photoshop (Menu: Tekst - Indsæt Lorem Ipsum). Men for russisksprogede websteder anbefales det ikke at gøre dette - det latinske alfabet giver ikke en idé om, hvordan den indtastede tekst vil se ud Kyrillisk skrifttype. Derfor kan en tekstgenerator hjælpe dig.

    Det er enkelt at kontrollere designet for korrekthed: Hvis seeren uden at røre musen kan gætte, hvor linket er, og hvor det ikke er, så har vi et godt websted. Derfor er det nødvendigt på forhånd at tænke over, hvordan alle links på siden vil se ud. Lad os sige, at alle klikbare elementer er én farve, for eksempel rød, og ikke klikbare elementer af en anden farve - sort. Så bliver ingen forvirret.

    Dette sker ofte: overskriften er fremhævet med rødt (den skal trods alt fremhæves på en eller anden måde), efterfulgt af et par meget vigtige USP-sætninger blå og alt dette er blandet med almindelig sort tekst. I slutningen af ​​teksten er der en knap, også rød. Det er klart, at du skal klikke på knappen, men det viser sig, at teksten farvet i blåt også var klikbar (den åbnede yderligere oplysninger). Men hvem vidste, hvem vidste...

    Justering

    Der er tekstblokke, der meget ofte er justeret forkert - justeret, centreret og højrejusteret. I alle disse tilfælde er teksten ubelejlig at læse og visuelt ser den uinteressant ud. Justering skal ALTID efterlades. Selv hvis du virkelig vil gøre det på den rigtige side (simpelthen fordi det forekommer dig, at det er sådan, det skal være kompositionsmæssigt) - det er forkert en undtagelse kan være en eller to korte sætninger, som højst sandsynligt er underoverskrifter for hovedteksten.

    Kontrast

    Kontrast er et af de vigtigste udtryksmidler i design. Ingen grund til at være bange for store former og tomme rum! Bevidst stor typografi bliver et selvstændigt element, der ikke kræver yderligere grafiske værktøjer registrering