How to FIND FONTS used in a web page 🔎
Вставка
- Опубліковано 20 тра 2018
- Chapter breakdown with timestamps are below 👇and all extension links with additional compatibility info is found here: robhope.com/identify-website-...
Tutorial Breakdown ##
00:22 Fontanello (Chrome, Firefox)
00:35 WhatFont (Chrome, Safari)
00:52 Visual Inspector (Chrome)
01:12 Code Inspection (All Browsers)
01:59 Uncover Renamed Fonts (Advanced Method)
Websites Referenced in Chapters ##
Fontanello: onepagelove.com/michael-uloth
WhatFont: onepagelove.com/kidio
Visual Inspector: onepagelove.com/cssconf-argen...
Code Inspection: onepagelove.com/josh-sender-2018
Uncover Renamed Fonts: onepagelove.com/peaceful-life
Tutorial by Rob Hope ##
Subscribe: / robhope
Personal Website: robhope.com
Twitter: / robhope
One Page Love: onepagelove.com - Розваги
So what did you think of my first tutorial on this channel? I left out a few other tools (like Fount) that I found buggy - are there any others you use that was worth a mention?
Keep going, man ;) Love it
Got lots more tuts I'm busy curating, can't rush em:) Thanks for watching!
Brilliant job bro 👍, everything explained in very simple language with out any boring stuff, i'd love to see more tuts videos from your side because u r best at it.
Thanks so much! I really want to make more short but to-the-point vids like this:)
Yo! Man you were absolutely doing a brilliant job your videos helped me a lot but I wonder why you have stopped doing youtube videos?
Fontanello! I knew that extension existed, but wasn't able to find it on chrome store as I didn't know the exact name. Luckily, I found about it in your blog post while searching for something. Thanks!
That's so awesome to hear this was helpful Sai! 🙏It's such a killer tool!
This channel is gold
Thanks for the kind words, can't wait to make more tutorials like this:)
Excellent! Fast, quick, to the point. Productive too. Thanks Rob, new tools in my toolbox. :-)
Thanks so much Doug - lots more coming! :)
I usually just use the right-click inspect method. but I didn't know how to download the fonts with unclear names. Cool.Tutorial was solid. It seemed to have a progression from easy to more advanced by the end. Well done.
Yeah on One Page Love I add Font Families used to each review, so I use these methods daily:) Thanks for feedback, keen to make more useful tutorials with these!
Excellent job Mr. Rob! Thanks
Thank you Tahmin - so glad it has aged well too! :)
solid tutorial. very clear and to-the-point. Thanks a mil.
Glad you enjoyed it! :)
Thank you for this! I used the Code Inspection and it worked perfectly 🙏🏽
Stoked you got it right with Code Inspection. That's most peoples go-to solution! :)
Thanks foer being straight to the point
Gotta make the videos I'd want to watch! Thanks for the kind words:)
Great, I did like it, Best regards from Birmingham UK
Glad you liked it Rastagar! :)
Great video Rob, thanks. This helped me quite a bit today.
So glad to hear this David - I'm busy editing "10 Tips to tighten your Landing Page design" hopefully out next week:)
Very cool. I'm learning a lot about crowdfunding (as landing pages) so maybe we can compare notes afterwards. All the best.
Great Job.
Glad you enjoyed it Nisar!
Wakamai Fondue just got added to the tools list, thanks! I'll admit, it's partially down to it's awesome name haha
How AMAZING is that name hey Matt! ha!
Great!!! Thanks for the input. Una subscriptora más :)
Glad you enjoyed it Gabriela! :)
I usually use inspect to download fonts BUT there is this font it can't be downloaded as woff2 or anything. It was downloaded as "file" (like seriously the type file name is literally "file" only lol and i cant convert it online) This video is really hepful. I use WhatFont extension. The font name was weird but I just copy and paste into google and i found the font with it's original name. Thank you so much! You are a life saviour.
ha thanks for a great comment Queena :)
For inspecting css styles(you can inspect specific components too) I would recommend CSS Peeper Chrome extension.
Thanks for suggesting this Doğukan - I'll definitely check it out!
Thanks!
Only a pleasure - it's one of my favorite videos to be honest!
Your awesome
Thanks for watching Mehri!
Would you please do a video series about creating a website start to finish which will include your whole process from idea to the final product i.e website planning and design strategy and coding and?
Hi Nisar - maybe one day (in a multiple video series) but right now I'm reviewing design/development tools and also highlighting current news within our industry with my show Yo! :) There is quite a lot of content on UA-cam on building websites, so keep trying a few searches and you will find something good!
Hi, Rob I am Sabhi and Your first tutorial was awesome. I want you to create a detail tutorial about visual inspector because their is no video on UA-cam good enough to show how to use this element? Thanks Sabhi
Thanks Sabhi! Yeah it's on the list for sure, just need to get out a few Landing Page tutorials first:)
what extension should I download to know the font family for chrome
Hi Kajal - WhatFont: chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm
@@RobHope thanks
What page are you using for font recognition, please? 2:28
1zimca1 hey! I'm just away from keyboard/office. The link to this tool is in the article linked in the UA-cam description (right at the top).
Yay, I was blind, thank you so much! And please, keep doing these videos for us :)
After following, I download font file from chrome, went to the wakamaifondue site - but there was only a css download. Is this method supposed to allow me to download the actual font? Actually for anyone hoping for the answer now, just realized that after downloading the woff2 - you can just google Woff2 to otf converter and there's a bunch of free sites. Thanks!
Hey Kyle - do you mind sharing the site you were inspecting so I can check it out? Application > Frames > Fonts in Chrome should have the font file, I've never seen a CSS-only download.
Rob Hope nutiva.com - i only saw the woff2 format of the font when i right clicked to save it. Is that a usable font format? Lemme know what i missed of you found it straight up
@@kylebaxter3456 Cheers Kyle - yeah, so the tutorial isn't meant to help download/use the fonts but more identify to buy, so I didn't cover WOFF -to OTF converters. Thanks for bringing this up though, I should have explained it better. Using WhatFont I got "Wanderlust Shine Pro" which is found here: www.myfonts.com/fonts/cultivated-mind/wanderlust-collection/shine-pro/ good luck!
woow
Thanks for watching! :)
Rob Hope
want transilcton to Arabic
English litel
Rob Hope
Translation to Arabic
That would be amazing, I'd really appreciate that!
Rob Hope
I wish that All love and respect
how to see font in mobile?
Unfortunately I don't have any tricks to discover font families on a mobile phone:(
@@RobHope wrong answer 😁 what you want to say is: at the moment I don’t have any tricks but that’s a great idea for another video! 😎