Changelog

Changed

Fonts

Times up for Space Mono.

As much as it’s a great font, I wasn’t happy using it for long-form course content. A sans-serif on the other hand feels like a solid choice.

New feature

System defaults now used for headings and body copy.

I’ve introduced Menlo as a secondary font, with monospaced system defaults as fallbacks. Currently Menlo is used for navigation links, badges, code and the footer.

Removing Space Mono also makes the site a little more resilient, as the browsers no longer needs to fetch any font files.

See more of what’s coming in Figma.

Changed

Callout design

A couple of small adjustments to the callout and the curriculum section.

Bug fixes & improvements

  • Callout now uses dotted outline rather than a background colour, so it doesn’t clash with the sign up form. This was more of an issue for the single column layout, as seen on smaller displays
  • Dropped the word “The” from “The Curriculum”, feels cleaner
AddedChangedFixed

Curriculum and sticky sign up form

Homepage now includes a course curriculum, well part of one at least. More to come soon. Lot’s of other smaller bits too.

New features

  • Currculum added to homepage
  • Scroll margin added to id’s for elements that can be targeted, a nice little trick I leart from Andy Bell
  • Menu added to sitehead

Changes

  • Site logo in sitehead moved to left and site title hidden for all but screen readers
  • Sign up form now sticky on larger devices and includes first name input, also removed button down link

Bug fixes & improvements

  • Callout now takes an optional icon, also added missing box shadow
  • Replaced missing paragraph spacing on generic single pages, like thanks, etc
AddedFixed

Links, skip link and `text-size-adjust`

New feature

  • Added a skip link to improve accessibility, so you can now jump straight to main content using keyboard tabbing, etc
  • Improved link legibility by adding a hover effect

Bug fixes & improvements

  • Added text-size-adjust to reset to prevent inflated text on mobile landscape orientation. Props to Kilian for help with this one
  • Updated changelog permalink structure to include year, month and day
AddedChanged

CO2 emissions score and layout improvements

Lots of layout updates and environmental impact of a web page now calculated and displayed in the footer.

New features

  • CO2 emmisions page score, based on data from Beacon
  • New utility classes for grid, margin, padding and border
  • Added Badge component

Bug fixes & improvements

  • Homepage layout now 2 column on desktop
  • Improved heading sizes and spacing
  • Footer now feels more like a footer
  • Inline code now highlighted
  • Added missing ::selection style
  • Changelog layout now utility classes
AddedFixed

Menu, footer & spacing utility

New feature

Bug fixes & improvements

  • Footer now stacks and menu no longer hard coded into footer partial
  • Flow utility now spacing content in single log items
Added

SCSS Support and Critical CSS

New features

  • Added SCSS support with Hugo pipes
  • Moved CSS to SASS partials
  • Inlined critical CSS in <head>
  • Added breakpoint mixin for easier media queries

Bug fixes & improvements

  • Updated Twitter card with new tagline
  • Improved typography and added size scale
  • Updated color palette
Added

404 Page

Added missing 404 page.

Fixed

Fonts and footer layout

Bug fixes & improvements

  • Footer now stacks on smaller devices
  • Added missing base URL to font paths
  • Changelog entries now using <article>

What’s all this about? See Keeping a changelog to find out more.