Kui teie veebisaidil on v\u00e4rvilist teksti, peaksite selle asemel valima l\u00e4heduses oleva v\u00e4rvi kasutamise.<\/p>\n
Siin on see, mida ma m\u00f5tlen.<\/p>\n
N\u00e4ide nr 1<\/h3>\n
Sellel nupul on sinine tekst ja helehall taust. See n\u00e4eb v\u00e4lja lame ja tekst \u00fcletab nupu kuju:<\/p>\n
Kui ma muudan v\u00e4rve, kasutades taustaks sinist ja heledat teksti, n\u00e4eb see palju parem v\u00e4lja:<\/p>\n
Ja kui me r\u00e4\u00e4gime nuppudest\u2026<\/p>\n
Kui teie nupul on v\u00e4rviline taust, n\u00e4eb see peaaegu alati k\u00f5ige paremini v\u00e4lja valge tekstiga.<\/p>\n
Must tekst kipub peale v\u00e4rvi jube v\u00e4lja n\u00e4gema, v\u00e4lja arvatud juhul, kui see v\u00e4rv on t\u00f5esti kahvatu v\u00f5i lihtsalt heledam hall:<\/p>\n
Kui kasutate oma postitustes sageli v\u00e4rvilist teksti, hindate j\u00e4rgmise n\u00e4ite ideid.<\/p>\n
N\u00e4ide nr 2<\/h3>\n
Teise n\u00e4itena v\u00f5ib teie postituses olla v\u00e4rviline tekst, kuna soovite, et see silma paistaks, n\u00e4iteks:<\/p>\n
See tekst ei n\u00e4e hea v\u00e4lja, sest see on sinine!<\/p>\n
V\u00e4rviga t\u00e4helepanu saamiseks on esteetiliselt meeldivamaid viise. R\u00e4\u00e4kimata sellest, et teatud v\u00e4rvid (nt sinine) muudavad lihtteksti lingiks.<\/p>\n
Teine viis v\u00e4rviga t\u00e4helepanu t\u00f5mbamiseks on muuta tekst valgeks ja taust siniseks:<\/p>\n
See on palju v\u00e4rve, nii et kasutage s\u00e4\u00e4stlikult!<\/p>\n
V\u00f5i v\u00f5ite v\u00e4hendada k\u00fcllastust, et taust oleks v\u00e4ga kahvatu, ja seej\u00e4rel muuta tekst peenema v\u00e4limuse saamiseks mustaks:<\/p>\n
Must tekst n\u00e4eb kahvatu taustaga kena v\u00e4lja.<\/p>\n
V\u00f5i v\u00f5ite j\u00e4tta teksti mustaks ja lisada tekstile \u00e4\u00e4risena v\u00e4rvi.<\/p>\n
See on lihtsam v\u00e4limus, mis p\u00e4lvib endiselt t\u00e4helepanu.<\/p>\n
V\u00f5i v\u00f5ite kombineerida tausta ja \u00e4\u00e4rise:<\/p>\n
See on veel \u00fcks atraktiivne viis v\u00e4rvi kasutamiseks.<\/p>\n
V\u00e4rvilise teksti reeglite kokkuv\u00f5tteks:<\/p>\n
Teksti v\u00e4rvi muutmise asemel peaksite kasutama v\u00e4rvilist tausta v\u00f5i v\u00e4rvilist \u00e4\u00e4rist teksti \u00fcmber. Lisaks n\u00e4eb valge alati parem v\u00e4lja v\u00e4rvilisel taustal, v\u00e4lja arvatud juhul, kui v\u00e4rv on v\u00e4ga kahvatu.<\/p>\n
N\u00fc\u00fcd valime v\u00e4lja v\u00e4rvid, mida te kasutate.<\/p>\n
Teadmiseks, et \u00fclaltoodud l\u00f5ikudele \u00e4\u00e4riste lisamiseks pidin natuke CSS-i kirjutama. Piirivalikut Gutenbergil veel ei ole. Piire<\/a> saab lisada juba Elementori<\/a> vidinatega.<\/p>\n V\u00e4rvide valimine k\u00e4igu pealt on uustulnukate suur viga.<\/p>\n Iga kord, kui rakendate oma veebisaidile v\u00e4rvi, peaksite alati valima v\u00e4rvi oma paletist<\/strong>.<\/p>\n Paletti kasutades saate lihtsalt valida olemasolevate v\u00e4rvide hulgast ja teate, et tulemus n\u00e4eb kena ja "margi j\u00e4rgi" v\u00e4lja ilma igasuguse pingutuseta.<\/p>\n Ja siin on asi\u2026<\/p>\n Olen olnud aastaid veebidisainer ja n\u00e4en siiani vaeva toredate v\u00e4rvipalettide loomisega.<\/p>\n Ja sellep\u00e4rast ma petan \ud83d\ude09<\/p>\n Ma ei loo kunagi oma v\u00e4rvipalette. Selle asemel leian uhke v\u00e4rvipaleti, mis on juba tehtud, ja siis kohandan seda vastavalt oma disainivajadustele.<\/p>\n Minu salajane ressurss v\u00e4rvipalettide leidmiseks on Color Hunt<\/a>.<\/p>\n Sellel suurep\u00e4rasel veebisaidil on liikmete kogukond, kes loovad ja jagavad enda kujundatud v\u00e4rvipalette.<\/p>\n Kodulehte sirvides leiate l\u00f5putu loendi kaunitest palettidest, mille vahel valida. Mis tahes paletil kl\u00f5psamine viib teid selle lehele, kus on allpool loetletud seotud paletid.<\/p>\n Ausalt \u00f6eldes on palettide sirvimine ja oma saidi jaoks ideede ja inspiratsiooni ammutamine v\u00e4ga l\u00f5bus.<\/p>\n Kui teil on varjund juba meeles, saate otsinguriba abil alustada v\u00e4rvi valimisega.<\/p>\n Sobivate palettide leidmiseks on saadaval ka eelnevalt m\u00e4\u00e4ratletud m\u00e4rks\u00f5nad, nagu "soe" ja "k\u00fclm".<\/p>\n Kui valite endale meelep\u00e4rase paleti ja rakendate oma saidil v\u00e4rvid, olete \u00fcllatunud, kui palju see muudab.<\/p>\n Need kaks esimest n\u00e4pun\u00e4idet peaksid ajendama k\u00fclastajaid arvama, et olete v\u00e4rvide disainimeister.<\/p>\n N\u00fc\u00fcd r\u00e4\u00e4gime fontidest!<\/p>\n V\u00e4rvid tuleks valida oma paletist. Fondid on sarnased.<\/p>\n Peaksite valima \u00fche v\u00f5i kaks fonti ja seej\u00e4rel kasutama neid k\u00f5ige jaoks uuesti.<\/p>\n Sageli, kui WordPressi kasutajad \u00f5pivad oma saidil fonte muutma, tahavad nad \u00e4kki neid k\u00f5iki kasutada!<\/p>\n N\u00e4iteks olen n\u00e4inud, kuidas inimesed muudavad \u00fche l\u00f5igu fonti, et see postituses silma paistaks. See on halb m\u00f5te. Kui vajate postituses silma paistmiseks teksti, saate teha j\u00e4rgmist.<\/p>\n Kui r\u00e4\u00e4kida fontidest, peaksite valima \u00fche v\u00f5i kaks kogu saidi jaoks<\/strong> ja kui arvate, et vajate rohkemat, kaaluge seda\u2026<\/p>\n Google kujundas Roboto fondi (mida saate ka kasutada \u2013 see on Google Fontsis<\/a>) ja nad kasutavad seda fonti k\u00f5ikjal.<\/p>\n Nad kasutavad seda Google.com-i, Youtube’i, Gmaili, Google’i dokumentide ja Chrome’i jaoks \u2013 s\u00f5na otseses m\u00f5ttes kasutavad k\u00f5ik nende tooted seda \u00fchte fonti kogu teksti jaoks.<\/p>\n Nii et kui olete veendunud, et kauni veebisaidi jaoks on vaja rohkem kui \u00fchte fonti, siis m\u00f5elge uuesti!<\/p>\n Mul on teie jaoks veel \u00fcks otsetee.<\/p>\n Selle asemel, et sirvida sadu fonte, soovitan teil valida veebis k\u00f5ige edukamate fontide hulgast.<\/p>\n See l\u00e4henemisviis tagab p\u00f5him\u00f5tteliselt teie saidi hea v\u00e4ljan\u00e4gemise.<\/p>\n Selleks k\u00fclastage Google’i fonte<\/a> ja leiate kodulehelt populaarsed fondid.<\/p>\n Tulemuste t\u00e4psustamiseks kl\u00f5psake rippmen\u00fc\u00fcl Kategooriad ja t\u00fchjendage k\u00f5ik valikud, v\u00e4lja arvatud Sans Serif.<\/p>\n Kui valite m\u00f5ne praegu loetletud fontidest, n\u00e4eb teie sait suurep\u00e4rane v\u00e4lja.<\/p>\n Pidage meeles, et suurem osa teie veebisaidi tekstist kuvatakse teie postitustes ja seega on fondi k\u00f5ige olulisem kvaliteet<\/strong> see, et seda on lihtne lugeda.<\/p>\n K\u00f5ik k\u00f5ige populaarsemad sans serif-fondid on populaarsed, kuna need on nii loetavad kui ka atraktiivsed. Ja kui teil tekkis k\u00fcsimus\u2026<\/p>\n Seda ma teen ka!<\/strong><\/p>\n Uute teemade kujundamisel l\u00e4hen tavaliselt Google Fontsi ja otsin inspiratsiooni trendikatest fontidest.<\/p>\n Kui tahan kujundusele veidi rohkem iseloomu lisada, kasutan seda j\u00e4rgmist taktikat.<\/p>\n See veebisait kasutab ka \u00fchte populaarset sans serif fonti nimega Proxima Nova, mis on saadaval koos Adobe Typekitiga.<\/p>\n Kui olete \u00fche fondiga rahul, v\u00f5ite selle taktika vahele j\u00e4tta.<\/p>\n Kuid kui teile tundub, et selline lihtne valik on teie loovust pisut p\u00e4rssinud, saate teha j\u00e4rgmist\u2026<\/p>\n Kasutage oma saidi pealkirjade jaoks kuvafonti.<\/strong><\/p>\n Esimene teie valitud font oli m\u00f5eldud v\u00e4ikese suurusega lugemiseks, kuid kuvari font on m\u00f5eldud spetsiaalselt suurte suuruste jaoks (nagu suured kuvad, m\u00f5istate?).<\/p>\n Asi on selles, et kuvafondid on sageli v\u00e4ga stiilsed, nii et nende liigkasutamine v\u00f5ib muuta teie saidi r\u00e4igeks.<\/p>\n Pealkirjad on ideaalne koht kuvafondide kasutamiseks, kuna:<\/p>\n Soovi korral saate kuvafonti uuesti kasutada ka oma saidi pealkirja (v\u00f5i logo) jaoks.<\/p>\n Oma saidile kuvafondi leidmiseks k\u00fclastage uuesti Google Fontsi, kuid seekord muutke kategooriaid nii, et need h\u00f5lmaksid ainult kuvafonte, n\u00e4iteks j\u00e4rgmiselt:<\/p>\n Populaarsete fontide p\u00f5hjal n\u00e4ete kohe, kui palju rohkem on kuvafondide mitmekesisust.<\/p>\n Praeguse seisuga on teenuses Google Fonts umbes 300 kuvafondi, nii et nautige sirvimist ja pidage meeles, et peate valima ainult \u00fche!<\/p>\n Siin on veel \u00fcks tekstip\u00f5hise disaini n\u00e4pun\u00e4ide, mis muudab teie veebisaidi kaunimaks.<\/p>\n Kui te ei tea, kuidas oma veebisaidil fonti muuta, j\u00e4rgige seda \u00f5petust<\/a>.<\/p>\n K\u00f5igist selles postituses loetletud disainin\u00f5uannetest on seda k\u00f5ige lihtsam rakendada.<\/p>\n Heitke pilk men\u00fc\u00fcle V\u00f5istlevad teemad:<\/p>\n Men\u00fc\u00fcelemendid on proportsionaalsed ja \u00fchtlaselt paigutatud, mist\u00f5ttu n\u00e4eb see kena v\u00e4lja.<\/p>\n Men\u00fc\u00fc koostamisel tuleks iga men\u00fc\u00fcelement teha \u00fches\u00f5naliseks<\/strong>. P\u00f5hjus peitub vahekauguses.<\/p>\n N\u00e4iteks vaadake, kui \u00fchtlaselt on men\u00fc\u00fcelemendid ajalehes The New York Times.<\/p>\n Teemasid on lihtne sirvida ja iga\u00fcks neist eristada.<\/p>\n Kui lisate men\u00fc\u00fc\u00fcksusesse rohkem s\u00f5nu, h\u00e4irib see t\u00fchikuid. Men\u00fc\u00fcelement muutub teistest tunduvalt pikemaks ja s\u00f5nade vahele j\u00e4\u00e4vad t\u00fchikud tekitavad kujunduses eba\u00fchtlust.<\/p>\n Alloleval ekraanipildil olen lisanud NYT-i men\u00fc\u00fcsse mitme s\u00f5naga v\u00f5ltsmen\u00fc\u00fc \u00fcksused. Vaadake, kui segaseks muutub men\u00fc\u00fc:<\/p>\n2 Kasutage v\u00e4rvipaletti<\/h2>\n
![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbc684325.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbc8a511a.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbcacb74b.png\")
<\/a><\/p>\n3 Kasutage ainult 1 v\u00f5i 2 fonti<\/h2>\n
\n
4 Kasutage populaarset sans serif fonti<\/h2>\n
![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbcd25332.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbcf5158d.png\")
<\/a><\/p>\n5 Kasutage pealkirjade jaoks kuvafonti<\/h2>\n
\n
![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbd17935f.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbd3839b9.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbd58ccc4.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbd7ab322.png\")
<\/a><\/p>\n
![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbd98dfd4.png\")
<\/a><\/p>\n![\"9](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-222525-6171cbdbf3389.png\")
<\/a><\/p>\n