11 {{ upvoteCount | shortNum }}
11 {{ upvoteCount | shortNum }}

How do they do this?

by Quentin
9 replies
  • WEB DESIGN
    • |
Brisbane

It seems the perfect option for a mobile website as it will always fit being 100% of the screen.

Can someone tell me how they did it.

Quentin
  • Profile picture of the author Istvan Horvath
    How do they do what?

    As you noticed, usually, they have a 'fluid' design - the width being defined in percents rather than px or em.

    So, you have this fluid width that would fill any screen (small or big). Next (and I looked only at the first row of pictures) they have nice images like this one:
    http://myanswers.mobi/images/1034/library_100.png
    All the images have a class that will make their width 25% of the element where they are placed in. (Check the stylesheet in the head) - so no matter how big or small is the screen you are displaying this site, there will only be 4 pictures in a row (4x25%).

    In most browsers, if you define the width of a pic, the height will change proportionally, too.

    Actually, on my big, wide creen desktop monitor looks awful... the images are huuuuge and blurry
    Signature

    {{ DiscussionBoard.errors[3182032].message }}
  • Profile picture of the author pmrc
    Yep big and blurry, Just like Istvan said, they are defined as percentages instead of pixel width.

    If you are going to do something like this, you need high quality images other wise it looks like crap.
    Signature
    Make Money With Traffic Exchanges
    {{ DiscussionBoard.errors[3184231].message }}
  • Profile picture of the author iAmNameLess
    or set up an identifier that will allow for a regular site, then mobile version.
    Signature
    {{ DiscussionBoard.errors[3184272].message }}
  • Profile picture of the author Quentin
    The ideas is that it will be delivered on a mobile so if you drag your screen down you will see it comes into focus.

    I just thought this is the perfect way to develop a mobile site as it will fit in all sizes.

    Q
    Signature
    {{ DiscussionBoard.errors[3184300].message }}
    • Profile picture of the author Moxil
      Originally Posted by Quentin View Post

      The ideas is that it will be delivered on a mobile so if you drag your screen down you will see it comes into focus.

      I just thought this is the perfect way to develop a mobile site as it will fit in all sizes.

      Q
      It's ok for smartphones, but on an iPad, Galaxy, etc. it'll look awful.
      {{ DiscussionBoard.errors[3281706].message }}
  • Profile picture of the author Quentin
    Thats true so in the redirection script you always make it so it only detects screens under 600 pixels.

    http://iphonetester.com/?url=http://...e.com/mobile/#

    Quentin
    Signature
    {{ DiscussionBoard.errors[3283857].message }}
    • Profile picture of the author Moxil
      Originally Posted by Quentin View Post

      Thats true so in the redirection script you always make it so it only detects screens under 600 pixels.

      http://iphonetester.com/?url=http://...e.com/mobile/#

      Quentin
      So you mean, completely ignore the iPad and other tablets? It's not a good idea to display a site the same way you display it on a smartphone, and it's also not a good idea to leave it out and not optimize for it. I've seen some very cool stuff done for the iPad. It shouldn't be ignored in my opinion.
      {{ DiscussionBoard.errors[3285368].message }}
  • Profile picture of the author Quentin
    Hi I agree however we are just concentrating on mobile phones.

    When I look at most websites on my ipad they look fine so I was not looking to make a separate site for them. I had a look on a samsung tablet the other day and they also looked ok.

    Quentin
    Signature
    {{ DiscussionBoard.errors[3285682].message }}
    • Profile picture of the author Moxil
      Originally Posted by Quentin View Post

      Hi I agree however we are just concentrating on mobile phones.

      When I look at most websites on my ipad they look fine so I was not looking to make a separate site for them. I had a look on a samsung tablet the other day and they also looked ok.

      Quentin
      This is what used to be said about the iPhone when it first came out...
      {{ DiscussionBoard.errors[3300095].message }}

Trending Topics