Font changing from arial to roboto on start

[jak]

Hello, I have a wierd occurence, namely when I run my web page the font is at start a diffetent font (I think its arial), and then it suddenly changes to a font that I have actually picked out in the editor. It lasts for a second or two before if swaps out. Ive no idea why this is occuring or how to fix it.

I have edited Heading 1, to have to font and font options/size to be as I want, and I am using it, but still getting a different font on wep page launch for a second or so.

Any ideas what might be causing this?
Thanks for your time.

[jak]

I changed to 'Heading 3' instead of 'Heading 1', and edited the 3rd heading as I want, and now its good. Seems its Heading 1 that makes the text change wierdly...

[crispy68]

If you are using non web-safe font (google font), this is typical. A fallback font is initially shown before the stylesheet is loaded with the new font. This is more obvious on a slower loading site as well.

[jak]

If you are using non web-safe font (google font), this is typical. A fallback font is initially shown before the stylesheet is loaded with the new font. This is more obvious on a slower loading site as well.

Wait what? How is that normal? Im sure Ive seen websites with non web-safe fonts that dont have such an issue? Or are you telling me every site that exists has a simillar problem?

[Pablo]

If depends on how the quick style sheet is loading.
For example, if you place it at the bottom of the page then it will take longer to process.
Also, an external style sheet will take longer to load.

You can control this in Tools -> Options -> HTML

[crispy68]

How is that normal?

Because it is.

Im sure Ive seen websites with non web-safe fonts that dont have such an issue?

Yes, you have. It loads so quick you don't see the change. Plus you may not even be paying attention and don't notice it.

Or are you telling me every site that exists has a similar problem?

Yes they do; however, like Pablo and I stated if you minify your stylesheet to make it load fast, minimize your page load time (make sure not a ton of images and those images are optimized, minify your .js files, etc, etc.) then the change almost looks instantaneous and you don't notice it. You also may not notice the change if the font is switching to a similar font (for example Arial to Open Sans). You may not even notice the change as they are very similar. Plus, it depends on the speed of your internet as well.