Thirty Rows Means Every Pixel of Padding Is Multiplied by Thirty

The social links list runs to about thirty rows, stacked two to a line. Each row used to be an icon, a text field and a switch laid out side by side, each with its own padding and its own spacing.

That layout is perfectly reasonable once. It is expensive thirty times, because every pixel of chrome around each control gets multiplied by thirty, and the page turns into a long scroll of mostly empty space.

What the row is now

One field per row, with everything else sitting on top of it rather than beside it. The field's own padding carves out space at each end for the overlays. The platform icon sits at the top left in a circular mask. The right-hand slot holds the featured switch, or the drag handle once sorting is switched on.

Those last two share a slot deliberately. You never want both at the same moment: either you are editing links or you are reordering them. Stacking them side by side would have pushed the row wide again and undone the point of the exercise.

Row spacing came down from 32 pixels to 16. The controls are the same controls, they are just not surrounded by so much nothing.

The filter, and a small lesson in matching things

The category filter was a select field stretched to match the height of the buttons next to it. That did precisely the opposite of what was intended: the buttons grew to meet the select's height rather than the select shrinking to meet theirs, and the corner rounding still did not match.

It is a button that opens a menu now. Which means it is the same component as the control beside it, and shares its height and its corner radius by construction rather than by two numbers being kept in agreement by hand. Matching something by making it the same thing beats matching it by measurement, every time.

Two smaller things

The icons on this page are drawn from the artwork set you have chosen, so what you see while editing is what your site shows.

Featured now has a tooltip, which it badly needed. That switch was doing a lot of unexplained work: it is what decides whether a link appears on your website at all, and there was nothing on the page saying so. A link can be saved, correct, and completely invisible to visitors, which is a confusing state to be in with no explanation available.

And the skills field is allowed to shrink rather than being cut off at the edge of its container.

While you are on that page

Check what is actually switched on. The most common problem with a links list is not that it is too short, it is that it contains a profile you abandoned in 2019 and forgot was public. Every link on your site is an invitation to leave it, so each one should be somewhere you would be happy for a casting director to land.

Related: contact details in one place, external links in your menu, and drag to sort. On what belongs there, getting all your social media together and building your brand online.

Create a free actor website.


Tomasz Mieczkowski

About Tomasz Mieczkowski

Tomasz Mieczkowski is the co-founder of IADB.com and all of the related websites for film and tv industry professionals.

Connect with Tomasz: