Today, I am leaving Wordpress behind (at least for now). Wordpress is a fantastic tool for the masses. Lots of great plugins and a wide range of themes make it a turn key solution for a lot of designers & developers. (toc:1)
My Wordpress History
Let's backtrack and look at some of the reasons I used Wordpress:
Lots of documentation/support
As a designer, I could design my own theme, but my time is limited (I'm a new dad!) and the complexity of what I wanted to build would require more time/effort than I could give. Why design and build a theme when you can find a really great one for $45? Admittedly, themes are hit and miss. Theme documentation is key and I was able to narrow down my choices based on that. If the author doesn't take the time to explain how the theme works, then theme is more than likely substandard.
The amount of available and outstanding plugins is astounding. Do a quick search and you can find a plugin for anything you may need/want. Really impressive.
Documentation for Wordpress itself is also top notch. There are lots of forums and blog posts on the interwebs that cover anything you may want to do with the platform.
The ability to create a custom form via custom fields is really handy and helps when you want a full fledged CMS that works for more than just a blog. While acknowledging all of this, Wordpress has felt like overkill for my everyday use. I love Wordpress and what it can do, but I've decided I want to experiment and try something new.
Time for a Change
After mulling the idea of a change, I reevaluated where I was going with my career and what I wanted to talk about. For the better part of the last 6 years, I have been splitting my time between design and development. My passion lies in making user experiences. Whether it be a website or an app, digital media can do some really amazing things. I really enjoy looking at a new app or website and taking in the experience. It has become a hobby of sorts, so why not write about it? My goal is to critique the experience in a professional manner. Having been on the development and design sides of an app & website project, I know the hurdles designers & developers face. Decisions are often made at an executive level and often there is an internal reason for making decisions, these can range from meeting share goals or making internal stakeholders happy. I will take all of that into account as my goal is to review the overall experience, not the designer's or developer's capability.
With the reinvention of my web presence, I decided I wanted to focus on 3 facets: Code, Aesthetic and Content Quality.
I say code, but I am really talking about performance, bloat and debt. After extensive sessions of settings tinkering and the selection of a lightweight theme, the average time to download a page on my Wordpress install was between 3.5 & 5.5 seconds and on average contained 68 requests (cleared cache, wifi connection and 32mbps). In the grand scheme of things 3.5 seconds to load a webpage is pretty decent, especially when you compare it to other Wordpress sites with graphic heavy themes. The speed would increase as the user visited more pages due to caching, so after the initial visit page load times would decrease to 2.5 seconds. Overall, speed wasn't my biggest gripe when it came to the code, though I have seen a lot of Wordpress sites spiral out of control when it came to mobile performance.
What I didn't like was the amount of internal requests (23) for superfluous/underutilized/never utilized features. If some of those scripts were disabled or blocked the theme would fall apart and the site would be rendered unusable. My experiences with Wordpress included times where I would comment out a piece of unwanted code and save it *just in case*. Well, just in case **never happened**. That is where the code bloat and debt comes in. Why load or even bother stripping out code that I did not want to use if I could avoid it altogether? The worst part about that is if alter your theme -- upgrading is a nightmare. Keeping the changes you made while getting the improvements the author added is so time consuming, I would recommend against doing the update.
A lot of themes come with Bootstrap, a fantastic front-end framework. If the theme creator focuses on including the bits that are necessary, users rarely have any issues. In my experience, they install the full suite of code which comes in around 400kb, which in itself isn't the problem. I usually see problems with selector names and using extend. Another issue with Bootstrap is that you are stuck using their naming conventions `(Ex: .col-xs-4)`, which you can override with custom selectors, known as mixins, but that leads to more code bloat. The problem gets worse when you want a column to behave differently based on the device screen size `(Ex: .col-xs-4 .col-lg-2)`. All of these issues can be avoided if you forgo a theme using Bootstrap, but those are becoming increasingly rare.
In previous iterations of my website, I was really into the aesthetic around my work. I guess you could say, I was more concerned with the presentation of the website more so than the content. Wordpress has a lot of bells and whistles which can lead a designer down a dangerous path, one that results in slow mobile performance. In this new iteration, I've decided I want to have a cleaner look. This means less decorative elements, less color and a tighter focus on the content. I am sure over time this will change, but for now, stark it is.
In the past, my content has been lacking in frequency & quality. My new goal is to do a case-study once every couple of weeks (to start). In some cases, I will be working on some experimental websites which I will post about. I have a list of website ideas that I have wanted to build, homages to things like video games, music, pop culture and athletes, that I will finally be tackling when I can (after Daddy Duties). In addition to more frequent, I hope that my writing improves. Coding all day leads to a lack of proper grammar and punctuation!
While researching for a new platform that covered my needs, I stumbled upon Kirby CMS. It is a file based CMS that requires little setup (no database). I stumbled upon Kirby a few years ago, but I was turned off by how simple it was. (Silly, I know.) Ironic how the one thing that turned me off about it, is what brought me back to it. Kirby uses a special flavor of Markdown, called kirbytext, for text editing which makes it easy to read and use. The admin panels are really light and give you only what you need. You can also create reusable snippets and page templates for specific page types. In a lot of ways, it is Wordpress "lite", which is exactly what I was looking for.
I will document page timings and network calls in more detail once I more content up. At this point there are only 2 scripts both of which are external for Google Analytics and Fonts. Page sizes are currently hovering around 72kb. This site will be a work in progress from now on!
Latest research I could find shows that less than 2% of users have JS disabled: Source
I am guilty of abusing extend! Extend is awesome, but it increases the number of selectors and causes issues with any that are nested inside of @media queries. Basically, you need extend selectors in each media query that the extended style exists in.
Have you tried to load a one-page Wordpress parallax site on a mobile device through a 3G connection? Ouch.
Yes, I am completely aware of mixins, but again, they can get out of hand.