Web Design

Side Projects Keep Things Fresh

I've been having fun maintaining my side web design and development "business". It keeps things interesting outside of work since I love making cool things and helping smaller businesses with their online presence. I started hosting client sites earlier this year while I previously used shared plans for side projects and I think it's one of the better decisions I've made. The control of having a VPS that just works without messing with clunky shared plans is liberating.

Sorry, Web Design isn't Dead

I fell for the link bait title. A recent article on UXMag points out why the author thinks web design is dead in 2015.

Check out DigitalOcean for hosting

I've been using Hostmonster for probably 10 years to host my simple personal site and other random projects that come up.  Shared hosting is a convenient thing and is a great solution for people that want a normal website.

Stop Confusing Future Web Developers

Stop for a second.  Have you heard of tools like Jade (an HTML preprocessor) or Stylus (a CSS preprocessor)?

Can we use Flexbox safely yet?

The flex box model, aka Flexbox, will make designing layouts in CSS and HTML a lot easier once it hits mainstream.  How close is it to being widely supported?  It's actually not too bad, with global support at 88.88% as of 3/2/15.  The main issue is with versions of Internet Explorer earlier than 10.  Modern Chrome and Firefox, as well as mobile browsers almost all support Flexbox.  Since this is a new tool that will likely be employed in CSS frameworks of the future, it's useful to know how and why it will happen.  Here are a few good links.

An example of a Bootstrap affixed menu

Twitter's Boostrap framework is great for making affixed menus that stay with you as you scroll down the page.  I recently needed to do this and got it working pretty well.  It's also responsive, so the mobile dropdown menu scrolls with you as well.  This is my favorite navigation design pattern.  I've taken the liberty of making an example that has a fade-in effect so it isn't so jarring when the menu affixes.

Here's the JSFiddle of it in action:

Bootstrap affixed menu with fade-in.

Why hasn't SASS taken off in mainstream web development?

Today I'd like to talk about a point that has bothered me for the past year or so as I've integrated SASS into my typical frontend development pattern for websites.  Why hasn't the preprocessor, a tool that so drastically improves how CSS is written, taken off in the mainstream yet?  Look at the countless "Bootstrap template bundles", ThemeForest, and other sites for examples of what frontend designers are churning out to the masses.  They aren't SASS, or even LESS (most of the time).  With how fast the web moves, I'm fairly shocked at how slow this adopt

Breakpoint Slicer and Bootstrap for SASS, two fine front end tools

As a front end design fan I like to constantly improve my toolsets.  Two of the tools I use on new projects these days include Bootstrap for SASS and Breakpoint Slicer.  Both can be added to your SASS project with a 'require' line in the config.rb file and then @imported into your scss file.

Here's how each helps you:

Thoughts on building email templates

I've been making email templates in one way or another for about three years now.  At Acton Institute, we send out a lot of mailings to engage and inform followeres of our nonprofit.  In fact, sending emails is such a routine task for us that I helped automate our process back in early 2013 with a Newsletter Maker app.  The app's sole purpose is to create WYSIWYG content areas as text fields or text areas in a predefined HTML template.  Since it's coded in Rails, fun things can be done like iterating through header CSS in the template and putting it into t

Using SASS/Compass on Windows & Mac for CSS web design

If you're a CSS fan like I am, you've no doubt heard of CSS preprocessors such as SASS and LESS already. I see LESS mentioned more often outside of the Rails world, which really shouldn't be the case.  I feel like LESS has more overhead in the site/app itself, and is thus slower.