Screenshots & Assets3 min read

My articles were shipping empty frames

Several posts had placeholders where concept diagrams belonged, and posts with no video still rendered a video section. One commit added 17 diagrams and hid the empty video sections. One post still couldn't be fixed the cheap way.

#placeholders#svg#nextjs#frontmatter#content
Left: a post with placeholders and pending links. Right: the same post with diagrams in place and the empty video section gone.
The build never blocked the empty frames. They went away only after the template started hiding empty sections.

The text was done, the figures were not

Several posts on this blog had a slot for a concept diagram. Those slots held placeholders, not real images, and the captions didn't describe anything. They read more like 'a figure will go here.'

The video section had the same problem. Posts with no linked video still rendered it, and where a link should have been, there was pending text.

While writing, the plan was 'fill it in later.' The problem is that later came after deploy. To a reader, the text was finished, but the page had unkept promises scattered through it.

How many 'coming soon' slots are sitting on your deployed site right now?

Why nothing failed

To the build, a placeholder is valid content. The image path exists, the caption is a string, and the pending text is just text. The build passes and the page renders. Nothing breaks, so nothing warns you.

The video section was a template problem. The template drew the section whether or not the video field was empty. No amount of editing the post files would have stopped it from drawing an empty frame.

What would you do? Delete every placeholder and leave the posts without figures, or fill them all in at once?

What one commit did

  • Made 17 SVG diagrams in the site's visual style to replace the placeholders, one folder per post slug.
  • Changed the template to hide the video section entirely when there's no video. When there is one, it shows a ▶ marker and the video title. I added a youtubeTitle frontmatter field for this.
  • Removed the placeholder captions and the pending-link text.

Each post file changed by only a few lines. The template change was a bit bigger. The main idea: the template, not the content, decides that an empty section doesn't get drawn.

The one post with no cheap fix

Only the ffmpeg gotchas post kept its placeholder. That slot needs a real terminal capture, not a concept diagram. A diagram can explain an idea, but it can't prove a command actually ran. Covering the slot with a nice-looking figure would fill it and weaken the post's evidence. The only fix is to run the commands again and capture the screen.

Self-check

  • If you search your deployed pages for placeholder, pending, or coming soon, how many hits do you get?
  • When an optional field (video, link, image) is empty, does your template hide the section, or draw an empty frame?
  • Of the slots you haven't filled, do you know which ones a diagram can fill and which ones need a real capture?

The honest part

I don't know how long the placeholders were live, how many people saw them, or whether they affected time on page or trust. I have no data to check. The new diagrams show concepts, not measured values. The ffmpeg post still has its placeholder. And this commit adds no automated check to stop this from happening again. If I write 'fill it in later' in the next post, nothing will catch it.

Related