MinchinWeb / seafoam

Pelican theme, first used for Minchin.ca.
https://blog.minchin.ca/label/seafoam/
MIT License
5 stars 2 forks source link

Drop Caps #33

Open MinchinWeb opened 1 month ago

MinchinWeb commented 1 month ago

The first question is, Whether to do a font or an image?

Also traditionally, the first sentence (or first few words or the full first line) are set in small caps afterwards.


As a font, it has backwards "downgradability", but is generally limited to a single colour. However, the drop cap could itself be a different colour than the rest of the text; red is somewhat historically common here.

Also with a font, I may be able to "build" the more traditional drop cap by adding a background (colour or repeating image) and a border (with CSS).

There are so fonts that effectively are drop caps, but I want one that remains legible, which rules out many of them.

Loading the full font for a single letter may cause enough loading delay that it becomes worthwhile to split up the font into single letters font files.

Goudy Initialen does seem like a good option, and the split font files and CSS are already available (under a MIT license).

image

Other possible "raw" fonts include Grenze Gotisch (shown below at 400 weight, but available 9 total weights) or possibly Emily's Candy

image

image


For image based, it's just to find/create a set of images.

Florida's Educational Technology Clearinghouse has a set of dropcaps in >120 variants per letter, although it may take some work to generate a consistent set.

I tried generating dropcaps through local AI image generation, but text is generally beyond the current capabilities. Gwern had some success with this, although the "raw" letters were then converted to SVGs and finally to font files.


Gwern doesn't like using dropcaps on mobile, it part due to the additional download size and also the limit screen space to display them.

c.f. https://gwern.net/dropcap

MinchinWeb commented 1 month ago

Additional (black and white) images --> https://etc.usf.edu/clipart/galleries/186-decorative-letters