06-20-2012, 12:15 PM | #1 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
font problems in ADE
Hi all
I've made an ePUB file from Adobe Indesign which I have since done a fair amount of work to. It validates okay and displays as expected. Now the customer wants us to try and use the fonts from the print edition in the ePUB. Fair enough, I know how, but I've got a problem. I have manually embedded one font (Open Sans, a Google Web Font) and the code I have added makes it display okay in Chrome and seems to display in ADE too. Trouble is, it displays as bold in ADE (it's a semi-bold font and displays as such in Chrome). I copied the "font-style: normal; font-weight: 600;" code from the GWF website - the 600 denotes the semi-bold variant. The CSS code is as follows; Code:
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 600; src : url(fonts/OpenSans-Semibold.ttf); } p.A-head-article-title { font-family: "Open Sans", sans-serif; letter-spacing: -0.05em; word-spacing: 0.06em; font-size: 2em; color: black; -webkit-hyphens:none; margin-top: 0em; margin-bottom: 0.5em; } thanks, Iain |
06-20-2012, 12:25 PM | #2 | |
Resident Curmudgeon
Posts: 73,676
Karma: 128176798
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
Code:
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: normal; src : url(fonts/OpenSans-Semibold.ttf) } p.A-head-article-title { font-family: "Open Sans", sans-serif; font-size: 2em; color: black; -webkit-hyphens:none; margin-top: 0; margin-bottom: .5em } |
|
Advert | |
|
06-20-2012, 02:28 PM | #3 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
Thanks for your reply JSWolf.
What exactly did you change in the code? I see you changed the font-weight to "normal" when I declared the font, rather than "600". As I said I copied that from the Google Web Fonts site (where the fonts came from) - I can't say I'd ever seen font weights expressed like that in CSS before but I assumed they knew best. I'll try it your way and see if it makes a difference. I use Chrome as an alternative to ADE as it uses the webkit rendering engine the same as iBooks. I don't always have access to an iPad and I know the iPad will make-up a sizeable proportion of the audience for this title. You think it is not similar enough to be worthwhile? The semi-bold is the only font I have embedded. I do have a bold variety but it is not embedded or referenced anywhere in the file. In the opf file is the line <?xml version="1.0" encoding="UTF-8" standalone="yes"?> I take it you are suggesting changing it to <?xml version="1.0" encoding="UTF-8 without BOM" standalone="yes"?> and then the same in the ncx file etc? I'm at home so can't do it at the moment - what is that doing exactly? |
06-20-2012, 03:10 PM | #4 | |
Resident Curmudgeon
Posts: 73,676
Karma: 128176798
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
[QUOTE=iain robinson;2122007]Thanks for your reply JSWolf.
What exactly did you change in the code? I see you changed the font-weight to "normal" when I declared the font, rather than "600". As I said I copied that from the Google Web Fonts site (where the fonts came from) - I can't say I'd ever seen font weights expressed like that in CSS before but I assumed they knew best. I'll try it your way and see if it makes a difference. I use Chrome as an alternative to ADE as it uses the webkit rendering engine the same as iBooks. I don't always have access to an iPad and I know the iPad will make-up a sizeable proportion of the audience for this title. You think it is not similar enough to be worthwhile? The semi-bold is the only font I have embedded. I do have a bold variety but it is not embedded or referenced anywhere in the file. Quote:
As for the font, I can give it a go and see what happens with ADE. ADE does not support font-weight commands that specify an actual weight. I have no idea if iBooks would or not. But the way to do it is to have the different font styles for that font family that you will need. I will give that font a go in ADE and see how it looks. I can also try it in iBooks and Bluefire and see how they both look on an iPad. |
|
06-20-2012, 03:24 PM | #5 |
Resident Curmudgeon
Posts: 73,676
Karma: 128176798
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
I've had a look in ADE and I used both the semibold and the bold versions to compare and the bold version does look thicker. But the semibold compared to the default ADE does look boldish and could be taken for bold. It's not a problem in ADE. It's just the way the font is.
|
Advert | |
|
06-20-2012, 03:25 PM | #6 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
Okay, thanks. I'll have a look tomorrow.
|
06-21-2012, 05:44 AM | #7 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
You're absolutely right - how the font displays in ADE is correct. I checked it in Adobe Indesign. Sigil and Chrome both display it incorrectly
That's fine - I'll just use regular then. It's a real pain in the ass not having actual devices to check these things on because the software's a nightmare. Thanks again for your help. Just out of interest - if you made a test file, did it display as the same weight in iBooks? |
06-21-2012, 06:16 AM | #8 |
frumious Bandersnatch
Posts: 7,514
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
The idea behind the @font-face declaration (which doesn't mean that's the way it works in actual renderers) is this:
1. You declare a font as "bold", "italic", whatever in the @font-face rule. It doesn't mean the font file has those properties, it just instructs the renderer to use the linked font file when the correponding font-family/font-weight/font-style/font-variant combination is requested. 2. You then have to use the font with the matching font-family/font-weight/font-style/font-variant combination. So, if you declare a font as "font-weight: 600" in the @font-face, you have to use "font-weight: 600" in the style of the element you want the font applied to (either directly or as part of some other cascading/inherited styles). |
06-21-2012, 08:32 AM | #9 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
Ahh - that makes sense. Thanks Jellby.
|
06-21-2012, 03:32 PM | #10 | |
Resident Curmudgeon
Posts: 73,676
Karma: 128176798
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
|
|
06-22-2012, 04:49 PM | #11 |
Resident Curmudgeon
Posts: 73,676
Karma: 128176798
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
I've put the eBook on the iPad in both iBooks and Bluefire and they look the same as far as that font family goes. The semi-bold does not look as bold as it does under ADE for Windows. But the bold also looks less bold as well.
I would not worry. Everything is OK as far as I can see on ADE for Windows and iBooks & Bluefire for the iPad. |
06-25-2012, 02:53 AM | #12 |
Connoisseur
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
|
That's reassuring to know. Thanks for checking for me.
cheers |
Thread Tools | Search this Thread |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
ADE Font Rendering Engine? | totanus | General Discussions | 7 | 02-18-2011 01:23 PM |
Does ADE suport only one font without embedding? | eping | ePub | 5 | 08-27-2010 11:30 AM |
Directionality, font-embedding and ADE | lecteur9 | ePub | 6 | 12-04-2009 06:26 AM |
Adobe ADE Font Too Small | Musicman | Astak EZReader | 2 | 09-22-2009 10:40 AM |
What's the default ADE font? | Jellby | ePub | 13 | 09-14-2009 03:59 PM |