Friend asked me to help with his HTML5 form validation. His back-end work was decent, but whoever did the front-end... Oh boy.

They used media queries for mobile etc, which was fine. Until I saw what the queries did. Instead of resizing the form accordingly, they hide the visible one and make another one visible.

WHY WOULD YOU DO THIS

My boss still thinks that resizing his browser is equivalent to mobile testing, and his designs are desktop only and says "just have everything stack on top of each other"

below is how I feel.

* {
position: absolute;
Z-index: 1;
Top: 0;
Left:0;
}

I just pulled an all-nighter to write an usability testing protocol in Microsoft Word for a medical mobile app.

- statement of consent and privacy declaration; easy: 1 hour
- structuring the protocol and writing the different use cases; easy: 1-2 hours
- layouting the document so the tables don't look like utter shit and adding dotted lines into the columns so the user can write in it without fucking up the whole document when resizing a simple column width; a fucking nightmare: 5 hours

Why is the creation of a nice layout so inefficient to the point where I'd rather design a form in CSS and send it to my printer, get your shit together!

I really hate doing all the tweaks for tablet and mobile on websites. No matter how hard one tries to design for mobile first and make the transitions as seamless as possible, there are always some “fiddly bits” that won’t behave. And so many devices with all their viewport width variations. Also, there’s the matter of people resizing a desktop browser to any width that might not be covered by the breakpoint ranges that specifically. One could write a hundred breakpoints and still not account for it all on some designs. It’s exhausting.

Damn text auto resizing on browsers for mobile devices...