Типична веб страница се углавном састоји од неколико различитих елемената од којих је већина кодирана у различитим бојама и написана различитим фонтовима и стиловима. Понекад наиђемо на веб странице тако лепо дизајниране да нас терају да дубоко уђемо у њихове атрибуте; веома елегантна тема или леп, професионални фонт, можда.

Људи који познају фонтове и који су фасцинирани њима често користе бесплатне алатке за идентификацију фонтова на мрежи^{(free online font identifier tools)} како би помогли у откривању фонтова на вебу. Ови онлајн алати захтевају да унесете УРЛ^(URL) или отпремите слику са приказаним фонтом, који се затим прегледа. У случају да не желите да пролазите кроз муке учења да користите нови алат, овај пост је за вас. Данас ћемо разговарати о томе како корисници могу да идентификују који фонт одређена веб страница користи без употребе екстензије претраживача, апликације или било којег онлајн алата.

Процедура о којој ћемо расправљати у овом чланку ће се вртети око поставке коју већина веб прегледача нуди, односно „ Алатке за програмере^{(Developer Tools)} “, или да будемо прецизни, опцију која се зове Инспецт Елемент^{(Inspect Element)} . Овде ћемо разговарати о томе како се фонтови могу идентификовати у два претраживача – Цхроме^(Chrome) , Едге^(Edge) и Фирефок^(Firefox) .

Идентификујте^(Identify) фонтове на веб страници помоћу Инспецт Елемент^{(Inspect Element)} у Фирефок -у^(Firefox)

Посетите веб страницу фонта који желите да идентификујете и кликните десним тастером миша на текст који је написан фонтом који вас занима.

Са листе опција које се појављују (контекстуални мени), кликните на Инспецт Елемент^{(Inspect Element)} . То^(Doing) би отворило алатке за програмере^{(Developer Tools)} на дну странице.

У доњем десном углу одељка Алати за развој^{(Development Tools)} , наћи ћете поднаслов под називом Фонтови^(Fonts) , кликните на њега.

Затим ће вам приказати својства фонта који желите да погледате, попут његове величине, висине линије, тежине итд., као и да ли је фонт у курзиву или не, иако је то увек очигледно.

Ако сте заинтересовани да сазнате више о фонту који се користи, Фирефок^(Firefox) вас је такође покрио са тим. Ако скролујете надоле одељак фонтови и кликнете на „Сви фонтови на страници“, картица фонтови ће се проширити и биће вам приказани сви фонтови који се користе на веб страници коју тренутно прегледате, као и где се налазе се користе. Не само то, већ добијате и преглед како одређени фонт изгледа. Прелазак миша преко фонтова у алаткама за програмере^{(Developer Tools)} ће истаћи делове веб странице који користе тај фонт.

Идентификујте фонт помоћу алатки за програмере^{(Developer Tools)} у Цхроме- у^(Chrome)

Процес је сличан горе описаном. Пратите прва два корака као што сте урадили са Фирефок^(Firefox) -ом да бисте отворили алатке за програмере^{(Developer Tools)} на десној страни странице.

Кликните на поднаслов „Израчунати“.

Померите^(Scroll) се мало надоле и наћи ћете информације о фонту који вас занима (фамилија фонта, величина итд.)

Нажалост, Цхроме^(Chrome) вам не пружа никакве додатне информације као што то чини Фирефок^(Firefox) .

Идентификујте^(Identify) који се фонт^(Font) користи користећи Едге Девелопер Тоолс^{(Edge Developer Tools)}

1. Отворите Едге
2. Кликните десним тастером миша и изаберите текст
3. Изаберите Инспецт
4. У алаткама за програмере^{(Developer Tools)} који се отварају, погледајте одељак Израчунати^(Computed)
5. Видећете детаље фонта.

Ако мислите да не можете да заобиђете алатке за програмере^{(Developer Tools)} претраживача и да би вам онлајн алати више одговарали, постоји неколико њих који раде веома добро.

Прочитајте следеће^{(Read next)} : Како пронаћи сличне бесплатне алтернативе плаћеним фонтовима^{(find similar free alternatives to paid Fonts)} .

Identify fonts in Chrome, Edge and Firefox using Developer Tools

A typical web page generаlly consists of several different elements with most of them coded in different cоlors and written in different fonts and styles. Sometimes, we come across web pages so beautifully designed that they make uѕ want to delve deep into their attributes; a vеry elegant theme or a nice, professional font, perhaps.

People who know their way around fonts and are fascinated by them often use free online font identifier tools to help discover fonts on the web. These online tools require you to enter a URL or upload an image with the font showcased, which is then inspected. In case you don’t want to go through the hassle of learning to use a new tool, this post is for you. Today, we will discuss how users can identify what font a particular web page is using without using a browser extension, an application, or any online tools.

The procedure that we will be discussing in this article will revolve around a setting that most web browsers offer, namely ‘Developer Tools,’ or to be specific, an option called Inspect Element. Here, we will discuss how fonts can be identified in two browsers – Chrome, Edge and Firefox.

Identify fonts on a webpage using Inspect Element in Firefox

Visit the web page of the font of which you want to identify and right-click on the text that is written in the font you are interested in.

From the list of options that show up (the context menu), click on Inspect Element. Doing so would open the Developer Tools on the bottom of the page.

On the bottom right corner of the Development Tools section, you will find a subhead named Fonts, click on it.

It will then display for you the properties of the font you wanted to look into like its size, line height, weight, etc., and also whether or not the font is in italics or not, though that is always apparent.

If you are interested to know more about the font in use, Firefox has you covered with that too. If you scroll down the fonts section and click on ‘All fonts on the page,’ the fonts tab will expand and you will be shown all the fonts that are being used on the web page you are browsing at the moment, and also where they are being used. Not just that, but you also get a preview of how a particular font looks. Hovering your mouse over the fonts in the Developer Tools will highlight the sections of the web page that use that font.

Identify a font using Developer Tools in Chrome

The process is similar to the one described above. Follow the first two steps as you did with Firefox to open the Developer Tools on the right side of the page.

Click on the ‘Computed’ sub-head.

Scroll down a bit and you will find information about the font you’re interested in (font’s family, size, etc.)

Unfortunately, Chrome doesn’t provide you with any additional information like Firefox does.

Identify which Font is used using Edge Developer Tools

1. Open Edge
2. Right-click and select the text
3. Select Inspect
4. In the Developer Tools that open, look under Computed
5. You will see the Font details.

If you don’t think you can’t work around with browser Developer Tools and that online tools would suit you better, there are several of them that work very well.

Read next: How to find similar free alternatives to paid Fonts.

Related posts

• Како преузети фонт са веб локације користећи алатке за програмере

• Обришите податке о сајту за одређени сајт у Цхроме-у или Едге-у помоћу алатки за програмере

• Како променити подразумевани фонт у Цхроме, Едге, Фирефок претраживачу

• Онемогућите алатке за програмере у Едге-у помоћу регистра или смерница групе

• Поправите дијалог за отварање замућене датотеке у Гоогле Цхроме-у и Мицрософт Едге-у

• Како онемогућити геолокацију у Фирефок-у, Цхроме-у и Едге-у

• Шта је Лази Лоадинг? Омогућите или онемогућите у Цхроме-у, Фирефок-у, Едге-у

• Како отворити везе за вести и интересовања у Цхроме-у или Фирефок-у; не Едге

• Омогућите ДНС преко ХТТПС-а у Фирефок-у, Цхроме-у, Едге-у, Опери, Андроид-у, иПхоне-у

• Делите додатке дугмета за прегледаче Цхроме, Фирефок и Едге

• Како да онемогућите уграђени менаџер лозинки у Цхроме-у, Едге-у, Фирефок-у

• Обришите колачиће, податке о сајту, кеш меморију за одређену веб локацију: Цхроме Едге Фирефок

• Безбедност, приватност, алати за чишћење за Едге, Фирефок, Цхроме, Опера

• Додајте брзо бирање попут Опера у Цхроме, Едге или Фирефок

• Дозволите или блокирајте искачуће прозоре у Цхроме-у, Фирефок-у, Едге-у, Опери, Интернет Екплорер-у

• Поново покрените Цхроме, Едге или Фирефок без губитка картица у оперативном систему Виндовс 11/10

• Како да синхронизујете картице између прегледача Едге, Цхроме и Фирефок

• Како блокирати захтеве за веб обавештења у Цхроме-у, Фирефок-у, Едге претраживачу

• Онемогућите, омогућите колачиће у прегледачима Цхроме, Едге, Фирефок, Опера

• Направите пречицу за веб локацију на радној површини користећи Цхроме, Едге, Фирефок