Go read Andy Clarke’s post on needing a standard for showing navigation in mobile. Just go read it.
Needless to say, I agree with his final recommendation.
Tag: Design
Categories
The Web’s Present Future
I was privileged to give a talk at the 2011 Chippewa Valley Code Camp this morning. I titled it The Web’s Present Future: Responsive Web Design, and I think it went alright. The audience was great and I didn’t die. WHOHOO!
I have posted my slides along with some resources as well. You can find them here.
Thanks everyone for coming!
Go ahead and read Our Pointless Pursuit Of Semantic Value by Divya Maninan over at Smashing Magazine. There are some things I agree with, but I’m left with a terrible aftertaste in my mouth by the end.
A lot of the benefit of semantic markup is not seen by the customers, and that’s okay. The customer shouldn’t see all of the crappy hacks we’ve put into our CSS to get it to work in Internet Explorer. They shouldn’t look at the source code to jQuery that we are using to modify the behavior of their browser (I’m looking at you again, IE). So, sure, they don’t need to be pulling up the source of the page either and looking at the seemingly maddening soup of tags that outline the structure of the page they are viewing.
That’s all fine and good.
There are also benefits for computers and other devices to using semantic markup and making things as clear and concise as possible. That’s all fine and dandy.
Sure, it can be a headache to try and keep straight when we are going to be using an article, or an aside, or a section, or a straight div, or … you get the point. That’s a legitimate gripe about the alphabet soup of new tags that have been introduced in HTML5.
However, let’s care a little bit … just a tiny little bit about what we are doing and not look for the easiest way to just push out pages. Let’s care. Let’s care like the original Macintosh team did and not sign the inside of the case even though no one was going to see it, but care enough bout what we are doing to take some time, slow down, and think about what we are actually marking up. Think a little bit. Take a walk maybe and spend some time, yes, maybe 40 minutes, whether the article or aside tag would be the most semantic. Maybe you’ll run into another, more profound thought while you are on that journey.
We spend a lot of time trying to think of the easiest, quickly, dirtiest way to get things done and get them working. Maybe it isn’t so bad to use “semantic value” to help us to slow down and actually think about what we are doing, think about the content a little bit, and do a better job just because it would be just a tiny little bit … better.
I just finished a marathon. Well, it was a marathon for my mind.
Two books have recently been published and they are poised to take the web design community by storm. The first was Adaptive Web Design by Aaron Gustafson and the second Responsive Web Design by Ethan Marcotte. If I was going to recommend just one book, I would push towards Marcotte’s book, but both of them are great and I would recommend each.
I’m not going to go into an exhaustive review of these books, but both of them have found a permanent home next to Jeffrey Zeldman’s Designing With Web Standards, a book I still consider to be the most important book in my very short, very poor career so far. If you care about the web at all, you will read Zeldman’s book before anything else.
Back to my task at hand.
The two books I mentioned at the very beginning usher in a new era of web designer, or perhaps it is the same era, just more refined and more focused. The idea flexibility on the web has always been on a designer’s mind, even if it was how to combat that flexibility.
Now the goal is to take hold of the flexibility of the internet and put the user first and foremost. Using every tool available to craft experiences that allow people to use your website on any device, anywhere, without having to compromise on the content.
The idea of “mobile first” has been going around the web for a little while, but it isn’t a dogmatic ideal to pursue. The idea behind “mobile first” is to provide focus for a design and a litmus test to drive decisions. I’m going to try and burn into my head this thought:
How does this content or feature benefit our mobile users?
That one is straight from Marcotte. It isn’t supposed to limit what you can do, but provide the start of a conversation about what is important for you to be doing. A lot of people will be asking for their “stuff” to go “somewhere”, but the focus of asking that simple questions allows for some objectivity to be put into it.
However, it doesn’t stop there. The “desktop” (read: larger-screened) experience tends to fall into the fallacy of thinking that more space automatically means that it needs to be filled with something … anything! Stop right there and forget about that entire notion.
The focus of starting with the idea of what a “mobile” site might need really just focuses on what every person needs, because you really don’t know if that “mobile” person is sitting on a train on spotty 3G or sitting on their couch with good fiber internet, so you have to make those decisions with everyone in mind.
It tends to come back to focusing on what is important. The question provides focus for decisions.
Responsive and/or adaptive web design using such techniques and tools as progressive enhancement, JavaScript, media queries, CSS3, HTML5, etc. allows for the same markup to be massaged in such a way as to present the content in a manner that is appropriate for varied screen sizes and devices. These are nothing more than tools that can be used in many ways.
The real advancement is in how we are now thinking. The embracing of the flexible nature of the web along with the focus of mobile-first development makes this the best time to design on the web.
But if there’s one thing I’ve learned in observing people on their mobile devices, it’s that they’ll do anything on mobile if they have the need. Write long emails? Check. Manage complex sets of information? Check. And the list goes on. If people want to do it, they’ll do it on mobile -especially when it’s their only or most convenient option. — Luke Wroblewski
I agree with almost everything in that post, but I would make one change.
In order to allow users to do what they need, we have to give them what they need. That means that we don’t hide content from users that is needed just because they have a smaller screen. I’m not good that this and I have a lot of work to do to get better, but that’s the goal. Content should be available to all users regardless of what client they are currently using.
I use my iPhone when I am sitting on the couch at home as much as I do while I am actually on the go. When am I am “mobile” user? The line is blurred because smart phones and tablets are more personal computers than mobile, and far more personal computers than desktops and laptops have ever been.
So exciting.