Non standard Fonts

[Timbow]

I want to use an odd font for a design I am working on. There seem to be several ways of incorporating fonts into a page - google web fonts or embedding a woff file. Are there other methods? Which is the best way? Any issues with GS?

[yojoe]

I want to use an odd font for a design I am working on. There seem to be several ways of incorporating fonts into a page - google web fonts or embedding a woff file. Are there other methods? Which is the best way? Any issues with GS?

Basically you'd wish to use all available font-faces, not only .woff displayed only in gecko based browsers
Google fonts, and fontsquirrel provide complete code to embed custom fonts on your website (css, instructions etcetera)
You can also store all fonts-face files on your own web location.
And of course custom fonts work on websites based on GS without problems. It's not a matter of CMS.

[Timbow]

I want to use an odd font for a design I am working on. There seem to be several ways of incorporating fonts into a page - google web fonts or embedding a woff file. Are there other methods? Which is the best way? Any issues with GS?

Basically you'd wish to use all available font-faces, not only .woff displayed only in gecko based browsers
Google fonts, and fontsquirrel provide complete code to embed custom fonts on your website (css, instructions etcetera)
You can also store all fonts-face files on your own web location.
And of course custom fonts work on websites based on GS without problems. It's not a matter of CMS.

Thanks. I have read up on it now and got a fine Arts & Crafts style font embedded.

It seems font embedding suffers from the same issues that the rest of the mess which is HTML5 suffers from - in that you have to upload Four different font files for all the different browsers. What a waste of everybody's time and effort.

When I look at HTML5 I feel like I am entering a crazy looking-glass land of petulance and illogicality. the manual I have says that if I want a box shadow I should enter the following in my css to cover all the browsers

Code:

-webkit-box-shadow: 2px 5px 0 0 rgba(72,72,72,1);
-moz-box-shadow: 2px 5px 0 0 rgba(72,72,72,1);
box-shadow: 2px 5px 0 0 rgba(72,72,72,1);

But the code is the same for each one! WTF?

[leenm]

But the code is the same for each one! WTF?

Have a look at http://css3generator.com/. It gives you the optimal css for every browser.

[Angryboy]

Code:

-webkit-box-shadow: 2px 5px 0 0 rgba(72,72,72,1);
-moz-box-shadow: 2px 5px 0 0 rgba(72,72,72,1);
box-shadow: 2px 5px 0 0 rgba(72,72,72,1);

But the code is the same for each one! WTF?

It's the prefix (-webkit, -mox-) that fixes the problem for each browser and ensures that your element is viewed correctly across all platforms. Of course the 'coding' (between the colon and semi-colon) is the same - you want the content to look the same in all the browsers :-)