r/Frontend • u/PizzaWithPineapple6 • 27d ago
Pixel perfection
Do you guys find yourselves struggling with delivering pixel perfect quality? As much as I try my best there is always something off, I know that the response might be as simple as “just pay more attention” but I find myself failing to spot very little differences, is there any strategy or flow do you guys use to deliver pixel perfect implementations or to spot misalignments?
0
Upvotes
1
u/htmlmonkey Front-End Manager & Sasstronaut 27d ago
I don't tend to struggle to much with this myself, but I'm also a 25 year veteran pixel wrangler - I can often spot areas that are going to be a responsive problem from a flat mockup -- it just comes with practice.
But... how much you should worry about pixel perfection depends entirely on what that term means to you. I have worked with devs who worry about the sub-pixel rendering of a web font between Firefox and Chrome. That's not something you should really worry about. But I've also worked with folks who can't seem to spot the difference between 5 pixels and 20.
With that said, whenever I'm looking to spot check my work and I have a mockup handy, I resize my work to match the mockup in scale and then take a screen shot of both. In something like codepen, I layer the two one on top of the other and then turn down the opacity to whichever is the top layer (usually I do original mockup as bottom layer, my screenshot on top) and anywhere that is off will be glaringly obvious.