Начало > ICN.Bg Блог > WordPress > Всичко, което трябва да знаете за WordPress шрифтоветe

Всичко, което трябва да знаете за WordPress шрифтоветe

Всичко, което трябва да знаете за WordPress шрифтоветe

WordPress

Шрифтовете са един малък, но много съществен елемент при създаването на сайт. Често наложени брандове в България и по цял свят използват единствено и само един конкретен шрифт, който е част от бранд идентичността на компанията. Това само по себе си показва колко важен е той.

Внимавайте добре с подбора на шрифт, защото вашият WordPress сайт преди всичко трябва да е четим и да не дразни очите на вашите потребители. В днешната статия ще разгледаме не само защо е важна ролята на шрифтовете, но и какви видове има, кои са най-добрите WordPress предложения за 2020 г. и как да ги инсталирате. Нека започваме:

1. Какво е типография?

Типографията е науката, която стои зад създаването на шрифтовете. Много често причина уеб сайтовете да не изглеждат професионално е именно лошият подбор на шрифтове. Потребителите са свикнали да използват няколко на брой, но се изисква дизайнерски нюх, за да бъде комбинацията им успешна.

Съветваме ви да използвате добре познати шрифтове и да не комбинирате повече от 2, най-много три различни, а не подобни един на друг. Целта е да се получи приятен контраст. Серифните букви най-лесно се възприемат и изглеждат много стилни, благодарение на заоблените си краища. Размерът на буквите, на който е желателно да заложите е 12-14 px. Достатъчно голям, лесно четим и същевременно деликатен за човешкото око.

2. Видове шрифтове

  • Web Safe fonts – шрифтове, които са инсталирани на вашия компютър или операционна система. Примери за тях са добре познатите ви Times New Roman, Arial, Calibri и др. Много често някои от тях представляват комбинация от шрифтове, в случай че операционната ви система не разпознава единия шрифт, то се предполага, че ще разпознае другия, в комбинация с него.

  • Web fonts – вместо да копирате допълнителни файлове на собствения си сайт, вие се свързвате с уебсайта на доставчика на шрифтовете и те се изтеглят от там т.е се свалят допълнително на вашия сайт. Това автоматично означава, че ще имате достъп до последните версии на шрифтовете, без ъпдейтите да заемат място на вашия сървър. Пример за това са Google шрифтовете Open Sans и Roboto.

  • Locally hosted fonts – Удобни са, защото имате контрол над шрифтовете и няма да зависите от трета страна и изправността им, която предлага тя. Свалят се директно и по-бързо на вашия сайт. Разполагате и с пълен контрол върху кеширането на шрифтовете, ако възникне някакъв проблем.

3. Най-използваните шрифтове за 2020 г.

Script шрифт

Изключително артистичен вариант. Интересен е, защото буквите са извити приличат на ръкописен почерк. Делят се на официални и ежедневни. Официалните представляват майсторски почерк от 17 или 18 век. Ежедневният шрифт е много лесен за различаване и една идея по-четлив. Това е и причината да бъде предпочитан между двата.

Пример за шрифт, за който сме сигурни, че веднага ще се сетите е логото на „Instagram“. Изключително приятен за окото и лесен за разчитане. Съгласете се с нас, че наистина прилича на ръкописен. През годините цветовете, които използват също се менят. Те също са изключително важен елемент за един утвърден бранд.

instagram

Научи повече: Психология на цветовете и как влияят на потребителското мислене?

Display шрифт

Подходящ за хора творци с по ексцентричен характер. Шрифтът грабва вниманието ни моментално. Смятат се за старинни и носят асоциация за 19 век. Съветваме ви да ги използвате, когато искате да наблегнете на гръмко заглавие или новина като акцент, защото в цял текст с абзаци няма да се отличава добре и можете да постигнете ефект на недобра читаемост. Пример за този интересен шрифт е любимият на малки и големи Disney. Обичате го и вие, нали? Ние също.

disney fonts

Serif шрифт

Серифните шрифтове са един от най-добрите избори, който можете да направите. Нарича се така, защото буквите съдържат малка завършваща линия в края на буквения знак или т.н. сериф. Подсъзнателно маркирането на края на елементите на буквата кара човек по-лесно и по-бързо да възприеме знака.

Не случайно те са в основата на всички водещи копирайтинг съвети за създаване на привлекателни презентации, заглавия и материали от професионалисти в областта.

Причината е, че са изключително ефирни и леки за възприемане от човешкото око. Свикнали сме с тях, носят асоциация на познат шрифт, който се чете на един дъх. Най-разпознаваемият шрифт за вас най-вероятно e Times New Rоmаn. Пример на бранд, който е заложил на серифния шрифт, е Volvo. Сигурни сме, че сте го срещали и преди.

volvo fonts

Sans Serif

Той е един от най-разпознаваемите шрифтове в интернет пространството. Изчистен е и е много модерен. Страхотен вариант за писане на дълги текстове, за разлика от някои шрифтове, които основно се препоръчват за употреба на акцент в заглавие поради не добра четаемост. Sans Serif е един от топ изборите за WordPress сайтове. Разпознаваем бранд, който се е доверил на въздействието на San Serif върху потребителите е Calvin Klein и изглежда ето така:

calvin klein font

Modern

Името на шрифта говори само по себе си. Този вариант е за хора с усет и нюх към модерното и различното. Вярваме, че лесно ще разпознаете всички шрифтове, които влизат в тази категория. Често това са брандове от света на модата и шоу бизнеса. Понякога асоциацията, която предизвикват е на ексцентричност и студенина. Различават се с това, че буквите са с различна дебелина и височина във всяка буква, което крещи за отличителен стил на изява.

Когато искате да използвате такъв шрифт за написването на дълъг текст, подберете шрифт, който ще бъде по-приятен за човешкото око, в който буквите не се различават толкова контрастно. Сигурни сме, че сред морето от избор, ще намерите най-доброто за вас и вашия вкус. Пример за бранд, заложил на Modern е списание Vogue.

vogue font

4. Как да инсталираме нови Google шрифтове на своя WordPress сайт?

В последните години Google Fonts са едни от най-използваните шрифтове, защото са разнообразни и достъпни директно от директорията на Google. Изключително лесно е да ги интегрирате на своя WordPress сайт и ние сега ще ви покажем 2 начина как да го направите.

Обръщаме ви внимание, че не винаги шрифтовете, които изглеждат добре на заглавие, стават и за употребата на големи текстове и обратното. Ако искате да откриете два различни текста, които се допълват, можете да намерите и готови предложения.

Когато сте сигурни, че сте харесали правилния шрифт за вашия сайт, е време да минем към същинската част. Нека започваме с първия вариант:

Добавяне на шрифтове чрез Plugin-и:

Влезте в администрацията на вашия WordPress сайт, след това кликнете на бутона „Plugins“ и после на бутона “Add new”.

how to add new plugin

Ще ви излезе search поле горе в дясно, където трябва да напишете „ easy google fonts“ и да зададете търсене. Ще ви излезе плъгинът на първа позиция и за да го инсталирате кликнете на бутона „Install now”. След това на мястото на този бутон ще ви излезе бутон „Activate”, върху който също трябва да кликнете.

easy google fonts

След като сте го активирали, е необходимо да го добавите и ръчно към вашия сайт. За целта отидете на „Appearance” и след това на „Customize”. Спрямо вашата тема ще ви излезе поле, върху което трябва да кликнете на “Typography”, после на “Default typography”.

Научи повече: "Най-добрите WordPress плъгинa през 2020 г."

На екрана ще се появят типичните елементи за настройване на шрифтове - Paragraphs, heading 1, heading 2 и т.н. Параграфът е основната част или т.н. Body на вашия текст. Желателно е той и заглавията (в това число и подзаглавията) да бъдат в 2 различни шрифта. Не смесвайте повече от 2.

font heading

В нашия случай ще заложим на шрифт „Lora”и ще запазим големината на буквите в оригиналния вариант. Разгледайте и другите опции. По същия начин можете да промените и своя “Heading font”.

lora font

След като направите перфектния избор за шрифтовете на вашия сайт, е необходимо да кликнете на бутона “Plublish“, за да запазите промените и да ги активиранте на сайта си.

Ръчно добавяне на шрифтове:

Стъпка 1:

Влезте във fonts.google.com. Можете да избирате търсенето си по категории, по език или по свойства на шрифта. Ако сте харесали конкретен шрифт, можете да го потърсите най-горе в дясно с бутона “search”.

how to search fonts

В нашия случай сме избрали конкретен шрифт на име “Lora”. След като сте изписали името в Search полето, ви излиза само конкретният шрифт. Кликате върху името, в случая „Lora” и след това давате бутона „ Select this font”.

select fonts

От ляво на вашия екран ще ви излезнат допълнителни шрифтове, които са подходящо в комбинация с вашия първи избор. В нашия случай това е “Open Sans”. Ако искате да ги добавите и двата. е необходимо да кликнете на първия бутон под формата на плюс +.

open sans

След това отдолу в дясно ще ви излезе едно малко поле, в което пише: „ 2 Families selected”. Кликнете върху него и ще ви се отвори допълнително поле. Копирайте текста от полето „Standart”.

standart copy link

След като копирате полето, отидете в контрол панела на вашия WordPress сайт. Отидете в секция „Plugins” и след това „Add new”. За да си улесните качването в търсачката напишете “Insert headers and footers” на WordPressBeginners и инсталирайте, става за няколко секунди.

how to insert headers and footers

След като го активирате, отидете в секция “Settings”, после в “Insert Headers and Footers” и в най-горното поле от екрана ви трябва да копирате линка, който взехме и по-горе от бутона „Families selected”, когато си избираме шрифтове.

Нека ви припомним, че това става като отидете на сайта fonts.google.com, избирате конкретен шрифт от полето „search”. Кликате върху бутона + на конкретния шрифт, след това “Select this font”. Ще ви излезнат допълнителни шрифтове, които си пасват добре с избрания от вас и отново кликнете на бутона +. Долу в дясно ще ви излезе поле “ 2 Families Selecte”. Там ще намерите и линка, за който говорихме преди малко. Поставяте го в следното поле и натискате бутона “save”:

insert headers and footers

Остана да отидете на секцията “Appearance”, след това кликате на “Customise”, после на “Additional CSS Settings” и поставяте същия този линк в полето.

additional css settings example

Много е важно редовно да поддържате вашия сайт и да обновявате неговите плъгини. Придържайте се към тенденциите и винаги бъдете в крак с новостите. Така вашият сайт ще бъде в най-оптималната си форма и ще се отличава от всички останали непрофесионални и неподдържани уеб страници в мрежата.

Интересно: Защо е важно редовно да обновяваме WordPress ядрото , темата и разширенията на нашия уеб сайт?

Надяваме се, че сме ви били полезни в избора на шрифт и инсталирането му директно на вашия сайт. Не забравяйте, че вашият сайт е вашата визитна картичка пред света. Постарайте се да го изпипате и до най-малкия детайл. Той представлява съвкупност от много на брой елементи, един от които са именно шрифтовете. Изберете най-красивия и практичен шрифт за вашата уеб страница. Желаем ви успех!

Абонирай се за бюлетина ни!

Получавай първи най-актуалната и полезна информация за твоя онлайн бизнес!

Изпращане... Грешка по време на изпращането! Моля опитайте отново!

С въвеждане на вашия мейл, вие се съгласявате с условията за ползване на ICN.Bg. Този сайт е защитен от reCAPTCHA и се прилагат правилата за поверителност и общите условия на Google

Благодарим Ви.

Заявката ви е изпратена успешно!

Обратно най-горе