Home / Blog Menu ↓

Latin declensions chart update

/ #charts #css #html #languages #latin #plotdevice

I ported my Latin declensions chart from PlotDevice (which was Mac-only and thus not accessible to people without Macs) to HTML/CSS.

Some notes:

  • My goal with this was to make a chart that’s modifiable as easily as possible without building a full chart-generation app.
  • Because this HTML and CSS is intended for print and not at all for the responsive web, there are a few ways I did things that I probably wouldn’t have used on a web project.
  • I considered using on-page JavaScript to generate the table HTML, since right now there’s a lot of duplication, but I opted to stick with straight HTML to make it easier for non-technical people to modify.
  • The column widths are manually set so that things line up across tables. I could have done one big table instead, but the editing ergonomics would have been substantially worse.
  • Chrome still can’t print lines less than 1pt in width, so I used Firefox to export the PDF.
  • I wish custom properties worked in @page. I also plan to eventually refactor this so that more of the CSS is configurable via custom properties. (At this point it’s just column widths/gaps and colors.)
  • This 3.0 version of the chart changes the font from Museo Sans / Minion Pro to EB Garamond, so that the font is freely available. (EB Garamond also feels more appropriate to Latin than Museo Sans.)