I just applied the Web Fonts action to most of my website pages and my page sizes ballooned. Most of them tripled in size. Is that normal?
Can you apply the Web Fonts action to the entire site versus individual pages?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
I’ve also noticed that the font I’m using with the Web Fonts action seems a little bolder than the original font. Is that also normal or does it have something to do with the fact that I ran the original TTF font through the Font Squirrel font-face Kit Generator and used the generated EOT and TTF files, instead of the original TTF.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Here’s a test I put together to show what I’m talking about. Note how much bolder the Web Font action type is than the same forced graphic font, which is much closer to the original font. Why is this happening?
http://idealynx.com/clients/cs/testpage.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
By the way, both fonts look exactly the same in the Freeway Pro page view. The differences become apparent when you with to the Preview mode or view the page in a web browser.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi,
with the use of the action, you’ll need to apply it on each page seperately.
Probably a quick word, what the Action is doing for you:
In the first step, it writes a little bit of code into the before head area so a browser can detect, that there’s an alernative FONT:
The second part of the action is, that it will place the eot/ttf pair into the resources folder. Note, that both are at least to be seen similar to an image (655KB the ttf). This could cause blowing-up your page-weight.
As you said, the boldness of your FONT could really be the result of “Squirrel-Conversion” (and if I look at the FONT image, it is visualized ballooned). So why asking and not trying?
Try in a first step to use the original .ttf (I suppose, that Freeway is using this, so nothing new that it looks much better there) and convert this original one to eot using:
http://www.kirsle.net/wizards/ttf2eot.cgi
I’m not sure what Squirrel is doing and I don’t trust them at all.
Add both new files to the action and fire this up again.
Cheers
Thomas
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Thanks for the explanation Thomas. I’ll give it another shot.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi,
Looking at your page code I can see that the top line of HTML text is set as an H1 tag. This will display, by default bolder than most other elements (such as paragraphs). The solution is to remove the default bold behaviour of the heading;
Now when you preview the text should match the graphic text below it.
Regards,
Tim.
On 7 Feb 2012, at 01:03, RavenManiac wrote:
Here’s a test I put together to show what I’m talking about. Note how much bolder the Web Font action type is than the same forced graphic font, which is much closer to the original font. Why is this happening?
FreewayActions.com - Freeware and commercial Actions for Freeway Express & Pro - http://www.freewayactions.com
FreewayStyle.com - Free Freeway templates and parts to download, use and explore - http://www.freewaystyle.com
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Tim, thanks for your help. I just tried your suggestion on the h1.style tag for the topmost example and it had no effect. Any other suggestions?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Thomas, I tried your suggestion below and that also had no effect. There must be something we’re missing? Thanks for your efforts.
Kelly
On 7 Feb 2012, 6:27 am, Thomas Kimmich wrote:
As you said, the boldness of your FONT could really be the result of “Squirrel-Conversion” (and if I look at the FONT image, it is visualized ballooned). So why asking and not trying?
Try in a first step to use the original .ttf (I suppose, that Freeway is using this, so nothing new that it looks much better there) and convert this original one to eot using:
I’m not sure what Squirrel is doing and I don’t trust them at all.
Add both new files to the action and fire this up again.
Cheers
Thomas
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Okay, I just added another example of the Web Fonts action without the h1 style tag and the results look the same—still bolded.
http://idealynx.com/clients/cs/testpage.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Remove the Web Fonts Action and let the previewed page use the locally installed version of the Subway Novella font. You’ll see that the the issue appears to be that Freeway renders the font lighter both in the the application and when the fonts are output as graphics. The differences you are seeing are between how Freeway anti-aliases the text and how the same font is anti-aliased in various browsers.
Take a look at the following example;
http://www.freewayactions.com/test/font-smoothing/
The text on the top line of each block is HTML text. (Note that I’ve not used the Web Fonts Action and if you don’t have the Subway Novella font installed then you’ll see this text in Times.) Below this is the same text exported from Freeway as a graphic.
You should be able to see that the text differs in the top block with the HTML text rendering heavier than the graphic text.
Below this are exactly the same items but I’ve applied a CSS3 rule to the HTML text which adjusts the anti-aliasing of the HTML text. You should be able to see that in Safari and Chrome the HTML and graphic text are identical.
So I guess the long term answer is I’ll log a suggestion to have Freeway anti-alias fonts in the same way as most browsers. In the meantime you can add the CSS manually to your styles (-webkit-font-smoothing: antialiased) and have the fonts adjusted adjusted in Webkit enabled browsers.
There is quite a good comparison of webkit font smoothing options here; http://maxvoltar.com/archive/-webkit-font-smoothing
Regards,
Tim.
On 7 Feb 2012, at 15:42, RavenManiac wrote:
Okay, I just added another example of the Web Fonts action without the h1 style tag and the results look the same—still bolded.
FreewayActions.com - Freeware and commercial Actions for Freeway Express & Pro - http://www.freewayactions.com
FreewayStyle.com - Free Freeway templates and parts to download, use and explore - http://www.freewaystyle.com
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Wow! You really put a lot of time into this. Thank you.
Okay, so how exactly do I add the webkit-font-smoothing to my styles?
Also, on another note, why does the Web Font action add so much overhead to the page and is any of the code used on subsequent pages to reduce load times?
Thanks again Tim!
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
On 7 Feb 2012, at 19:42, RavenManiac wrote:
Okay, so how exactly do I add the webkit-font-smoothing to my styles?
Go to Edit > Styles and select your style. Click on Extended, New and enter;
name: -webkit-font-smoothing
value: antialiased
Also, on another note, why does the Web Font action add so much overhead to the page and is any of the code used on subsequent pages to reduce load times?
FreewayActions.com - Freeware and commercial Actions for Freeway Express & Pro - http://www.freewayactions.com
FreewayStyle.com - Free Freeway templates and parts to download, use and explore - http://www.freewaystyle.com
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Dude, you have just made the “Coolest Person This Week” list.
Thanks,
Kelly
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
On 7 Feb 2012, at 19:42, RavenManiac wrote:
Go to Edit > Styles and select your style. Click on Extended, New and enter;
name: -webkit-font-smoothing
value: antialiased
Tim, I added the code to both the h1 and regular style tags and it doesn’t seem to have made a difference. http://idealynx.com/clients/cs/testpage.html What am I doing wrong?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Oops! My bad. I forget to add the leading hyphen to -webkit-font-smoothing.
Works perfectly! You are the man. 
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
I want to credit the font designer for the font I’m using. Where’s the best place to add a credit/copyright information?
I was thinking of adding a comment in the home page HTML markup, but I’m not sure where to put it and I can’t remember how to add a comment. I think I need to precede each line of text with a special character.
Any help or advice is greatly appreciated.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
You could simply add it as a Meta Tag Page>Meta Tags and create a new one called Copyright and add the blurb you want in the Value box.
Not sure how semantically correct it is but…
D
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
That’s an idea, but the problem is the copyright info is fairly long. Don’t you think an HTML comment would be better?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Don’t you think an HTML comment would be better?
I dont think it is necessary
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options