Hacker News new | past | comments | ask | show | jobs | submit login

It's easy to say stuff like this, but go try and implement it. It's really hard.



Yeah, it's not really "easy to say stuff like this" because everyone who thinks they know better than actual real honest-to-goodness web designers will instantly want to argue with you to the bitter end why their fantasy web design has to be 100% "pixel perfect" layout exactly as they envision it on every single device or browser ever invented. It's a huge part of why I'm no longer a web designer. More of my time was wasted fixing literal one pixel differences in layout between browsers (and browser versions) than almost any other part of the process.


There is pixel-perfection and 'pixel-perfection'. One is a pointless fight against the nature of the medium while the other is love for the craft, sophistication, and actually giving a fuck that something isn't needlessly 2 pixels off of where it should have been. A certain attitude that will show its mark throughout the UI.


I haven't encountered a "pixel perfect" designer for at least 15 years now, if not more. Virtually every single UX designer I've worked with provides flexible designs that scale with screen size.


In my side of the agency world there are a lot of designers who design UX that aren't UX designers. A lot of them want started in print and expect pixel perfect designs/don't understand the need for breakpoints. We had a client who got on our case about a design being a half a pixel off. That sounds like a joke but it genuinely happened.


They said the people who claim to know more than actual designers will want it pixel perfect. So i.e. The designer knows pixel perfect is a fallacy, the client doesn't care and wants a pixel perfect match of their figma document on their personal laptop screen.


Solution: make that only for that specific viewport, ignore it for the rest. Hard unreasonable clients are not so common as people depict them to be, at least in my experience. I do have a spidey sense after years of client work in sorting them out right away, maybe, but even stupid clients are reasonable if you’re able to make business points about their requests


I have worked with one of those freaks last year. She argued that every block had to be exactly like it was on Figma, and she once sent me a screenshot with a little ruler drawn on it, to show me a 3px gap. It was such a waste of time and energy...


How _do_ you get a 3px gap though?


Good. I've finally gotten over my nightmares where I'm chopping photoshop designs and literally using <img src=""> to add a rounded edge on a <td>


This is the most awesome approach for rounded corners: https://ridiculousfish.com/blog/posts/roundy.html


Oh wow, it's even worse than I imagined


Funny that it is slightly broken on Safari Mobile[1]

Zoom in on the [Touché!] button and there are artifacts between the rows that make up the corners.

  [1] iPhone OS 16_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.6 Mobile/15E148 Safari/604.1


I'm not UX person and I don't know whether "pixel perfect" and absolute positioning requirement come from clients or designers on average. I'd guess it varies by organization, industry and whatever.

But it's worth being clear that mixing such thing with flowing text and graphic is where things get hard. Html 1 had flowing text in the 90s and you can still do that.

Moreover, all this is related to overall user hostile designs. Organizations broadly don't want their pages to be neutral streams of information but want to control a user experience that nudges people this way and that and fixed are important to that.


If we had an API for web data then accessibility would've been a solved problem. The user's client would decide the best presentation of information.


But ... we did, and do. It's called HTML. It allows you to send back structured data in a client-agnostic way. It's just that it got bastardized to the point that people will send the data in a way that only certain clients can intelligibly render it, and then, only in a way usable to people without certain disabilities.

It's not just a technical problem, but the social problem of how you get people to keep using that API, and not extending it, and not breaking it in favor of some different purpose (like ads)

Whatever API for web data you propose, I can tell you exactly what will happen to it:

1) Initial clients are geek-designed and geek-friendly, and render the data intelligently.

2) This API gets popular for not having all the cruft.

3) Some genius discovers they could add some cutesy visuals and effects if only the standard were extended, and targets the clients that handle these extensions.

4) Eventually, only those clients are cared about, and you can only make sense of the data with those clients and if you don't have disabilities.

If you want to make progress, figure out how to eliminate that dynamic.

Earlier threads on this point:

https://news.ycombinator.com/item?id=30727026

https://news.ycombinator.com/item?id=20224961


That’s too deep on the generic/specific trade off to be legitimately useful


"It needs to look exactly like this PSD file I made!"

You get the same with some native UI designers. They kick and scream until you've got some custom widget that precisely apes the Photoshop layer effects. Then kick and scream again when they make changes that take non-zero time to rebuild with that custom widget.


Honestly, this is not a technical issue but rather a communication and “positive non-narcissistic persuasion” one. I think I’m a meh to ok designer and an ok frontend webdev, but my strongest selling point is communication, with clients praising that aspect of my work more often than I would have ever expected. Designers might care about pixel perfection, but their bosses rarely do. If you have engaging, respectful, data-driven, and business-oriented points to make and you communicate them clearly and effectively, you’ll be surprised how many times you can change someone’s mind. Even designers’ minds, because they don’t live in a vacuum and they know that shipping is relevant to their own interests. Tl;dr invest in effective communication skills as much as you would invest in more technical knowledge.


But that is the job. The job of developing on the web is developing for a platform where you do not know the size or format of the display or what the inputs are in advance.

The job of a UX designer on the web is to consider this kind of stuff and to build a design that's very reactive to evolving displays within the demographics and market segments that the client wants to support. If that's not happening, if the CSS people are just getting handed static designs and being told to figure it out -- the problem is not CSS or the developers, it's that the designers building those designs are not good at their jobs. And there are ways to make this easier: notably UX designers involving the CSS department in the design phase, and/or making a point to always lay out the contents of the page without styling in a hierarchical way before making decisions about how to present that content.

But a lot of programming is hard. It's hard for me to write maintainable Javascript that doesn't fall apart if a project goes over 100,000 lines of code. It's hard to document methods. It's hard for me to write code that does complicated things that can work on low-end machines. These are skills that programmers get better at over time with practice. Responsive design is the same; it's just another skill to learn.

Imagine trying to shoot a movie and having the cinematographer tell you that it's hard to frame everyone in the shot since they don't know exactly where the viewer will be looking, or the sound mixer telling you it's hard to balance dialog and sound effects so everyone is audible without it being noticeable that they're muting background audio. Or a recorder telling you that it's hard to master a pop song given that everyone has different speakers and sound profiles on their headphones. Imagine you're building a car and the designer tells you that it's hard to make sure the controls can be reached by people who are different heights and weights.

On one hand, yes it is; all of that stuff is very hard. On the other hand, yes, that is also the reason web UX designers and developers get paid money; because the job is hard and requires training and expertise, and designing a website interface requires more thought and intentionality and planning than is required to make a PDF.


> It's easy to say stuff like this, but go try and implement it. It's really hard.

Here you go:

main { display: flex; flex-direction: row; flex-wrap: wrap; }

..and set reasonable width/margin constraints on your primary content blocks.

Linear, scrollable flow on small/vertical displays, and a denser "grid" on large/horizontal displays.


http://bettermotherfuckingwebsite.com/

It's literally 120 characters to make a website that flows on any (reasonable) screensize and adapts perfectly.

Modern webdev is just throwing frameworks at self-caused problems.

(I'm exagerrating of course. But most websites are just about showing text, maybe with some images every now and then (news sites, reddit, hackernews, google, come to mind). For those websites this is certainly true).


> flows on any (reasonable) screensize and adapts perfectly.

No it doesn't. It's this pointlessly narrow column in the middle of my screen surrounded by arces of whitespace. If I wanted narrow text I'd make my browser narrow. Looks like the result of some designer fucking around.


Yeah rendering just text isn’t hard. Making a UI for a web app is


It's not that hard. Especially for the modern-ish web (aka of the past 6-7 years). And especially not for the 99.9999999% of the web sites out there.


Some designers can use Figma's equivalent of grid and flexbox and some can't. What's hard is implementing all the shades of gray between two pixel-perfect designs because the designer didn't do this basic work.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: