I learned to develop for the internet because of WordPress. In the past 6 years, I made over 20 custom WordPress sites for my own projects and for clients. It’s easy to start with small edits on available themes, move to making themes from scratch and later mess with plugins. As my development skills got better, I no longer needed a full blown content management system (CMS) like WordPress to present my own projects online. I bypassed Wordpress to just write vanilla HTML, CSS, and PHP.
Time for A Change
I was ready for something new.
SFPC, where I teach and sit on the steering committee, moved its site to Jekyll. Casey and Zach developed the site, and it was an interesting process to watch. Jekyll is a static site generator. A static site generator is like a CMS in that the content, structure, and style of a site are in separate files. They differ in that the static site generator compiles the website on your local development environment before it’s published to a web host. No need for a server to assemble a page each time it’s requested.
I decided to give it a try. In a weekend, I completely redesigned my site and ported the WordPress content over to Jekyll.
- The Old Site
- The New Site (You're looking at it!)
After sifting through countless blog posts and tutorials, here are the Jekyll resources that I can recommend:
Podcast: The Web Ahead Episode 54
An hour long conversation about where static site generators sit in the evolution of the web, including commentary from the people who build the healthcare.gov site on Jekyll. Start here for context on what static site generators are and what it means to work on a large scale project with one.
Screencast: Static Websites with Jekyll
This is the only substantive screencast I could find on building sites in Jekyll. It’s an hour long and covers all the basics.
The Official Stuff: The Jekyll documentation
Helpful blog post with instruction on migration:
Here’s what I did to move my site:
- Followed instructions in this blog post to export comments to Disqus
- Exported content out of WordPress with the Jekyll Exporter Wordpress Plugin (This produced much better results than doing a standard export from WordPress and using the Jekyll WordPress importer.)
- Downloaded Jekyll and dropped the exported content into a fresh installation of Jekyll.
- Removed legacy WordpPress code, especially blog posts with image styling.
- Coded out the design with the help of Zurb Foundation. I was hoping to use Grunt while developing the site. I’ve used CodeKit and look forward to dropping, a but the version of Foundation that I used doesn’t support it. As I code, two terminal windows run ‘compass watch’ and ‘jekyll serve’. Easy.
- Publish! Any Jekyll site can be hosted with a custom URL for free on GitHub, but I have been deploying most of my repos with Beanstalk, so I just stuck with that workflow. Much like my relationship to WordPress, maybe I’m a good enough developer now to move off of beanstalk and start deploying with Capistrano or some other option that works with GitHub.
My website is way fast. Way, way faster. Others have seen great speed improvements, too.
Editing markdown and serving a Jekyll site is a great compromise between coding out the sites with just HTML, CSS, and PHP and using a CMS like WordPress. I’m enjoying the best of both worlds.
Will I keep using Wordpress? Yes, but specific purposes that suit client needs and encompass more involved functionality. WordPress is a powerful open source project with a lot of history, a knowledgeable community, and tons of resources.
That said, a shift is in play.
Sites that I would have custom designed for clients on WordPress 3 or 4 years ago are being created on hosted services like Squarespace by would-be clients themselves today. Developers who would use WordPress to host their own simple sites because it was the best option are moving to static site generators in droves. How we create, organize, and host content online will soon look nothing like the content management systems that have been evolving over the past decade.
I wrote this blog post at the 2015 <Write/Speak/Code> conference, and amazing organization empowering women software developers to become thought leaders.