Maybe you could apply those lessons to this blog entry so I can read it on my phone without a giant blue bar taking over the entire left side of the screen...
Unfortunately, checking out the domcop.com site, I'm afraid you guys have a long way to go in making it "responsive". You've solved a lot of the "technical" HTML and CSS challenges — but the design and UX totally melts down at smaller screen sizes, and on devices that are touch-only (try figuring out what those nine menu icons mean without hover events).
Ultimately, there's a lot more to being "responsive" than basic UI acceptance testing on a range of devices. You have to do proper cross-device user testing to see if people can figure out how to move through your interface fluidly. If they can't, you need to redesign certain aspects of your UI.
There's also a strong argument in many cases for not going responsive at all. If your "phone" and "desktop" use cases don't line up well, you may be looking at a situation where an m. site (what is this, 2003?) is actually more appropriate. That way, you can serve a UI specifically optimized to the tasks your users are likely to be performing on a smaller screen.
tl;dr: "Responsiveness" is a UX problem as much as it is a technical problem. Don't ignore the user-facing side of the equation.
Addendum: regarding point 6, "Learn about how responsive design works before you start" — you're confusing learning responsive design with learning how to use Bootstrap. To actually learn responsive design from scratch, a good place to start is Ethan Marcotte's classic Responsive Web Design: http://www.abookapart.com/products/responsive-web-design
Comments
Maybe you could apply those lessons to this blog entry so I can read it on my phone without a giant blue bar taking over the entire left side of the screen...
Took the words out of my mouth. Credibility of the article has been diminished by that error.
haha. That's embarrassing. That is the default 2014 wordpress theme. Did not think of testing that.
Your culprit is:
.site:before { background-color: #438EB9; content: ""; display: block; height: 100%; min-height: 100%; position: absolute; top: 0; left: 0; width: 182px; z-index: 2; }
I certainly HOPE that isn't part of the default Wordpress theme. I think someone just got a little lazy with their full-height column hacks.
Thank you. Switched to the default twenty wordpress fourteen theme.
Murhpy's law strikes again!
Much better.
Unfortunately, checking out the domcop.com site, I'm afraid you guys have a long way to go in making it "responsive". You've solved a lot of the "technical" HTML and CSS challenges — but the design and UX totally melts down at smaller screen sizes, and on devices that are touch-only (try figuring out what those nine menu icons mean without hover events).
Ultimately, there's a lot more to being "responsive" than basic UI acceptance testing on a range of devices. You have to do proper cross-device user testing to see if people can figure out how to move through your interface fluidly. If they can't, you need to redesign certain aspects of your UI.
There's also a strong argument in many cases for not going responsive at all. If your "phone" and "desktop" use cases don't line up well, you may be looking at a situation where an m. site (what is this, 2003?) is actually more appropriate. That way, you can serve a UI specifically optimized to the tasks your users are likely to be performing on a smaller screen.
tl;dr: "Responsiveness" is a UX problem as much as it is a technical problem. Don't ignore the user-facing side of the equation.
Addendum: regarding point 6, "Learn about how responsive design works before you start" — you're confusing learning responsive design with learning how to use Bootstrap. To actually learn responsive design from scratch, a good place to start is Ethan Marcotte's classic Responsive Web Design: http://www.abookapart.com/products/responsive-web-design
Hmm. What you say makes a lot of sense.
Thanks for the link to the book. It looks pretty interesting.