0

I am creating a website, my real worry is to maintain the layout applicable for both mobile and desktop users. Responsive design is very popular and there are tons of template available on internet but the problem with all of them is that they change their layout as soon as I squeeze the browser. I understand this is the nature of responsive design but this is kind of annoying and I don't want user to play with my site by expanding and minimizing it (at least I do that when I see a responsive site). Now, my question is:

  • Isn't there is a way to make responsive design based on device? so that it will remain same even when user squeeze browser on desktop but change when user open it on any handheld device.

  • Or do I have to have different CSS for each device/browser?

    I am sorry for my bad english and less knowledge about css. Let me know if I am not clear with my question.

Improve this question
7
  • 4
    You want a responsive design that isn't responsive? (An old-fashioned user-agent detection separate mobile website?) Also, why don't you want users playing with the browser size (assuming real users actually do that sort of thing - which I doubt; it's probably something only people in web design do). Either way, if it's technical / CSS advice you're after we're not really the site for that. We can tell you if you should do something like this or not, but not how to do it.
    – JonW ♦
    Feb 21, 2014 at 14:36
  • bradfrostweb.com/blog/post/…
    – cimmanon
    Feb 21, 2014 at 14:55
  • @JonW I completely agree with your comment and it does make a sense. I, personally, little awkward when I see mobile version of a website on my desktop. I ain't sure how giants websites manage responsiveness or do they have a separate mobile site to handle handheld devices.
    – Zerotoinfinity
    Feb 21, 2014 at 15:08
  • 1
    My concern is why you feel that it is 'annoying' if the user plays with their browser. What benefit is it to you / them if you prevent them doing that? I don't see why you'd want to. Who is it 'annoying' to?
    – JonW ♦
    Feb 21, 2014 at 15:16
  • ahh.. I may be wrong here but I personally feel that changing design by squeezing browser is something like I am playing an animation on my website. It somewhere,may distract my users and decrease the seriousness towards the content of my website. I would really like to hear from you because there might be chances that my assumptions are wrong
    – Zerotoinfinity
    Feb 21, 2014 at 15:23

1 Answer 1

Reset to default
1

I agree with JonW - you're essentially asking for a responsive website that doesn't respond. Equally, providing technical advice is not what this type of forum is for.

The ideology behind a responsive website is that it optimises content applicable to the users resolution and prioritises it accordingly. One thing I would question if I were you is, not whether the user will drag their browser in/out and it being "annoying", but what about all the other resolutions that aren't mobile? tries to find answer But literally there are hundreds of different resolutions, restricting yourself to just screen size or device size does not give your project longevity.

LukeW also mentioned: It’s not that adapting to screen size doesn’t matter, as I pointed out numerous times, it really does. But if you put too much stock in screen size or don’t consider other factors, you may end up with incomplete or frankly inappropriate solutions. How people interact with the Web across screens continues to evolve rapidly and our multi-device design methods need to be robust enough to evolve alongside.

Kevin Pei answered a similar question here where he mentioned different "breakpoints" which might help answer your question a bit more: https://stackoverflow.com/questions/19192443/how-many-different-resolutions-orientations-should-a-responsive-website-cater-fo

[me again] That all being said, the resolution media query might help : http://mobile.smashingmagazine.com/2013/03/21/responsive-web-design-with-physical-units/

Improve this answer
5
  • +1 for the links, I did tried @media objects before and they did well for me. However, I got confused with desktop and mobile environment because somewhere I have to draw a line about the functionality and features which I can provide to desktop users but not to mobile. Ex: Pop up
    – Zerotoinfinity
    Feb 21, 2014 at 15:12
  • Now I don't know how to do this, but go to ASOS.com and take a look at one of their product pages on a mobile device. Now click "product information" - that pop up works really well and is really nice. Take a look for inspiration.
    – DLM
    Feb 21, 2014 at 15:20
  • But this isn't responsive :( mobiletest.me/#d=iPhone_5_portrait&u=http://www.asos.com
    – Zerotoinfinity
    Feb 21, 2014 at 15:29
  • It isn't but the lightbox within a mobile device is a) certainly possible and b) quite usable when used right. This is just an example to show the validity of using this feature. If you're looking for responsive lightboxes try: dimsemenov.com/plugins/magnific-popup
    – DLM
    Feb 21, 2014 at 15:35
  • @Zerotoinfinite — The answer is : pop-up windows are evil, don’t use them.
    – Nicolas Barbulesco
    Feb 23, 2014 at 14:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.