What are the Responsive Web Design Benefits?

What are the Responsive Web Design Benefits?

 

There are many benefits to having a responsive design. This includes SEO (Google recommends using responsive design!), a better user experience which leads to better conversion and lower bounce rates, a more efficient and easier to manage website, faster page speeds, and better analytics.

 

There are only benefits to having a proper responsive layout. In addition to what @Host Capitol said, the main benefit of having a properly constructed website (HTML & CSS), is that it will more or less automatically work on all devices with only small additions/changes to the CSS. If properly constructed, changing a website to be 100% responsive shouldn't take more than a couple hours, at most, including testing.

 

Another benefit is that you can load all features from the desktop version in your mobile version without any hassle so it loads the same on every device and you only need to test your script once.

 

due to google ranking factor and mobile market of the current situation responsive site must be needed.

 

Responsive is so beneficial for a website. Apart from the users, even search engines prefer sites which are responsive and gives good rank to them as well.

 

More and more people are accessing information and doing internet searches on mobile devices. This trend will continue to grow. Knowing this, it is imperative that your website be easily viewed on all size screens. Responsive website themes allow for this without any work on the part of the designer. It's the only way to go given that we all remember how horribly painful it was to keep scrolling sideways to finish reading a sentence on a site that is not responsive. Hope that helps.

 

In the mobile era it's a must. Don't you see tons of mobile-zombies on the streets?

 

Responsive layout is just the last in a long line of good design practices, all of which exist for one simple reason: Accessibility!

The biggest advantage to responsive layout is much the same as the advantage of "separation of presentation from content" -- you can have multiple appearances applied to the same codebase from ONE unified markup. You write your semantic markup ONCE, apply presentational hooks like DIV and SPAN only where needed WITHOUT saying what that presentation actually is (which is why OOCSS and garbage like bootcrap are by their very nature dumbass bullshit)...

... and it is just the next step. Semantic markup exists so you can say what things are or would be in a professionally written document -- allowing the user-agent (a browser is a UA but a UA isn't always a browser) to best customize that meaning to the capabilities of the device it is on. You then use CSS to declare the specific style you want for specific targets -- screen, print, aural, etc... Responsive layout is just an enhancement to those media targets to detect things like resolution or dpi settings to adjust the content to best fit the display.

Which means JUST like semantic markup, progressive enhancement, using media targets, elastic layout, and semi-fluid layout you can write one page that doesn't give a flying *** what device, size display, or even browser capabilities it is being showed on as it can adapt to ANY of them.

Which is why I've been saying for over a decade that pixel metric font declarations with fixed pixel widths are utter and complete design and development ineptitude, and anyone who "thinks" that actually qualifies as design isn't qualified to be designing a Joe blasted thing!

It's called device independance -- and it's also why thinking "mobile vs. desktop" or specific "resolutions" in your design is JUST AS IGNORANT AND FLAWED!!!. Your media query breakpoints for making the layout responsive should be based on the needs of the content, not some arbitrary pre-planned grid or specific resolution sizes!

It's why my first screen media layout is usually for desktop resolution pre CSS3 browsers. It's what we can't target with media queries so that's the lowest common denominator. (I consider the "mobile first" mantra to also be idiotically flawed!) I then say "With the screen larger would adding columns be good?" and if so, figure out where there's room for that and split the sidebar into multiples. I then go "when does the layout break going smaller" -- figure out where that is and make a media query in EM for that... then lather, rinse, repeat down until it's one column.

Boom, a layout that adjusts to ANYTHING within the capabilities available at the time.

Of course, for the mouth-breathers who never extracted their cranium from 1997's rectum, who still vomit up HTML 3.2 and slap either 4 tranny atop it or 5 lip-service around their bloated, non-semantic, outmoded HTML and then sleaze framework over framework atop it in the blind hope of making up for their ineptitude and ignorance, I might as well be speaking Laith aen Undod.

 

Responsive web design is good for adjusting your website to all platforms. So say you have a website that is made for the desktop but it won't look or function the same on a mobile phone. Then you need to consider redoing your site in a responsive manner.

 

Nowadays, users are more depending on mobile phones, tablets etc for finding answers to their queries. The responsive websites generate more leadings to your website which in turn increase your sales.

 

Responsive web design is recommended by Google, it allows one website to provide a great user-experience across many devices and screen sizes, and it also makes managing your SEO strategy easier. For these reasons, responsive web design is the best option for your mobile SEO strategy.
And I think you will be interested to read about mobile first website approach.

 

Actually, that's backwards. You should always start with the default version, i.e. that's basically the desktop version.

Jason Knight (@deathshadow on this site) has written several articles regarding good coding practice. I suggest you read on progressive enhancement, the section on media queries and responsive layout in particular.

cheers,

gary

 

100% agreed with Garry

 

The most important thing is bounce rate and conversion rate. Responsive web design means a website with all user friendly aspects in it. I know some useful platforms where you can find good web designers and marketer who can help you out in creating responsible website design for your business. All of you shared very useful information for new business entrants specially.

 

Why? Any logic reason behind it?

 

This forum (this specific subforum, that is) has nothing to do with "market value" - it has to do with correct use of HTML, CSS, and other tech.

And no, your assumptions about speed and need for optimization is dead wrong. Not nearly everyone on the planet has access to high-speed, or even low-speed broadband. Actually, last time I checked, about 700 million people on the planet has access to high-speed broadband with good connection quality (this was a couple years ago, so I assume this has improved - let's say it has improved a lot, and the tally is now 1.2billion users). About 2 billion has access to medium-to-low speed broadband, and the rest is somewhat dispersed across crappy connections, unstable connections, expensive mobile connections, and similar sub-par connections. If you count all of that, that leaves HALF THE WORLD without high-speed access to the Internet (and now I haven't even counted the countries where general access to anything like the Internet is almost non-existent).

You arrogance is quite telling - you fail to utilize quality code, and you provide next-to-no reasons why you're not coding stuff the way it should be coded. The fally being that it takes more time, or more work to code it correctly - which it doesn't. Actually it should take LESS time, since you don't have to write all that extra code, or try to "fix" broken styles or functions due to bad code to begin with.

By all means, it's not the worst I've ever seen, and it does load quite well here, but than again, I'm in Norway, we generally have good quality internet, and so on. As for the code itself, it's horrible, with CSS interspersed with javascript and then suddenly html and then some javascript again, inline styles and scripting... yeah, it's quite bad.

 

@PoPSiCLe and @deathshadow

Are you averse to Smarty specifically, or templating engines in general? If the latter, how is embedding php in html or html in php different from embedding javascript in html? In either case, server-side or client-side, it is a best practice to separate logic (scripting) from structure (html) just as it is a best practice to separate structure from presentation.

If your objection is to Smarty in particular, which templating engine(s) would either of you recommend? And why?

cheers,

gary

 

... and ping times have not, hence my putting more emphasis on the sheer number of files and handshaking.

Much less mobile has slower connection speeds, less memory, and all those other issues you are dismissing out of hand; that page likely sucking down five minutes of normal battery time in the ~40 seconds or so it takes to grab over your typical low-concurrency connection.

Writing ten to twenty times the code and then somehow deluding oneself into thinking that's easier to work with or faster to create; all of which is ignorant nonsense promoted by people who have zero business creating websites for others.

To me, "Software as a service" is just another of the many outright scams sleazy fly-by night dirtbags use to take advantage of people who want a website but don't know the first damned thing about them. "For people who know nothing about websites BY people who know nothing about websites" is NOT a plan for success... well, unless you're the predator duping nubes into paying for just another cookie cutter disaster doomed to failure from the start -- mostly using hoodoo-voodoo and the same seven propaganda techniques that political and religious movements have used to herd the sheep since Orruk hollowed out a rock, pissed in it, mixed in some potash, and traded it to Grog as hair tonic in exchange for an evening with the communal whore.

With that bloated, agonizingly slow loading (25+ seconds here and I'm on a 45mbps down), INACCESSIBLE disaster -- that in places like the UK could get fined depending on the type of site... I shudder to think what the bounce rate is before the page even finishes loading; probably high bounce before the stupid analytic scripting crap even has a chance to run. (hence why I trust server logs more than I do scripttardery)

... with that traditional "If you don't know what's wrong with this:"

<div class="off-canvas-wrap">
    <div class="inner-wrap">
        <div id="top-background" data-paralax="2"></div>
        <div id="top-background2" data-paralax="10"></div><div id="top-background3" data-paralax="10"></div>
        <nav class="tab-bar show-for-small">
            <section class="left-small">
                <a class="left-off-canvas-toggle menu-icon" ><span></span></a>
            </section>
            <section class="middle tab-bar-section">
                <div class="left left-off-canvas-toggle">
                MENU
                </div>
            </section>
            
            <div class="right text-left show-for-small-only top-login-versions">

Code (markup):

Do the world a favor, back the ***** away from the keyboard, and take up something a bit less detail oriented like macramé.

... and of course, don't forget the utter and complete ignorance of semantics, why it's important, and accessibility present in that idosell rubbish. I pity the clients given what a giant middle finger to users with accessibility needs such sites are. Pixel metric fonts? Pixel metric breakpoints? Illegible colour contrasts? Thin-glyph webfonts that compromise legibility even further? ZERO semantic markup so ZERO non-visual graceful degradation and a dick-all chance in hell of search engines doing anything meaningful with the sites?

Responsive design -- the entire topic of this thread -- is the last in a long line of good practices and accessible design methodologies stretching back to when HTML was originally created. If you lack any of those stepping stones along the way, slapping some media queries on it in ignorance is basically missing the entire point!

Hell, I'm assuming idosell dot com is yours? Do you even know what semantic markup is? Why it's important? How to leverage it so you're not throwing a dozen classes at EVERY BLASTED ELEMENT!?!? I mean really, invalid doctype, hooking scripting instead of scripting as a hook, no proper .ico fallback favicon, no media targets for your screen media style, that stupid modernizr.js garbage when to be frank you're so misusing the HTML 5 tags you probably shouldn't even bother having them (NOT that there's a legitimate reason to use most of them if you use numbered headings and horizontal rules properly), that stupid X-UA nonsense which should only be needed on old broken sites and should never be included on a new one (not that any site written properly after 1998 should EVER have needed it in the first damned place!), blocking scripting in the <head>, invalid/fairy-tale robots meta values (THERE IS NO SUCH THING AS INDEX OR FOLLOW!!!), keywords meta that's not filled with words and has zero relevance to the page itself... lands sake I'm not even out of the <head> and it's a disaster.... and that's before the endless pointless DIV for nothing, endless pointless classes for nothing, multiple H1 without SECTION (despite having the scripttardery present to allow that in older UA's... real head scratcher that)...

Even at what should be considered a lean 14k, it's a bloated wreck of gibberish inaccessible markup doing realistically about 5k's job! You lump on the ridiculously absurd and pathetically laughable 248k of CSS doing ~16k's job and the endless pointless scripttardery for nothing?

... and yet somehow, I bet you've deluded yourself into thinking that writing three to fifty times the code needed is "easier" -- meaning you've managed to blow as much smoke up your own backside as you do to the people who buy your "service".

 

PHP already IS A TEMPLATING ENGINE!!! That's why it's called a hypertext preprocessor -- you know hypertext, right? As in HyperText Markup Language?!?

Garbage like smarty is basically running a template engine on top of a template engine, and to be frank you can't get much more herpafreakingderp than that. That would be like creating an interpreted language where the interpreter is written in JavaScript.

Doesn't make a lick of sense, but it doesn't stop people from doing it.

Generally speaking if you can't handle include(), creating functions, using echo, and a few variables -- you probably have ZERO damned business converting a template for use by a back-end system. Or if that's too hard, is printf REALLY so difficult?

All of these rubbish template systems slap atop PHP -- like Smarty, like Dwoo, like Savant -- are utterly and completely pointless redundancies that just make it HARDER to work with. Much like the idiocy that are javascript frameworks, HTML/CSS frameworks, and all the other stuff people have deluded themselves into thinking they need or somehow are magically "easier" just because everyone SAYS it is... well, they're pointless code-bloat, extra work, and just as responsible for broken, slow, inaccessible train wrecks of how NOT to build a website.

It already IS a template system, why the **** do people feel the need to overcomplicate it by slapping another one on top of it? Ignorance? Apathy? Stupidity?

Sadly, I suspect the last of those is the root cause... One should never attribute to malice that which can adequately be explained by stupidity.

PHP is best used as glue -- to take a user input, gather the appropriate response for that input, and glue it to the markup. That's what it DOES, that's WHY it was created, and that's why you don't need some extra crap on top of it to handle the markup!

But what do I know? I'm the guy who wants to remove all the shorttags, nowdoc and heredoc from PHP. Possibly swing an axe at double quoted strings while at it!