Correct preview with embedded fonts

I ever wondered how it is possible to see a correct preview of embedded fonts in FW.

I do have a fonts kit from myfonts.com:

It comes with a „myfontskit.css“ and a folder „webfonts“.
At the server I put both into the rootfolder and connect the .css it via before :

It works perfect online on the server.

My question here is, how do I achieve this too in a lokal preview in FW?

Where should I put the .css file / webfonts folder and how would be the correct path in the head section? And can I have both? A correct lokal preview AND a correct embedded fonts online at a server at the same time?

Thanks a lot!
Hanna


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

That is a relative path and if you changed it to an absolute one you will get what you want ie

but some Browsers dont like an absolute path so keep the relative one as well.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

That is a relative path and if you changed it to an absolute one you will
get what you want

Dave, I think Hanna is asking about previewing the font locally… so an
absolute path would break that. I do question her example url-- should it
not have a leading slash / before the css filename? Shouldn’t it be:

<link rel="stylesheet" type="text/css" href="myfontskit.css">

She could load it automatically to the Site folder using the Upload Stuff
action and place it beside the html file.

When I used Adobe’s Typekit the font was only visible from the web server,
never locally. Now, I admit that I’m too lazy to look at how MyFonts
implements their webfonts – if there are some similar script requirements
or such. If that’s the case, then the font can only be previewed online,
uploaded to a server.

Services who use this scheme do so for licensing reasons-- they can see
where and how the font is used, and turn it off when your subscription
expires (at least that was my experience with Typekit). This is why I now
use Google Fonts-- more generous license, easier technology which can be
previewed in Freeway, downloadable screen font so also previews in the
Freeway Workspace. Fewer font choices though, and sometimes fonts are
removed from the list, but I can live with all that. After all, fonts are
merely decoration.

Hanna, I’d look at MyFonts and see if they have any advice for locally
previewing font choices in your browser while you are building a website –
mentioning that you use Freeway would likely be counter-productive as you
don’t want their support people getting all hung up on that as it is
irrelevant… you are building websites with html and css-- front-end code.
That is what Freeway does for you. If their system supports local
previewing is all you want to know.

Best of luck,


Ernie Simpson


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

That is a relative path and if you changed it to an absolute one you will
get what you want

Dave, I think Hanna is asking about previewing the font locally… so an
absolute path would break that. I do question her example url-- should it
not have a leading slash / before the css filename? Shouldn’t it be:

<link rel="stylesheet" type="text/css" href="myfontskit.css">

She could load it automatically to the Site folder using the Upload Stuff
action and place it beside the html file.

When I used Adobe’s Typekit the font was only visible from the web server,
never locally. Now, I admit that I’m too lazy to look at how MyFonts
implements their webfonts – if there are some similar script requirements
or such. If that’s the case, then the font can only be previewed online,
uploaded to a server.

Services who use this scheme do so for licensing reasons-- they can see
where and how the font is used, and turn it off when your subscription
expires (at least that was my experience with Typekit). This is why I now
use Google Fonts-- more generous license, easier technology which can be
previewed in Freeway, downloadable screen font so also previews in the
Freeway Workspace. Fewer font choices though, and sometimes fonts are
removed from the list, but I can live with all that. After all, fonts are
merely decoration.

Hanna, I’d look at MyFonts and see if they have any advice for locally
previewing font choices in your browser while you are building a website –
mentioning that you use Freeway would likely be counter-productive as you
don’t want their support people getting all hung up on that as it is
irrelevant… you are building websites with html and css-- front-end code.
That is what Freeway does for you. If their system supports local
previewing is all you want to know.

Best of luck,


Ernie Simpson


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave, it is how Ernie described it indeed. I want to preview locally. And yes Earnie that licensing thing can be the reason. Sorry. It was my mistake to use the leading slash/.

It should be:

Thanks you for pointing at it.
I will ask Myfonts as you suggested Ernie.
Thanks a lot!
Hanna


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave, it is how Ernie described it indeed

That doesn’t mean that you cannot use the full URL for this. All it means is that the font is served to you via your internet connection if you are connected.

Try it

But what I would do is use both paths ie

<link rel=”stylesheet” type=”text/css” href=”MyFontsWebfontsKit.css”>
<link rel=”stylesheet” type=”text/css” href=”http://www.mysite.com/MyFontsWebfontsKit.css”>

So if the Fonts are not available locally then the fallback is from the server.

But of course the paths are critical here - if the fonts.css file is not where you are looking for it then no font display live or local.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I don’t think this is a very good idea. You will get two copies of the same sheet, not a fallback. Two different URLs are treated differently by a browser. There are a couple or more articles in the SP KnowledgeBase about setting up Web fonts so they can be previewed locally. The key is to install those fonts on your Mac as local system fonts, and then you can refer to them by name in your Freeway-generated stylesheet, and they will be picked up from the local system, not as Web fonts, just as Helvetica Neue or Palatino would be.

Your font stylesheet like this:

<link rel=”stylesheet” type=”text/css” href=”http://www.mysite.com/MyFontsWebfontsKit.css”>

would be followed by various “named” fonts in your regular stylesheet, say like this:

<style>
  h1 {
    font: 300%/1.6 'Open Sans', sans-serif;
  }
</style>

That ‘Open Sans’ would attempt first to resolve to a locally-installed font, failing that, the one defined in the MyFontsWebfontsKit.css would be used.

Walter

On Feb 14, 2015, at 6:00 AM, DeltaDave email@hidden wrote:

Thanks Dave, it is how Ernie described it indeed

That doesn’t mean that you cannot use the full URL for this. All it means is that the font is served to you via your internet connection if you are connected.

Try it

But what I would do is use both paths ie

<link rel=”stylesheet” type=”text/css” href=”MyFontsWebfontsKit.css”>
<link rel=”stylesheet” type=”text/css” href=”http://www.mysite.com/MyFontsWebfontsKit.css”>

So if the Fonts are not available locally then the fallback is from the server.

But of course the paths are critical here - if the fonts.css file is not where you are looking for it then no font display live or local.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You will get two copies of the same sheet

Cant see that as much of an issue as we are probably only talking about a few Kb in size.

The problem as I see it - and I have seen it often - is that a FW user sets up the font on their Mac and as a Font Set in FW to give them local display.

But something goes wrong with the path to the CSS file or naming of files within it and the FW user still sees the ‘web font’ but only because they have it on their system and are lulled into a false sense of security.

I had a case earlier this week where the Client’s machine would not display the web font but the FW user could and couldn’t understand what the problem was.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The problem as I see it - and I have seen it often - is that a FW user sets up the font on their Mac and as a Font Set in FW to give them local display.

Yep.

But something goes wrong with the path to the CSS file …

I’m not aware how MyFonts works. I assume you get two things:

The css-file and the FONTs. Furthermore, I assume that the path within the css file points to somewhere or nowhere - so my questions is:

  1. Where to you put your FONT resources?

  2. What is the path (structure) within the css-file?

If my assumptions are wrong - sorry, but my experience is that you can make bread display local (if you want).

If you don’t get the resource (FONTs) physically (such as TypeKit works), you need a developing surrounding - e.g. MAMP as a local dev. The path is then something like 127.0.0/bla/bla or whatever, cause you need to enable TypeKit to point back and forth (remote hosting).

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

… oh yes. Forgot to mention that a ctrl-click → “inspect element” helps as well. Just to figure out which resource missing why.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

  • Where is your webfont.css file located?
  • Where are your web fonts located?
  • On your webfont.css: is the path file to those web fonts correct (depending on where the css file and the web fonts are located)?
  • Have you added the font-family name exactly as stated in the webfont.css to your font sets within Freeway? – That includes the surrounding single quotes b.t.w.

Richard


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options