Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Are fluid websites worth making anymore? [closed]

People also ask

Why is responsive web design not important?

There are a few cons to responsive design, including: Not every site looks great on every device. You may want to offer different things to different users according to which device they use, and this can be somewhat difficult on responsive websites. You could run into problems with resized advertisements or banner ads.

What is a fluid website?

What is fluid web design? In fluid web design, the widths of page elements are set proportional to the width of the screen or browser window. A fluid website expands or contracts based on the width of the current viewport. Fluid design helps make websites more usable across device types with varying screen dimensions.

What makes a good website in 2020?

Good websites are well organized and follow a structure. They are not cluttered; they are clean and professional. They are also built around a target audience and market. Organization makes a website accessible and user-friendly.


It depends on your audience and your content.

The following are sites I respect and I think are example to imitate.

Fluid Examples:

Amazon

Wikipedia


Static Examples:

Apple

eBay

MSN

StackOverflow

MSDN


Some Mix it Up!

CNN

I think I prefer static most of the time. It is easier to make it look good in more browsers. It is also easier to read.


Making a website fluid, but adding a min/max-width attribute seems to be the best of both worlds, for me. You support fluidity, but you limit it at a certain width (say, 800px and 1200px).

It is up to you - here are some things to consider:

  1. Text is hard(er) to read when lines are very long.
  2. Your audience may have larger or smaller resolutions than normal, and picking an 'incorrect' static width will annoy them.
  3. Maintaining a fluid site can be, but doesn't have to be much more difficult than its static counterpart.

Absolutely. It is a big inconvenience to people with huge monitors to have to resize the page. It can also be a bit dodgy with some layouts. Little inconveniences, no matter how trivial, can actually affect people's opinions of your site.

Also, netbooks have odd resolutions which make it hard to design sites for. For example, I'm writing this at 1024x600.

It's not particularly hard nowadays either (in modern browsers), especially with min- and max-height in CSS, and the new gradients, etc in CSS3, so image scaling won't be as big a problem in the near future.

In response to the comment below, I think that the pros outweigh the cons in this particular case - IE6 is a problem everywhere. We just have to deal with it.


You have to realize most computer users don't even KNOW HOW to zoom in the browser! Most users are so far from the understanding of computers that we have. We always have to remember that fact.


Text based apps: No. Table based apps: Yes.

Pros of fluid layouts

  1. People with big monitors gets to use their screen real estate.
  2. Easier for users with big monitors when you have a lot of information on your page.

Cons of fluid layouts:

  1. A fluid width text column is hard to read if it's too wide. There's a good reason behind the use of columns in newspapers: it makes skipping to the next line much, much easier.
  2. (Somewhat) hard to implement, because of the limitations in CSS.

If you're showing tabular data (iTunes, db manager, ...), fluid width is good. If you're showing text (articles, wiki pages, ...) fluid width is bad.


From my iPhone's perspective, fixed width layout is problematical when using code blocks. The scrollbar for wide code blocks doesn't show up, so I can't read the far right of the block.

Otherwise, I think it's a simple matter of what kind of site you're designing and how it looks on different size screens and windows. As previously mentioned, there's an option to set a maximum width, but the same caveat applies to code blocks and iPhones. I've designed both, and I don't prefer one over the other.

Although, it's fun to watch the boxes move around as I play with the browser size with a fluid layout, but I can be easily amused.


The most important thing is to consider dominant use cases of your web site or application. Do you expect people to use it exclusively on mobile devices? Mobile phones, netbooks, desktops?

Take a look at "Responsive Web Design" by Ethan Marcotte: http://www.alistapart.com/articles/responsive-web-design/

Great article that demonstrates the use of truly fluid layouts using media-queries. Sometimes you need to built out a separate front end for different user-agents, but sometimes media-queries are the perfect tool to service multiple resolutions across different user-agents.