On larger screens, we have more room on all our pages. We’ve dealt with this on the homepage, but we can do better on the other subpages as well. A single blog post page is an important one.
By default, we output a list of all older blog posts below the current article. On mobile we show that below the current article. We can use that as a right column on desktop, conjuring up a bit of a grid. We fiddle with the HTML just a little to make it happen and then move it over to the blog homepage as well.
Hey Chris, fantastic course and very inspiring and practical. I see on the live site that you choose not to use a max-width for paragraphs. Is there a reason why you did this? Ta
Hey Charlie,
I haven’t quite gotten to syncing up perfectly the live site and the site we built in this series. Your nudge has gotten me on the job though, it should soon be done.
As you mentioned that just setting a max-width on the paragraph isn’t the end-all of typography on a site, I thought of an interesting module for Drupal called Style Guide that essentially sets up a page of common HTML elements within your theme so you can see what styles you have applied to each and able to be prepared for anything a site author might use.
Not sure if there’s a WordPress plugin equivalent (or if it even matters), but the concept of having a style guide type of page in a site, especially for client projects, seems like a cool idea.
Why not set the max-width on the entire column instead of just paragraphs etc?
You totally could. I’d make sure you float: right the other column so if it does get capped out the right column still lines up to the right.
It might be nice to see images larger though. Just a design call you could make.