User Experience
Website width changes the whole feel of a page. It affects how text sits, how images relate to it and how much space surrounds the content. A layout can look striking on a large monitor and feel awkward on a laptop.
At The Webdesign Girl, I experiment with both fixed-width and fluid layouts because different websites need different things. But for informational sites, I love the structure of a contained, fixed-width look: considered margins, clear sections and text that stays within a comfortable reading area.
That preference comes with an important detail. The layout still needs to adapt to smaller screens.
What Is the Difference Between Fixed-Width and Fluid Layouts?
A traditional fixed-width layout has a set width, regardless of the browser window. On a large screen, it leaves space at the sides. On a screen smaller than that width, it can overflow.
A fluid layout expands and contracts with the available space. Its columns and content areas change size as the browser changes.
A responsive, maximum-width layout combines aspects of both. It grows until it reaches a chosen limit, then stays centred. On smaller screens, it shrinks and its sections can stack.
This third approach is usually what I mean when I describe the fixed-width style I love for informational websites. It gives the desktop design a contained appearance while allowing the mobile version to remain flexible.
Why I Love a Contained Layout for Informational Websites
When someone visits a service website, resource page or blog, they often want an answer. They may be comparing options, checking a process or deciding whether a business understands their needs.
I like giving that information a clear frame. A contained layout lets me bring headings, paragraphs and supporting images into a coherent composition. The surrounding space becomes part of the design.
For me, this can create an editorial feel: intentional, calm and easy to navigate. That is my design judgement, rather than proof that every visitor prefers a narrower website.
There is, however, evidence behind paying attention to text width.
W3C’s explanation of its Visual Presentation accessibility criterion states:
“For people with some reading or vision disabilities, long lines of text can become a significant barrier.”
Its Level AAA criterion includes a mechanism for achieving text widths of no more than 80 characters or glyphs, or 40 for Chinese, Japanese and Korean text. This is accessibility guidance, rather than a universal ideal width for every page. It also does not require a fixed-width website. A fluid page can constrain its text columns too. [1]
My takeaway is to design the reading area deliberately. A wide screen should not automatically produce a paragraph stretching across its entire width.
The Advantages and Drawbacks of Fixed-Width Design
The main attraction is compositional control. Limiting the overall width can make alignment, spacing and relationships between content blocks more predictable on larger screens.
It also creates room around the content. I particularly like that for businesses whose websites explain services, share expertise or tell a brand story. A restrained layout gives me space to establish hierarchy without enlarging every element.
The drawback is rigidity. A genuinely fixed desktop width can cause horizontal scrolling on smaller screens or when visitors zoom in. A very narrow container can also waste useful space, especially when people need to compare information side by side.
And a width limit alone cannot make a page readable. Small type, poor contrast, dense paragraphs and unclear headings will still cause problems.
Where Fluid Layouts Work Well
Fluid layouts make good use of the available screen space. I enjoy exploring them for image-led portfolios, product collections and interfaces where visitors benefit from seeing more items together.
They can give a website a spacious, expansive feel. They also allow the layout to respond continuously as the browser window changes.
Their challenge is maintaining balance. Without sensible limits, text lines can become too long, cards can stretch awkwardly and gaps can feel exaggerated on wide screens. At smaller sizes, columns may become cramped.
Fluid design therefore needs boundaries too: appropriate text widths, flexible images and changes in layout when the content needs them.
What User Experience Research Tells Us
Jakob Nielsen’s 1997 study reported that 79% of its test users scanned new pages, while only 16% read word by word. Those figures describe that particular study; they should not be presented as current percentages for every website. [2]
Later Nielsen Norman Group research continued to find that scanning dominated online reading. Kate Moran’s 2020 review puts it clearly:
“People still primarily scan, rather than read.”
The practical advice includes clear headings, important information placed early and plain language. These findings support organising content for scanning; they do not establish that fixed-width layouts outperform fluid ones. [3]
Moran also explains that earlier guidance favoured liquid layouts over fixed layouts for text, and that responsive design had since made flexibility an established approach. That is a useful reminder that a contained visual style should still accommodate different screens. [3]
Accessibility guidance reinforces that point. W3C’s Level AA Reflow criterion requires ordinary vertically scrolling content to work at a width equivalent to 320 CSS pixels without losing information or functionality or requiring scrolling in two dimensions. Certain content, such as maps and data tables, has exceptions. [4]
Why I Keep Experimenting With Both
I do not want every website I design to have the same proportions. A photography portfolio may benefit from generous image space. An informational site may benefit from a more focused reading area. One website can use both: an expansive banner followed by a contained article or service description.
Experimenting helps me explore which composition suits the content and the brand. I look at how headings wrap, how paragraphs sit beside images and whether the design remains comfortable as the screen narrows.
These design comparisons are useful, but they are not a substitute for observing real visitors. Where possible, user testing can reveal whether people find the information and complete the tasks the website is meant to support.
For informational sites, my preference remains a fixed-width look with responsive behaviour. I love the way it frames the content and gives each section a sense of purpose.
The width is one part of that decision. The real goal is a website that feels distinctive and makes its information easy to find, read and use.