I took some time off last week to spend a few days backpacking on the Appalachian Trail in the Great Smoky Mountains. It felt amazing to get out of my office chair and just walk and breathe mountain air for 3 days. The trail was much more difficult than I thought it would be, not because of the mountains, but because of how worn down and rocky it was. If you’re not extremely careful with every step, it’s all too easy to roll an ankle or trip. Still, I really enjoyed the physical challenge and the unique landscape.

I’ve worked on a few sites now that made use of localStorage in javascript. I try not to rely on writing cookies when it comes to site functionality because it increases page weight and it can be a little shady. Cookies are notorious for storing and accessing personal information on more malicious sites. For this reason, many people disable cookie storage. If core functionality of a site relies on localStorage, that means these people will simply not be able to use it, or their experience will be brutally interrupted by an alert. I don’t think a site’s functionality should be the responsibility of the client side.

I actually considered using localStorage on this blog for awhile, in regard to the day/night mode button. Night mode is a great UX element, but it’s a little tricky to keep it consistent throughout a user’s complete visit to a site or app. I could have simply relied on a cookie to store a user’s preference, and carried that data throughout their session.

What I decided to do instead is to set a location.hash value, and run a script based on that value. So if a user clicks the night mode setting, a nightMode function will run that changes the page styles, adds a #night to the URL, and adds the #night to all links on the page. The script can then pick up the #night hash value and run the nightMode function on page load.

It might not be the most elegant solution, but it solves the issue of carrying user preference throughout a session, and it works with bookmarks. I think it’s worth avoiding the downsides of using a cookie.

I’m not able to link directly to the web-based admin dashboard for the PHP/MySQL eCommerce platform I helped build, so I’d like to describe it here in more detail.

My job was to overhaul the UX and capabilities of the outdated admin dashboard. When I started, the only site functions available in the dashboard were creating coupon codes, managing images in a featured products section, and viewing orders. The functionality I added included product listing layout options, product pricing management, and Google Shopping integration.

Along with the new functionality, I had to restructure parts of the platform’s database to be compatible with the some of the new dashboard systems. This also involved re-integrating the system with an external product management service.

I really enjoyed working on this project because it took me out of my WordPress/Drupal comfort-zone. Personal projects are the only opportunities I’ve had to code in PHP outside of a larger CMS, so it was a new experience working in vanilla PHP on a larger scale project. It was also great to work with and learn from some veteran developers.

As a Sass user, I really love the Susy grid framework. It’s ultra-flexible and doesn’t mess with your markup (unlike most grid systems). That said, I can’t wait for the day that I can finally abandon Susy entirely for the new CSS3 Flexbox layouts.

Flexbox is everything I’ve ever wanted in a layout system. It’s so tempting to throw all my cares to the wind and dive straight in. Support is already really strong, but unfortunately it’s completely unavailable in IE9 and below. That represents a little over 5% of browser users. That may not sound like much, but it equates to around 30,000 visitors a year on some sites I’ve worked on.

I can’t wait for the days when we can look back on float-based layouts and laugh…

I’ve been working on an interactive map WordPress plugin on and off since last September. It’s been an awesome learning experience.

What it is:

• A world map graphic rendered on the page using HTML5’s SVG element
• Clickable regions on the map
• An infographic rendered on the page using HTML5’s canvas element

What it does:

When a visitor clicks on a region of the map graphic, the infographic is populated with the data corresponding to the clicked region. It also loads a post on the page with text content about that region. This all happens through one AJAX call, so no page reload necessary!

I’ve had a few interesting iterations of how the map functions. I’ve had it loading a few of the most recent posts from a category associated with the clicked region. I’ve had it loading a single post’s content up to the Read More tag, and then including a button to the full post. For my current needs, I’m just loading up the full content of a single post corresponding to the clicked region.

There’s still a good chunk of work left before I’d call it finished. I’m working on getting as many options integrated into the Admin as possible. Right now I only have the infographic’s data values and post selection available in an admin screen. Eventually I also hope to give users control over how post content is displayed, and how regions are grouped together, but these options will be more of a challenge.

I’m currently using JQVMaps and NewChart.js for the plugin.

A long term goal would be to include all of JQVMap’s API, so users could control what type of map they want. I also haven’t worked toward including all of NewChart.js’ API options yet. It’s as if the more progress I make on this project, the bigger it becomes. But the bigger it gets, the more enthusiasm I have to work on it.

Here’s a link to the current WIP.