Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / New
Stats: 3,153,286 members, 7,818,969 topics. Date: Monday, 06 May 2024 at 09:12 AM

Hey Webmasters! Who Is Having Fun With "Google Fonts"? - Webmasters - Nairaland

Nairaland Forum / Science/Technology / Webmasters / Hey Webmasters! Who Is Having Fun With "Google Fonts"? (685 Views)

Webmasters, Who Can Help Me Solve This My Blog Problem / Hey Webmasters, Review My Porfolio And Leave Constructive Criticisms (2) (3) (4)

(1) (Reply)

Hey Webmasters! Who Is Having Fun With "Google Fonts"? by roaringlamb01(m): 3:26pm On Oct 04, 2015
Ever tried to design your website from scratch (or even with CMS's) and after developing everything, esp. with good fonts, it looks great on your PC's web browser such as Chrome... You would smile and be happy with yourself... Right?

Now, view it on a mobile browser! Then, it isn't as beautiful anymore... Your "font-family: 'times new romans', 'or anyother font you use'"; on your css isn't working on the mobile device.

[size=15pt]why isn't it working?[/size]
Well, every browser from IE to Chrome to Mozilla or even Safari have a set fixed fonts... so, they might not recognize any foreign fonts used in the css. if the browser doesn't recognize it, it will revert to the default font on the browser.

now, the above statement is not limited only to pc browsers alone, but to mobile browsers too.


[size=15pt]Solution.[/size]
With google fonts, you can style your html documents. And the font style will appear the same across all browsers and devices. Desktop, tablets or mobile devices.


--The process is really simple. Just visit google fonts, search for the font you like.
click and copy the link to the stylesheet, and paste it into the head section of your html file...
e.g. <html>
<head>
<link href='https://fonts.googleapis.com/css?family=Presido' rel='stylesheet' type='text/css'>
<!-- note "presido" doesn't exist, i just put it as an example-->
</head>
</html>


--Then, it is important that your add the font name into the css document (inline or external) in order of importance.
e.g. body{
font-family: presido; "san seriff";
/*presido is the first ahead of san seriff, and it is given from the google fonts...*/
}


note: You can add more than one style to different parts of your site...

You can ad this to content management systems, such WordPress.


Click HERE to have a look at my personal redesign of my old site...
Nb: I'm still designing it...


in need of a web developer, advice and so forth, send me a mail on admin@tha247webguy.com or whatsapp on 08167836364.

1 Like

Re: Hey Webmasters! Who Is Having Fun With "Google Fonts"? by dwebdesign(m): 10:02pm On Oct 04, 2015
in addition, to use it on your document after importing it from google.com/fonts,

apply it to any selector, to make it apply to the document , for example, and also give a fallback font
use:

html{
font-family: presido, sans-serif;
}

where presido is the google font name and sans-serif is the fallback.

good tutorial @roaringlamb01

(1) (Reply)

Sagamu Residence: MTN 1gb Data At Affordable Price / A Professional And Easy Way To Make Profit From Gsm Shortcode..... / Huge Drop [70%] In Traffic After Installing HTTPS On My Blog

(Go Up)

Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health
religion celebs tv-movies music-radio literature webmasters programming techmarket

Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10)

Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 12
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.