Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other Need help with an aspect of responsive web design

  • This topic is empty.
Viewing 8 posts - 16 through 23 (of 23 total)
  • Author
    Posts
  • #172455
    nixnerd
    Participant

    This may be out of line or not even feasible, but I highly suggest you design the site in such a way that merely resizing/re-positioning elements can be sufficient. Just like Alen said, you should take a “mobile-first” approach with progressive enhancements and structure your CSS to cascade in the same way even.

    That way, you NEVER have to worry about not loading certain sections. Makes it way easier.

    #172456
    shaneisme
    Participant

    You shouldn’t really be thinking of things as “mobile”, “tablet”, etc. as those will start to mean less and less as time goes on.

    All you should be focusing on is getting all the content to look nice on anything. All the content should be there no matter what – there shouldn’t be any “second-class citizens” for instance. People are going to view the content you put up how they want.

    Spending too much time over creating the perfect design on “mobile” or “tablet” or “desktop” is basically going down the wrong path. Is the content easily viewable in order of importance, and is navigation second only to that content? That’s the only question you should be asking on a high level.

    This is all just blabbing though, so really what you should do is review real world examples to see how they’re doing it + start working on your own. Work less on design and more on seeing how things could work by maintaining the same markup.

    Spend some time going through the new CSS Zen Garden for inspiration, not of design, but of mechanics: http://www.csszengarden.com/

    #172457
    nixnerd
    Participant

    @shaneisme I was going to mention this but I didn’t really want to muddy the waters.

    I really prefer the term “fluid-first” or “elastic” but I was just using the term Alen used. I think taking smaller screens into consideration first is prudent… as they’re the lowest common denominator.

    HOWEVER, anything you can make fluid or elastic with percentages or ems… DO IT! If you use this in tandem with max-width, you should be set for most things.

    Media queries are great… but should be used sparingly, as you should have less and less breakpoints for MOST designs when you start thinking fluid.

    #172460
    shaneisme
    Participant

    No you’re absolutely correct. For me things are always fluid, but still follow the rules about reading text so there are limits a la using max-width as you mention.

    Generally speaking I use three media queries, some projects I might add to that for VERY specific special cases. There’s no rule here though, three isn’t a magic number, it just works for how I think. You should have as many media queries as you need to make the content not look funky, that could be zero!

    P.S. – One thing that is a benefit of saying “mobile-first” is knowing that touch will be your primary input. Making touch-friendly websites should bleed all the way up to higher resolutions as well… they’re putting touch on everything these days.

    #172462

    For lack of writing a book in explanation, trust me, I don’t see these as “mobile” breakpoints. I let my content justify my breakpoints, not the envisioned constraints of labels like “tablet”. My naming structure usually goes minimum, medium, moderate, maximum. This has more semantic meaning to the viewport size that labels assuming the user is on a laptop device when in fact they may be on a mobile one. I just don’t want to expound on this for sake of making things too convoluted in the discussion. I tend to derail easily, :)

    Well, I will go forward with what’s been said here and see if I can venture into responsive design successfully. I’m expecting to fail repeatedly, but as long as I’m learning from the experience, I will be moving in the right direction. Success is not final, failure is not fatal; it is but the courage to continue that counts.

    Thanks for the clarification!

    #172463
    shaneisme
    Participant

    Please post any hurdles you can’t wrap your head around, the regulars here do love to help :)

    #172464
    nixnerd
    Participant

    that could be zero!

    True story… in fact, zero would be IDEAL! But… alas, the modern aesthetic rarely allows that. I’ve seen it done though.

    #172466

    Thanks guys. You’ve been phenomenal, I’ll let you know if I end up with a snafu. :D

Viewing 8 posts - 16 through 23 (of 23 total)
  • The forum ‘Other’ is closed to new topics and replies.