Fluid, responsive layout containing fixed-width content.

Discussion in 'HTML & Website Design' started by xtmx, Jul 29, 2013.

  1. #1
    I own an arcade containing simple DHTML games. I've been reading these forums, and people are saying it's better to have a fluid, responsive layout. However, my site cannot do that the way most people are suggesting, because my games require a minimum width. What is the best way of going about this?
     
    xtmx, Jul 29, 2013 IP
  2. NameNetwork

    NameNetwork Active Member

    Messages:
    249
    Likes Received:
    13
    Best Answers:
    1
    Trophy Points:
    90
    #2
    not really a lot of options as you say, if it were me I'd just make sure it scales down correctly to tablet sizes and maybe there's enough room when a phone it put horizontally ? otherwise when the JS detects the screen down to small phone size just dynamically replace the 'too wide game' with a static graphic explaining the situation
     
    NameNetwork, Jul 29, 2013 IP
  3. ekim941

    ekim941 Member

    Messages:
    74
    Likes Received:
    7
    Best Answers:
    7
    Trophy Points:
    33
    #3
    Fluid and responsive designs are not a rule and, actually, are heavily debated as to when (or if) to use them.
    I would imagine that a gaming site is not going to target mobile users because the bandwidth would not allow mobile users to play arcade games anyway.
    I say, ditch the idea of going with a fluid or responsive design-- it will probably do more harm than good for your particular site.
    Have you bothered to test your site on iPhone, iPad, etc?
     
    ekim941, Jul 29, 2013 IP
  4. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #4
    My question would be what is the minimum width, and what is making them HAVE a minimum width? IF they're something like flash, you should be able to scale to any size. If they're HTML/canvas games, they SHOULD be scaleable too (though a LOT of devs are too lazy to do it properly). Only real hiccup I can think of is Java since it generally blows the proverbial equine in that department.

    The responsive part below that 'minimum width' could be tricky, but fluid/responsive above it, there's no real excuse not to.

    Really, I'd have to see the page in question, but most of the time people THINK there are limits to the size of embedded games, when there aren't.
     
    deathshadow, Jul 29, 2013 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #5
    Wait, do you mean the site in your signature?

    If so, for the most part you might have problems with some of the larger ones, but given the largest I'm seeing is less than 600px wide that's your minimum target. They won't WORK on anything smaller so there's little if any reason to try and go responsive below that.

    Though having a class to say "large game" vs "small game" (since there are some that seem to be under 256px wide) would be a simple trigger for if it can go tablet/phone friendly or not. (again, why CANVAS and FLASH are usually better for making games, they can scale dynamically)

    Quick rewrites of the larger games to scale the render values might be an option as well. 50%, 33%, 25% for example... seem to just be moving IMG tags around so letting the browser resize the IMG's and scaling the coordinates sent for their positions isn't exactly rocket science.

    One big thing I'd suggest is getting a max-width on the site so it's semi-fluid. At larger resolutions your longer paragraphs are hard to follow / find the next line on. Some more padding and taller line-heights wouldn't hurt either.
     
    deathshadow, Jul 29, 2013 IP
  6. xtmx

    xtmx Active Member

    Messages:
    359
    Likes Received:
    12
    Best Answers:
    4
    Trophy Points:
    88
    #6
    I think I will do the fixes in the last two paragraphs of deathshadow's post.​
    @ekim941: 15% of my visitors use ipads.​
     
    xtmx, Jul 29, 2013 IP