Well, I’ve done it again. I’ve redesigned my site/blog.
Actually, I’ve done much more than just redesign: I’ve rebuilt my entire site using Jekyll. WordPress was just overkill for what I needed and Jekyll gives me so much more control over everything about my site.
No more PHP. No more database. Just HTML, CSS and JS.
Mobile First FTW!
My only real goal I had in mind when I started working on this was that I wanted to commit to taking a Mobile First approach to both the design and development.
Basically what that meant for this project was that I fired up Chrome, sized it down to it’s smallest possible width (400px for whatever reason) and started coding/designing right in that browser. Once I had the home page and a blog post to a point where I was happy, I sized the browser up and started adding
min-widthmedia queries to progressively enhance for larger viewports.
And it felt good.
All the break points are completely arbitrary and not set to match any specific device or viewport size.
Six o’clock - TV hour. Duh duh duh duh duh dum dum…
The other big innovation (for me anyway) is that I’m using
remunits for (almost) everything.
This was scary at first but I think it paid off big time. The browser support for
remunits is wide enough now that it’s pretty safe to use them even without a fall back. This means I’m making the conscious decision to not support IE8. I’m perfectly ok with that though.
I originally used
remunits for my media queries, but apparently they don’t work so well in media queries in Firefox (and I assume IE as well)
So I’m using
emunits instead for media queries, which is still really cool because it allows the browser to honor media queries when zooming in the browser.
You can zoom way in and out of this page and see for yourself. Try making your browser really narrow, then zoom out and you should eventually get a “wide screen” layout.
It’s really cool actually. (assuming it works, let me know if you find any bugs)
The move to Jekyll wasn’t completely painless. I didn’t have much success with any of the conversion tools out there, but I only have a handful of blog posts so converting them manually was simple enough.
The majority of my time was spent “redesigning” and by “redesigning” I mean constantly changing colors til I was happy.
I finally made myself commit to where I’m at now and push out an MVP version of my site, which I’m actually pretty happy with. I’ll add new pages/features/functionality as I have time to do so and I’ll let it grow organically over time.
But my goal is to not fully redesign again for a long time. At least a year or two. But I’ll continue to modify and update as I go along.
But wait, there’s more!
So there are some pretty obvious things missing here such as
- A real home page
- Nice code formatting
I’ll get to these things eventually, but for now you’ll just have to live with just a blog.
And in the interest of transparency, my entire blog is available on GitHub for anyone to check out. If you’re thinking of moving to or starting a Jekyll-based blog or site, have a look to see how things are structured.
Well, that’s all I’ve got for now.