Today's reading topics on web forms, ux, and usability

I’ve been exploring topics around web forms, UX, and usability to find ways to create more user-friendly digital experiences. It’s fascinating how small changes labeling, input types, or error messaging can significantly reduce friction and confusion for users. Along with practical form improvements, I’m also looking into broader usability principles that guide how users interact with websites and apps, making sure those interactions feel smooth and intuitive.


Key topics explored today


1. Label placement in web forms

Source: Nielsen Norman Group – Placeholders in Form Fields

Summary: Placeholders should not replace labels. Screen readers often skip placeholders, and users forget them after typing. Labels should be persistent, visible, and placed either above or to the left of the input for maximum readability.

My takeaway: I’ll explore using floating labels sparingly and always ensure labels are programmatically associated with inputs using for and id.



2. Field length affordance

Source: Luke Wroblewski: input field length

Summary: The visible length of a field can communicate the expected input. For example, a short field suggests a short entry like a ZIP code.

My takeaway: Visual affordances help guide users. In tomorrow’s experiment, I’ll mock up a checkout form with this principle applied.



3. Error messaging best practices

Source: Gov.uk Design System – error messages

Summary: Errors should be clear, polite, and point to how to fix the issue. Highlight errors at the top of the form and inline next to the field.

My Takeaway: I’ll revise an old form design with inline validation and use ARIA aria-describedby for accessibility.




Resources discovered



💬 Quote of the day

"Form follows function – that has been misunderstood. Form and function should be one, joined in a spiritual union." — Frank Lloyd Wright