new design

Since I don’t feel very interesting, and nothing has really happened during this foggy 2020, I might as well do a writeup on my latest blog redesign. Navel gazey, but I don’t know- I finally did something.

I did exactly what you shouldn’t do, I took an inspirational color palette and just plopped it in, in a paint-by-numbers sort of way.

I’m still sort of happy and proud of it. It’s better on mobile- I finally figured out where and how to slot in

overflow-x: scroll;

to keep the width of the blog from getting all weird at phone widths.

The logo thing still kind of looks terrible and poorly aligned. I should do something else.

The HTML is more semantic than ever-

 <body>
  <header>
   a blog archive
  </header>
  <nav id="menu">
   ...
  </nav>
  <main id="blogroll">
   <article class="blogpost">

I should get rid of all of the heritage ids now, too- I’m not using them, I’m using semantic html tags. Remember back in 2005 when semantic HTML was big, but we were tag poor, and were always reluctantly standing up little <div> forests? Me too. That really sucked. Now HTML has been all filled out with good, useful tags and no one cares any more.

CSS is pretty great now too. Like, I have variables-

:root {
    --light-blue: #7cbdc9;
    --khaki: #d0d0b8;
    --olive: #afbaa3;
    --emerald: #40817a;
    --cyan: #40817a;
    --text: #1e1e1e;
}

and I can get my layout with CSS Grid and it’s trivial-

        grid-template-areas:
        "header header"
        "nav main"
        "footer footer";
        grid-template-columns: 70px auto;

Remember when this was like, an impossible dream that never worked quite right? Remember the holy grail? I remember. And look at this! I can just sketch it out in blocks of text now. 5 lines of code and it works everywhere.

What a wonderful, delightful time for the web.