What am I missing in using for bold? - Page 2

Ripplinger · 03-23-2013, 07:10 PM

One thing I've picked up from this thread is a preference to use a span class for bold and italics rather than just and . I've usually gone for the simplest coding before and stuck to and mostly because of running into paragraphs with so much "span class" clutter, it gets difficult to wade through the code when it keeps swapping back and forth.

Is there a difference in how some readers will handle and so that using span class would really be preferable?

theducks · 03-23-2013, 07:15 PM

Quote:

Originally Posted by Ripplinger

One thing I've picked up from this thread is a preference to use a span class for bold and italics rather than just and . I've usually gone for the simplest coding before and stuck to and mostly because of running into paragraphs with so much "span class" clutter, it gets difficult to wade through the code when it keeps swapping back and forth.

Is there a difference in how some readers will handle and so that using span class would really be preferable?

Span class=
Allows you full control: Maybe I want italic...No wait...Underlined....No wait...BoldItalic. Ah, heck PLAIN

Turtle91 · 03-23-2013, 07:59 PM

Quote:

Originally Posted by theducks

Span class=
Allows you full control: Maybe I want italic...No wait...Underlined....No wait...BoldItalic. Ah, heck PLAIN

That certainly gives full control, and if you wanted to take that to it's extreme you could have spans around every letter!! Just imagine the bloat!

But, as they were saying above, you can define , , , to do anything you want. I would think that a span should only be used when there IS NOT already a tag that does the same thing.

Why replace with , or with ??

There is a list of commonly used tags in the standards for the exact reason that they are commonly used and you can reduce bloat and increase readability by using them.

theducks · 03-23-2013, 08:45 PM

Every Letter? Absurd

While allowed, A redefined b to something else is confusing.

Let us leave standard tags (mostly) as is
Bold is bold
Italic is slanty

You might tweak the size or line-space, but they are still what they say

Bloat comes from people spanning everything instead of just the differences:

Code:

<p><span class="bloated-normal">This is Span<\span> <span class"underscore">Abuse</span> <span class="bloated-normal">at it's worse.</span></p>

Code:

<p class="normal">This is Span done <span class"underscore">nicer</span> more normally.</p>

Ripplinger · 03-23-2013, 09:03 PM

Unfortunately, your first example is what I've run into far too often. When you drop the size of an ebook by 100kb just by replacing all the span class options for just bold and italics to and , I go for dropping the bloat. So it seems it's still an ok option to use. I never redefine b or i for that purpose. The most I redefine are h tags at times because the default is just too large at times.

Turtle91 · 03-23-2013, 09:28 PM

When I first started out I wanted my docs to be as clean as possible and always used and . After studying a bit more I've been convinced that I should keep only structure tags in the document and all styling in the .css. I really hated adding those and tags!! I still use and when coding...and then just do a S/R to change them at the end - that way I don't have to look at the and tags taking up that extra room!! Whatever works right!!

I like your second example...but this would be better:

Code:

<p>This is done <em class="underscore">nicer</em> more normally.</p>

with
p {"normal paragraph styling"}
em.underscore {text-decoration:underline; font-style:normal}

Since the tag is specifically designed to emphasize some text...its only that most readers default to italics. When we are defining the structure of the document we should simply say that particular words are emphasized with a given class.

Now...in that particular case a span would work just as well, but it would be 4 letters longer (2 for each tag). Depending on the book, 4 letters per italics can add up to a bunch of bloat.

Now imagine using ... as opposed to ... (with em {font-style:italic} ); that's 22 letters longer per instance!!

I suppose I'm being a little OCD-ish, but I just hate the idea of taking up more space than I absolutely have to. I just cleaned up a book I bought (it's amazing how many bad practices they do in a "professional" book) and reduced the file size from 3.3MB to 1.2MB....I did a happy dance...literally. Yes, I need a life!

Cheers!

Ripplinger · 03-23-2013, 10:17 PM

Quote:

Originally Posted by Turtle91

... I suppose I'm being a little OCD-ish, but I just hate the idea of taking up more space than I absolutely have to. I just cleaned up a book I bought (it's amazing how many bad practices they do in a "professional" book) and reduced the file size from 3.3MB to 1.2MB....I did a happy dance...literally. Yes, I need a life!

Cheers!

You're not the only then, I'm exactly the same way. Epubs bloated for no reason really bug me and I have to clean them up. Over-sized images and multiple copies of the same image contribute a lot to that bloat also and I clean those up as well and compress the images.

theducks · 03-23-2013, 10:30 PM

Quote:

Originally Posted by Ripplinger

You're not the only then, I'm exactly the same way. Epubs bloated for no reason really bug me and I have to clean them up. Over-sized images and multiple copies of the same image contribute a lot to that bloat also and I clean those up as well and compress the images.

I have done that.
I have even gone so far as to rebuild an Image only chapter head, with an Image with Text counterpart. Talk about file size shrinkage (saved >1M). This was not STRIPPING the images, just doing it (size) efficiently

Turtle91 · 03-23-2013, 11:00 PM

Quote:

Originally Posted by theducks

I have done that.
I have even gone so far as to rebuild an Image only chapter head, with an Image with Text counterpart. Talk about file size shrinkage (saved >1M). This was not STRIPPING the images, just doing it (size) efficiently

Absolutely!! lol

I just don't understand why people would have a different image for each chapter when the only difference in the image is the number!! Just use a header with the number and the same image...only 1 image for 69 chapters instead of 69 images....sheesh.

theducks · 03-23-2013, 11:13 PM

Quote:

Originally Posted by Turtle91

Absolutely!! lol

I just don't understand why people would have a different image for each chapter when the only difference in the image is the number!! Just use a header with the number and the same image...only 1 image for 69 chapters instead of 69 images....sheesh.

Because it is a lot of work to get it looking good. IMHO this does NOT work on tiny displays. (I tried reading on my phone: 3 words a line, 40 bazillion page flips

, talk about breaking a readers trance

Ripplinger · 03-23-2013, 11:19 PM

I've run into books with 35+ chapters where each had a graphic image, one for each chapter, identical to every other chapter image except for a few pixels in the dimensions for the white space around it (which I'm sure was just accidental), and the image did not include the chapter number... the number of the chapter itself was in text.

I just don't know what publishers are thinking when they do something that asinine.

mrmikel · 03-24-2013, 06:47 AM

There are instances where the css makes sense. The case that comes to mind is picture captions. Sometimes smaller text looks good, sometimes italics. The css approach lets you tweak it just right without much pain.

zacsmith · 03-24-2013, 10:16 AM

Back again....

After testing my files I find the more reliable way to bold text is simply yo use "" and not a span or redefined "b". Saves file space, too.

So I'm going to replace all the span class statements with plain ol' "b"s. and do the italics while I'm at it.

Thanks for the discussion. It's been very educational and opened my eyes to more CSS possibilities.

zack

Arios · 03-24-2013, 12:17 PM

Quote:

Since cannot contain <div>, I sometimes create a special class of that behaves as <div>, and then can contain this

Jellby, can you be more specific about it, it intrigues me (purpose of this special class for example)?

Jellby · 03-25-2013, 03:59 AM

Well, say you want a paragraph to contain a display block (an image, a poetry fragment, a newspaper title...) and continue with no indent afterwards. You could do it by breaking the paragraph:

Code:

<p>He read that:</p>
<div class="title">ANDORRA INVADES FRANCE</div>
<p class="noindent">and fainted.</p>

or you try to keep the structure:

Code:

<p>He read that:
<span class="block title">ANDORRA INVADES FRANCE</span>
and fainted.</p>

where:

Code:

span.block { display: block; }

03-23-2013, 07:10 PM	#16
Ripplinger 350 Hoarder Posts: 3,574 Karma: 8281267 Join Date: Dec 2010 Location: Midwest USA Device: Sony PRS-350, Kobo Glo & Glo HD, PW2	One thing I've picked up from this thread is a preference to use a span class for bold and italics rather than just <b> and <i>. I've usually gone for the simplest coding before and stuck to <b> and <i> mostly because of running into paragraphs with so much "span class" clutter, it gets difficult to wade through the code when it keeps swapping back and forth. Is there a difference in how some readers will handle <b> and <i> so that using span class would really be preferable?

03-23-2013, 08:45 PM	#19
theducks Well trained by Cats Posts: 29,800 Karma: 54830978 Join Date: Aug 2009 Location: The Central Coast of California Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A	Every Letter? Absurd While allowed, A redefined b to something else is confusing. Let us leave standard tags (mostly) as is Bold is bold Italic is slanty You might tweak the size or line-space, but they are still what they say Bloat comes from people spanning everything instead of just the differences: Code: <p><span class="bloated-normal">This is Span<\span> <span class"underscore">Abuse</span> <span class="bloated-normal">at it's worse.</span></p> Code: <p class="normal">This is Span done <span class"underscore">nicer</span> more normally.</p>

03-23-2013, 09:03 PM	#20
Ripplinger 350 Hoarder Posts: 3,574 Karma: 8281267 Join Date: Dec 2010 Location: Midwest USA Device: Sony PRS-350, Kobo Glo & Glo HD, PW2	Unfortunately, your first example is what I've run into far too often. When you drop the size of an ebook by 100kb just by replacing all the span class options for just bold and italics to <b> and <i>, I go for dropping the bloat. So it seems it's still an ok option to use. I never redefine b or i for that purpose. The most I redefine are h tags at times because the default is just too large at times.

03-23-2013, 09:28 PM	#21
Turtle91 A Hairy Wizard Posts: 3,094 Karma: 18727053 Join Date: Dec 2012 Location: Charleston, SC today Device: iPhone 11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire	When I first started out I wanted my docs to be as clean as possible and always used <i> and <b>. After studying a bit more I've been convinced that I should keep only structure tags in the document and all styling in the .css. I really hated adding those <em> and <strong> tags!! I still use <i> and <b> when coding...and then just do a S/R to change them at the end - that way I don't have to look at the <em> and <strong> tags taking up that extra room!! Whatever works right!! I like your second example...but this would be better: Code: <p>This is done <em class="underscore">nicer</em> more normally.</p> with p {"normal paragraph styling"} em.underscore {text-decoration:underline; font-style:normal} Since the <em> tag is specifically designed to emphasize some text...its only that most readers default to italics. When we are defining the structure of the document we should simply say that particular words are emphasized with a given class. Now...in that particular case a span would work just as well, but it would be 4 letters longer (2 for each tag). Depending on the book, 4 letters per italics can add up to a bunch of bloat. Now imagine using <span class="italics">...</span> as opposed to <em>...</em> (with em {font-style:italic} ); that's 22 letters longer per instance!! I suppose I'm being a little OCD-ish, but I just hate the idea of taking up more space than I absolutely have to. I just cleaned up a book I bought (it's amazing how many bad practices they do in a "professional" book) and reduced the file size from 3.3MB to 1.2MB....I did a happy dance...literally. Yes, I need a life! Cheers! Last edited by Turtle91; 03-23-2013 at 09:43 PM.

03-24-2013, 10:16 AM	#28
zacsmith Junior Member Posts: 8 Karma: 10 Join Date: Oct 2012 Device: Kindle, iPhone 3GS	Back again.... After testing my files I find the more reliable way to bold text is simply yo use "<b>" and not a span or redefined "b". Saves file space, too. So I'm going to replace all the span class statements with plain ol' "b"s. and do the italics while I'm at it. Thanks for the discussion. It's been very educational and opened my eyes to more CSS possibilities. zack

03-23-2013, 11:19 PM	#26
Ripplinger 350 Hoarder Posts: 3,574 Karma: 8281267 Join Date: Dec 2010 Location: Midwest USA Device: Sony PRS-350, Kobo Glo & Glo HD, PW2	I've run into books with 35+ chapters where each had a graphic image, one for each chapter, identical to every other chapter image except for a few pixels in the dimensions for the white space around it (which I'm sure was just accidental), and the image did not include the chapter number... the number of the chapter itself was in text. I just don't know what publishers are thinking when they do something that asinine.

03-24-2013, 06:47 AM	#27
mrmikel Color me gone Posts: 2,089 Karma: 1445295 Join Date: Apr 2008 Location: Central Oregon Coast Device: PRS-300	There are instances where the css makes sense. The case that comes to mind is picture captions. Sometimes smaller text looks good, sometimes italics. The css approach lets you tweak it just right without much pain.

03-25-2013, 03:59 AM	#30
Jellby frumious Bandersnatch Posts: 7,516 Karma: 18512745 Join Date: Jan 2008 Location: Spaniard in Sweden Device: Cybook Orizon, Kobo Aura	Well, say you want a paragraph to contain a display block (an image, a poetry fragment, a newspaper title...) and continue with no indent afterwards. You could do it by breaking the paragraph: Code: <p>He read that:</p> <div class="title">ANDORRA INVADES FRANCE</div> <p class="noindent">and fainted.</p> or you try to keep the structure: Code: <p>He read that: <span class="block title">ANDORRA INVADES FRANCE</span> and fainted.</p> where: Code: span.block { display: block; }

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
span in span: is this problematic?	tbuyus	ePub	8	03-31-2013 08:01 AM
Regex and span	JSWolf	Sigil	7	01-23-2013 06:35 AM
how do I span more than one line with regex	BartB	Sigil	3	12-11-2011 05:12 PM
Remove <br /> together with span, and only span	Razzia	Recipes	3	05-30-2011 06:55 PM
Re Entering Title in Bold or Bold And Colour Font	pricespringer	Library Management	1	05-09-2011 04:45 AM