impallari / Font-Testing-Page

A webpage for testing typefaces, live at www.impallari.com/testing
https://impallari.com/testing/
Other
252 stars 83 forks source link

Use webfont? #59

Closed CatharsisFonts closed 9 years ago

CatharsisFonts commented 9 years ago

Hi Pablo et al.,

it would be great if the testing page couldn't only use local files dragged into the header, but also webfonts at a given online location. Even better would be if that location could be specified as part of the URL calling the font testing page. This way, it could be used with BrowserStack to inspect a font on various platforms and in various browsers.

Cheers, Christian

impallari commented 9 years ago

Great Idea... but who will code that? Code it and send a pull request :)

chakler commented 9 years ago

I can try to work on this :smiley:

impallari commented 9 years ago

You're welcome!!!

CatharsisFonts commented 9 years ago

Alternatively, you could provide an alternate version of your test page that has a webfont address hardcoded in it. Then I could just clone that page on my webspace and change the address to the newest commit of my TTF files. I bet that's a much easier change to implement...!

weiweihuanghuang commented 9 years ago

@chakler that would be awesome—https://github.com/impallari/Font-Testing-Page/issues/34 what do you think about this? I wish I could help but I don't know javascript…

chakler commented 9 years ago

@weiweihuanghuang Nice idea, but I'll try to work on the webfont part first :smiley:

chakler commented 9 years ago

After some research, it looks like the whole approach won’t work since Firefox won’t let you load webfonts from other origin for safety reasons.

I wouldn’t suggest to implement this feature for the sake of it working on other browsers.

More info about this here.

CatharsisFonts commented 9 years ago

What if the webfont is hosted on the same site as the font testing page?

chakler commented 9 years ago

@CatharsisFonts It should work if the webfont is hosted under the same domain as the testing page.

But if that’s the case, can't you just drag the woff manually?

davelab6 commented 9 years ago

Its not firefox, its the web server. The http server just has to have a permission setting turned on.

https://www.maxcdn.com/one/tutorial/how-to-use-cdn-with-webfonts/

chakler commented 9 years ago

@davelab6 Yes it’s the server. But the cross origin webfont still works on chrome despite the permission set off.

I guess hardcoding it would be a better choice for testing the font with BrowserStack. Since changing the permission means others can also use your font on their website(Which is unlikely though.) :smiley:

CatharsisFonts commented 9 years ago

But if that’s the case, can't you just drag the woff manually?

No, I'm trying to pipe the website through BrowserStack to obtain screenshots of what it looks like on different systems and with different browsers. I can't interact with the webpage other than by providing its URL to BrowserStack. If the webfont were hardcoded into the page, that would be no problem.

I guess hardcoding it would be a better choice for testing the font with BrowserStack. Since changing the permission means others can also use your font on their website(Which is unlikely though.) :smiley:

The font is Open Source, so they're more than welcome to use the font on their website. :smile:

davelab6 commented 9 years ago

What I mean is that you can have a form input in the page to enter a TTF URL, and if the URL's httpd is set up right, then the font can then be made available to the testing page. www.testmyfont.com works this way.

chakler commented 9 years ago

@CatharsisFonts Nice! I guess it won’t be a problem then :stuck_out_tongue: @davelab6 Yup I’ll try to work on it. Thinking of appending the font URL as hash to the page URL. :smile:

CatharsisFonts commented 9 years ago

That would be perfect! :smile: So would this be able to load the font from GitHub with the right permissions...?

chakler commented 9 years ago

@CatharsisFonts If your fonts are hosted on GitHub, I don’t think so since you can’t enable CORS on gh-pages. :disappointed:

http://stackoverflow.com/questions/26416727/cross-origin-resource-sharing-on-github-pages

davelab6 commented 9 years ago

http://blog.rodneyrehm.de/archives/35-Including-Data-From-Github.html

Use rawgit.com + crossorigin.me

On 2 September 2015 at 23:24, Aceler Chua notifications@github.com wrote:

@CatharsisFonts https://github.com/CatharsisFonts If your fonts are hosted on GitHub, I don’t think so since you can’t enable CORS on gh-pages. [image: :disappointed:]

http://stackoverflow.com/questions/26416727/cross-origin-resource-sharing-on-github-pages

— Reply to this email directly or view it on GitHub https://github.com/impallari/Font-Testing-Page/issues/59#issuecomment-137316538 .

Cheers Dave

impallari commented 9 years ago

This is getting too complex.... keep in mind that I want to keep the Testing Page as simple as possible. If the solution increase the complexity to the point that things get messy, I prefer to say "no, thanks". So if anyone find a solution, it has to be really really simple, otherwise it will not be accepted.

davelab6 commented 9 years ago

You mean code complexity or user complexity?

CatharsisFonts commented 9 years ago

I think the ability to test a font on a variety of browsers and systems instantly would be very valuable to a large number of type designers. If you want to keep the Testing Page as uncluttered as possible, you could still offer a variant of it with a hard-coded link to a URL that people could download and use independently of the official Testing Page.

impallari commented 9 years ago

code complexity or user complexity?

Both :)

that people could download and use independently of the official Testing Page.

Anyone can download it from GitHub, upload to his/her own server, and tweak as desired.

CatharsisFonts commented 9 years ago

Not everybody knows how to do that! Would be great if Chakler did it and made it public. :smile: