PPTools/Ppgen/Drop Caps Examples

Ppgen allows you to easily create Drop Caps, typically used at the beginning of a chapter or section in a book. This page will show several examples of how the parameters on the .dc command affect the result in a browser.

Important considerations:

• It is important to note that the results may be somewhat dependent on the browser you (or the book's reader) is using. In particular, as I write this

it appears that Firefox completely ignores the second parameter of the .dc command. So I would recommend trying your file in several different browsers before deciding that your .dc parameters are correct.

• The results will also depend, to some extent, on whether the user has chosen a serif or non-serif font (the Firefox example demonstrates

this).

• Also, though drop caps are usually used at the start of a chapter or section you might choose to use them anywhere

within your text. In that case, your results may also be affected by the spacing to the line above the drop cap.

• Furthermore, Ppgen allows you to control the spacing between paragraphs using the .nr command, which may also play a role in how

your drop caps appear if you use one at the beginning of a paragraph which has another paragraph immediately above it.

Example 1: In this example we use the command ".dc 0.4 0.4" with the letter S. This first set of examples will focus on the first 
parameter (0.4 here) which primarily controls the spacing between the drop cap and the text which follows it.
(There may be a secondary effect of shifting the entire line slightly in some browsers.)

In this example, note the spacing between the large S and the w which follows it, as well as
the general left-to-right position of the S with respect to the N above it.
         

Example 2: .dc 0.1 0.4   In this example we change the first parameter to 0.1, which will shift the text
following the S to the right relative to the S. Smaller numbers shift the following text to the 
right; larger numbers shift it to the left, relative to the S.
 
Note the slightly wider spacing between the S and w. You may also notice that
the entire line is shifted slightly to the right relative to the line above (compare with
example 1).
         

Example 3: .dc 0.7 0.4   In this example we change the first parameter to 0.7, which will shift the text
following the S to the left relative to the S.
 
Note that the S and w are now overlapping, and 
the entire line is shifted slightly to the left relative to the line above (compare with
examples 1 and 2). 
         

Example 4: .dc 0.4 0.4   In this example we go back to a first parameter of 0.4, but change the letter we're
working with from S to T. Each letter will require experimentation to figure out the correct
parameters to use with that letter, and your final numbers may also depend on which letter follows
the drop cap, too.
 
For this one, compare the position of the T with the position of the S in example 1. Also note 
the position of the dot on the "i" of Tinsel with the crossbar of the T. The visual appearance
may play a factor in the numbers you choose.
         

Example 5: .dc 0.4 0.5   Staying with T, but now let's change the second parameter from 0.4
to 0.5. This parameter adjusts the vertical placement of the drop cap (internally, it modifies
the HTML line-height attribute of the first letter in the paragraph, but you don't really
need to understand that; it's part of the magic of CSS that Ppgen worries about for you).
 
Again, the text that follows the drop cap may be important in figuring out which value you 
choose for the second parameter, as well as seeing how the text on the following line looks
when it wraps around the letter.
 
For this one, compare the position of the T with its position in example 4, and with the dot of the 
i which follows it. You should see that be increasing the second parameter we raised the T slightly.
This also allowed the text on the next line to flow differently, which in this case gave an 
unfortunate collision.
         

Example 6: .dc 0.4 0.2   In example 5 we increased the second parameter from 0.4 to 0.5. For
this one we decreased it to 0.2 
 
To our surprise (well, to my surprise, at least) this has again raised the T if we look at the
dot of the i and also compare with the distance to the line above it. And the next line
now does not collide as much as it did before. Clearly I need to do some more experimenting
with this before I'll feel comfortable that I understand it completely. (For anyone else trying
this, my experiments for this article were with Chrome, on Windows 7.)
         

Example 7: .dc 0.4 0.1   Further decreasing the second parameter continues to raise the T in relation
to the i that follows it, the line above it, and the line below it.
         

Example 8: .dc 0.4 0.8   Just for fun, this example increased the second parameter to 0.8 to 
see what would happen.
 
The result is a significant lowering of the T relative to the line above and to the i which follows
and to the line below. This has now forced the text on the next line further to the 
right to avoid a collision.
         

Example 9: .dc 0.4 0.4   This example used Firefox rather than Chrome, and with 0.4 0.4 as the parameters
to the .dc command. I've included it primarily to show that use of fonts with serifs (which is under
the user's control, not ours) will also have an effect. But also to mention, again, that Firefox does
not seem to honor the second parameter. I was unable to do anything to raise the T away from the dot of the
i. And because of the serifs, that combination did not work well in Firefox (though it was acceptable in
Chrome using a different font. Compare with example 4 to see what I mean.