Archived in Web Design and tagged content, flexbox, future, layouts, podcast, process
Are you excited about the future of designing and developing websites? Are you looking forward to working with something like flexbox? Maybe it’s CSS masking, filter effects, or blend modes that you can’t wait to use.
Note: This post includes an audio version. If you don’t see the audio player above, Click here to listen. You can also
I’d like to talk about a few things on the way and how I see them changing the way we do our work. If you were part of the industry when it shifted from table-based layouts to CSS driven layouts (or even the more recent shift to responsive layouts), you might have noticed those who are first to use these new techniques are often able to use them as a competitive edge.
It probably makes sense to start learning some of what’s coming, if you haven’t already started. Since I’ve been talking layouts, let’s start there.
Improved Methods for Layouts
They’re better than what came before, but in all honesty and where layouts are concerned, floats are as much of a hack as tables were. Neither was created with the idea they’d be used for site layouts. Floats are really there to allow text to flow around around other content.
They’ve worked well enough, but they’ve always had problems and some new problems specifically now that we’re working with responsive layouts. Fortunately, new and better things are on the way.
Some of you probably remember an article that appeared on .Net Magazine a few years ago on . The article, now on a new domain, talked about some of what was coming in CSS.
I’ve written about all of these in the past. Check the links directly above if you want the details for how to work with them. Maybe I’ll revisit some to see if and how the spec has changed since I last covered them.
Flexbox is the closest to being ready. It has good support and can be made to work with all the browsers and versions you likely need to work with. It’s a little extra effort for some browsers, but flexbox can work where you need to support it.
I think flexbox is going to replace our current float-based approach to layouts soon, probably within the next year or two. I’m pretty sure the next version of this site will be built with flexbox.
They solve one problem we’re running into with responsive layouts, that of being . With floats, when your layout is a single column, elements will display in the order they appear in the source. Flexbox solves this problem and of course they’re flexible. It’s right there in the name.