Choosing a Flat-File CMS

The static site generators that seem to be so popular at the moment are not all that appealing to me. I’ve looked at the more popular ones several times and I just can’t convince myself to invest any time in them. WordPress sites, which is what I’ve been building most over the last several years, aside from old-fashioned static sites, can really get on my nerves, both with how slow they are and how much maintenance WordPress itself needs to keep a site safely and functionally up and running. I’ve been eyeing flat-file CMSs for a while now because they’re fast, easy to install, and give my clients a way to manage content.

What: A quick list of flat-file content management systems for reference, with some of my thoughts added when I think those thoughts might be of use to me later. I did a lot of searching around today, a lot of reading documentation and some actual testing. These all seem to be actively maintained, have documentation and demos and/or are free (to try).

Read more

Yes, I Still Print Webpages

It’s been years since I had to make a print version of a webpage and support for page-break-before and page-break-after in Chrome seems to have improved in the mean time–even if I’m really supposed to switch to break-after (support for that seems to be lacking in Chrome, Edge, Safari and Internet Explorer).

I knew floats could cripple page breaks but I wasn’t using any floats so I wasn’t sure why it wasn’t working…

Read more

Make an Accordion with HTML

What: Make a functional accordion with HTML. CSS is optional for styling and no JavaScript is needed. I love simple, I love lightweight, less is more. And in browsers in which it doesn’t work, all the content is still visible, which also improves accessibility.

Read more

Speeding up local install of WordPress in XAMPP

My local installs of WordPress in XAMPP where excruciatingly slow, easily 5 seconds for each page load even with a clean install of WordPress. Local installs are supposed to make development in WordPress easier but 5 second page loads make it harder.  I found solutions for this in several places and I’m linking one that has several of them in one answer on Stack Overflow.

Read more

Spacing in CSS pseudo-element content

A bit of an abstract title but I’m basically taking about:

h4::after {
    content: "";
}

If you have just text in the content property, you can adjust spacing with the letter-spacing and/or word-spacing properties in CSS. Letter-spacing would even work if you have just icons but I had a combination of three icons and a word, and the letter-spacing I wanted between the icons pulled the letters of the word too far apart. You can’t use html in the content property of a pseudo-element like ::before or :: after, so   is out.

What: I found my solution on Stack Overflow, see link below, where someone had given a pretty list of the different spaces in CSS as a solution to a similar problem.

Read more

Load CSS asynchronously

Came across a short and clear article about loading CSS asynchronously to speed up page rendering.

Read more

Animated Poems

Some History

Back in the days when it seemed as if one in five websites was built entirely in Flash, I would use Flash to animate poems I wrote. Inge Raadschelders and I did this together and we called ourselves Blindschelders & Raadsman. When Flash died we gradually stopped making them because there wasn’t an immediately obvious successor to Flash.

Read more

CSS triangles

What: Making triangles using CSS

How: The basic idea is a box with width and height set to zero.
You set the four borders, three of which you make transparent.
Border-width then decides the size of the triangle and giving the different sides different border-widths changes the shape of the triangle.

Read more

Refine edges in Affinity

What: Refine edges > Apply > Done!

Where: in Affinity Photo

A client wanted his name as his logo in a handwritten style. He was thinking of a handwritten font; I asked him to actually write his name for me because if you want personal, it’s often good to be personal. He wrote his name for me on paper, took a photo of it and emailed it to me.

I did all the obvious things: increase contrast, select the light background with the Flood Select Tool, Invert Pixel Selection, copy and paste it to a new layer. So far, so good. It looked smooth.

Read more

+ More