A Single Article

Read it, comment, and share it with your friends

Fluid designs are all the rage nowadays

Posted March 7 in Design.

I chuckle every time I read this:

Fluid designs seem to be all the rage now with a lot of web designers. Personally, I don’t care for them at all, but I definitely can see how they could be useful for certain projects.

I found this quote because the initial text “fluid designs” linked to Liquid Designs. The quote came from Caution: Fluid Designs vs. Adsense, a post at adClustr.

The entry goes on to say that designers should avoid fluid-width layouts because they do not work well with Google Adsense, and you can be (gasp!) at risk of violating the Adsense Terms and Conditions if, at low viewport widths, the content of your site covers the ads.

Chuckle, chuckle, chuckle.

First of all, it is a mistake on Google’s part that Adsense blocks have fixed dimensions. Ads should be more flexible; after all, they are a textual section of content on webpages. Second, I can’t think of any fluid-layout designers dumb enough to not effectively integrate these fixed-size Adsense blocks in their designs. It’s really not that hard to put fixed content in a fluid page; I do it all the time. But to be fair, I think the adClustr writer has a good point, and he mentions using min-width to ensure that site content doesn’t overlap Adsense ads at low widths.

Well, obviously.

I still find that first quote funny though… even a year ago, people were saying that fluid design was dead, and now you actually have people reconsidering it, especially when they look at Liquid Designs… I like to think that I actually played a part in making fluid design more popular! It gives me a good feeling just to say it… fluid designs are all the rage nowadays.

Chuckles!


Get a Trackback link

1 Trackbacks/Pingbacks

Other blogs referencing this article
  1. Pingback: DIARY OF A WEBSITE :: DESIGN BY CAFFEINE » Blog Archive » Design roundup: 11th March on October 6, 2007

6 Comments

Responses to my article
  1. Johan March 8, 2007

    Can you not change AdSense dimensions with changing the
    google_ad_width = 728;
    google_ad_height = 90;

    to

    google_ad_width = 0;
    google_ad_height = 0;

    And change the width and height dimensions with JS and CSS??

  2. Johan March 8, 2007

    You could address the object El through the DOM and change the dimensions with CSS??

  3. Jem March 8, 2007

    Of course, the alternative would be to NOT add adverts to your website. Am I just being too logical? :p

    And your discussion of liquid/fluid layouts brings me to another point — I’ve been doing them for AGES, why am I not in Liquid Designs yet? ;)

  4. adClustr March 8, 2007

    Haha, it’s definitely a funny sounding paragraph but the reality is that if you are designing fluid layouts, you need to be careful in regards to Adsense or YPN - it’s not ideal, I know that, but it I’ve been seeing it more and more often lately.

    @Johan - you can’t change the Adsense code - it’s against the TOS and it’s a shoddy workaround for the real problem.

    @Jem - Too many sites have adverts on them - totally agreed.

  5. Jermayn Parker March 8, 2007

    I think it is still half, half with fluid and fixed layouts. I myself have just for the first time created my germworks website with a fluid style, before that it was a fixed. I know my website isn’t anything to go by but I would not say that liquids are the rage.

    They still have a lot to improve on (no IE hacks for one) before they become all the rage….

  6. Christian Montoya March 8, 2007

    Johan: Yep, not allowed.

    Jem: Good question! Maybe that needs to change…

    adClustr: I just found it funny that you said fluid designs are “all the rage.” It is so very much the opposite… they are very unpopular among designers.

    Jermayn: Actually, I don’t have much trouble serving my liquid sites to IE 6 and below. I just make them fixed for those browsers (or 100% liquid) and all the newer browsers get the min/max width combo.

Leave a comment

Share your thoughts with the world

You can use Markdown, or you can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

Please keep comments respectful and on topic.

This form is guarded by Akismet, so don't waste your time trying to submit spam. It won't work. Ever.





Stay on top of new updates at this site: Subscribe to the Feed!