Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 06-20-2012, 12:15 PM   #1
iain robinson
Connoisseur
iain robinson began at the beginning.
 
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;
}
Anyone got any thoughts? I know the client will be previewing the files in ADE.

thanks,
Iain
iain robinson is offline   Reply With Quote
Old 06-20-2012, 12:25 PM   #2
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,660
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by iain robinson View Post
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;
}
Anyone got any thoughts? I know the client will be previewing the files in ADE.

thanks,
Iain
Couple of things...First, the code needs fixing...

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
}
What could be happening is that the semi-bold font is displaying correctly and it just a bit bolder then you expected. You cannot base anything on Chrome. That just doesn't count. Is this the only font you have embedded? Do you have a bold variety? If you do, then it could be an encoding issue. ADE can be picky about this. I've had this happen before where I've embedded a full font family and where normal should have been used, I got bold. Get a copy of Notepad++, load in all the files (CSS, OPF, ncx, XML) and make sure the encoding of every file is UTF-8 without BOM. Once that's done, put them all back in the ePub and try it again in ADE.
JSWolf is offline   Reply With Quote
Advert
Old 06-20-2012, 02:28 PM   #3
iain robinson
Connoisseur
iain robinson began at the beginning.
 
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?
iain robinson is offline   Reply With Quote
Old 06-20-2012, 03:10 PM   #4
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,660
Karma: 127838196
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:
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?
I'm suggesting you install Notepad++ and load every text file (OPF, CSS, XML, ncx) into Notepad++ and check the encoding. Notepad++ has an encoding menu that has nothing to do with the encoding that you are talking about. Notepad++ supports tabs, so you can load everything at once and close each tab as you finish.

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.
JSWolf is offline   Reply With Quote
Old 06-20-2012, 03:24 PM   #5
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,660
Karma: 127838196
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.
JSWolf is offline   Reply With Quote
Advert
Old 06-20-2012, 03:25 PM   #6
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
Okay, thanks. I'll have a look tomorrow.
iain robinson is offline   Reply With Quote
Old 06-21-2012, 05:44 AM   #7
iain robinson
Connoisseur
iain robinson began at the beginning.
 
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?
iain robinson is offline   Reply With Quote
Old 06-21-2012, 06:16 AM   #8
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
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).
Jellby is offline   Reply With Quote
Old 06-21-2012, 08:32 AM   #9
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
Ahh - that makes sense. Thanks Jellby.
iain robinson is offline   Reply With Quote
Old 06-21-2012, 03:32 PM   #10
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,660
Karma: 127838196
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by iain robinson View Post
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?
I've not yet tested it in iBooks. I'll do so tonight and report back.
JSWolf is offline   Reply With Quote
Old 06-22-2012, 04:49 PM   #11
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 73,660
Karma: 127838196
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.
JSWolf is offline   Reply With Quote
Old 06-25-2012, 02:53 AM   #12
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
That's reassuring to know. Thanks for checking for me.

cheers
iain robinson is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

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


All times are GMT -4. The time now is 07:42 PM.


MobileRead.com is a privately owned, operated and funded community.