do I have to make site mobile friendly ?

Discussion in 'HTML & Website Design' started by letsmakeamillion, Nov 11, 2014.

  1. #1
    I don't understand what the big obsession is with making a site 'mobile friendly'.

    When I look at any website on my google nexus 7 with 7 inch screen it pretty much comes up with the whole first page in view and can then zoom in a lot if i want to certain parts of the page to click some links or read stuff etc.

    I think this is also the case on iphone or android smart phone as well. You can zoom out to see the whole page page and then zoom into the appropriate part of the page to do whatever.

    The so called mobile friendly format stuffs all the content in a single small column that is like 4 miles long and it is frustrating to view content that way in my opinion.

    Whenever I go to a website and it defaults to the mobile friendly format in a long column I immediately switch to the request desktop site view.

    What do you folks think ? Understand what I mean ?
     
    letsmakeamillion, Nov 11, 2014 IP
  2. sarahk

    sarahk iTamer Staff

    Messages:
    28,811
    Likes Received:
    4,535
    Best Answers:
    123
    Trophy Points:
    665
    #2
    You don't look that young but maybe your eyes are still good.

    I'm out with the girls and we're raving about trophies on Strava or resources for our kids or books we've read or, ahem, toys we like or even men we like and we whip out our phones and call up the relevant website for a bit of show and tell. It's bad enough having to whip out your reading glasses like a nana but if the site has to be zoomed in on for every page you visit then it's just not worth it.

    Oh, and if you think that doesn't happen, think again. I can't think of a single time I've been out with my female friends lately when we haven't done that at least once.

    Don't care about that market?
    Confident we'll remember to look up the site later if we're so keen?
    We'll let you take that risk.
     
    sarahk, Nov 11, 2014 IP
    sundaybrew likes this.
  3. matt_62

    matt_62 Prominent Member

    Messages:
    1,827
    Likes Received:
    515
    Best Answers:
    14
    Trophy Points:
    350
    #3
    For me, I too have a large screen, and massive bandwidth allowance. But most people dont have this. Having a site that is mobile friendly just helps you keep your clients.
    Somtimes I purchase at a desktop, but often I make the decisions and comparisons on the go when just using a mobile.
     
    matt_62, Nov 11, 2014 IP
  4. CreativeStones

    CreativeStones Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #4
    It's pretty important to have a Responsive Website, perhaps not from yours (or any user) point of view, but for the site owner it plays an important part. For example, Now part of Google's decision on where to index websites includes whether or not it is mobile-friendly... so that's important. Secondly, although you prefer full view, the majority of the market (backed up by hundreds of research posts around the web) show that most people do prefer the mobile site.

    I think you're partly right about the huge amount of text scrolling on forever, however, if a website has been designed well and has a user's experience in mind (UX), then this is easily avoidable (even with thousands of words).

    By the way: Google now displays a little grey mobile icon next to the website address when you look at search results on a mobile - this is there to help mobile-users recognise which sites to avoid if it isn't mobile-ready.
     
    CreativeStones, Nov 12, 2014 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #5
    Personally, I am of the opinion that if I have to dive for the zoom, the developer didn't do their job right and is probably a lazy sleazeball who shouldn't be making websites in the first place... and that's as true on my 5" el-cheapo cubot phone as it is on my 27" 2560x1440 center display on the desktop.

    I prefer scrolling over dicking with zoom, BUT -- you are quite correct that some sites do become a bit of a skyscraper. Usually though that problem occurs when people stuff too damned much stuff on a single page for ANY display. Really if you can't fit it all on the screen at 2560x1440 while opening up the responsive layout to fill most of the width, you probably have too much crap on a page. Usually though such idiocy goes hand in hand with other idiotic nonsense like parallax scrolling and other scripttard gee ain't it neat bull.

    See the MASSIVE USELESS dropdown menus people insist on pissing all over websites with, followed by that idiotic "let's hide the menu for a vague icon that nobody knows what it means" scripttardery.

    My rule of thumb is that if you have more than 5 full pages of content on your responsive layout in Chrome's iPhone 5 emulation once your responsive design kicks in, you've got too much garbage on the page... which is why your typical bootcrap layout that turns into 20 or 30 pages worth of bull is, well...

    Of course, document order plays a big part too. Shrink the header, and get the user to what they came to the page for FIRST front and center -- the CONTENT.
     
    deathshadow, Nov 12, 2014 IP
  6. usemyteam

    usemyteam Member

    Messages:
    218
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    43
    #6
    Mobile friendly websites is practiced if you want to reach out to many users. Imagine today many people have their iPhones and other smartphones everywhere they go. They use their phones to do transactions, to communicate, to purchase and many things. If you think your website is not going to be viewed with these phones, then you dont have to. But you always have to think about the larger audience, 'cause if you wont what is the point of having a business online.
     
    usemyteam, Nov 12, 2014 IP
  7. varcoe

    varcoe Active Member

    Messages:
    35
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    78
    #7
    I used to discourage my clients from it because part of me didn't want to do it (not that I couldnt..), and assumed they didn't have the budget for it. I now realize how big of an idiot I was and 50% of my clients are now getting responsive websites because responsive is very important if you want to run a successful website/business that can reach the globe.

    Also have to keep in mind there are people in the world without internet on their PC, but have a mobile internet connection.

    It actually wouldn't be to hard to code your website into responsive (the content boxes would fit easily), but honestly if your going to go responsive you may as well consider a new website completely because responsive is not cheap. You can get it designed to be more user friendly in each device (Theres a difference when designing for a non responsive website, and when designing for a responsive website)

    I think theres some statistic program in cPanel that tells you what browsers your visitors use. Look for anything that says ** mobile (Safari Mobile). And if there are barley any people using your website on a mobile device I wouldn't bother if you don't want to.
     
    varcoe, Nov 12, 2014 IP
  8. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #8
    You're asking the wrong question. It's not about why make the site small screen friendly, it's about why are you not doing so. That 7x7 in "mobile" you're going on about is damned near as large as my first two laptops, with screens that applications maximized to 800x600 px. By being mobile unfriendly, you're effectively turning away potential customers arbitrarily; "Hey you, yes, you, the lefty. Out! Yeah, you too, ginger. Redheads not allowed, they're too much trouble." (Sorry, sarahk; it's not the readers. Try another store.)

    Further, if your content goes on and on as you say, you should study a bit of library science to learn how people use resources to get the information they're looking for.

    cheers,

    gary
     
    kk5st, Nov 13, 2014 IP
  9. letsmakeamillion

    letsmakeamillion Well-Known Member

    Messages:
    319
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    108
    #9
    Thanks for the feedback ladies and gentlemen. You convinced me to go with a mobile friendly design. Seems too stupid to disregard 30 to 50% of the viewing public.
     
    letsmakeamillion, Nov 13, 2014 IP
  10. dirkdunn

    dirkdunn Greenhorn

    Messages:
    7
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    23
    #10
    If you are going to get into web development, responsive design is a must. Websites need to be DEVICE INDEPENDENT, because the web is no longer on just a computer screen, but a whole array of devices!
     
    dirkdunn, Dec 22, 2014 IP
    deathshadow likes this.
  11. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #11
    Dirkdunn is pointing out something important:
    It's NOT just about "mobile friendly" -- it's DEVICE friendly you should be thinking about; as in ALL of them. With the plethora of screen sizes and device capabilities it is more important than ever to be -- as he said -- device independent and user-agent neutral. Your layout needs to adapt to as many possible combinations of browser capabilities, screen capabilities, AND non-screen capabilities as well. It's called accessibility, and as I've been saying since media queries were introduced: "Responsive layout is simply the next logical step in accessible design" -- which is why all those other steps like dynamic elastic semi-fluid layout, accessible colour contrasts and semantic markup NEED to be done before you even THINK responsive, and on some of the accessible design stuff before you even THINK about layout!

    That's why fixed width layout is garbage, that's why fixed metric (pixel) fonts are garbage, that's why sending your screen layoutS to "all" is garbage, that's why non-semantic markup and a lack of graceful degradation is garbage.

    Start with your CONTENT or a reasonable facsimile of future content, organize it in a flat text editor as if HTML never even existed. Mark it up semantically saying what things ARE and NOT what they look like (skipping DIV and SPAN at this step since they are semantically neutral)... then use CSS to bend that markup to your will creating the layoutS (this is when you add your DIV and SPAN but only once you've exhausted what can be done with the tags you've already used) for all the different targets you want to support. Then and only then do you start playing around with hanging presentational graphics on it, then and ONLY then do you enhance the functionality with any desired scripting -- keeping in mind that if you can't make it function without scripting, you probably have no business putting scripting on the website in the first place.

    It's called "progressive enhancement" and it's how you end up with near perfect "graceful degradation" should any of those steps along the way be missing, unavailable, or otherwise inapplicable. Anyone out there not working from that approach -- like say 99.9999999% of the ignorant halfwits with the giant pair of monkey brass to call themselves "designers" -- and yes I'm making air quotes with my fingers like Dr. Evil or the suckers to shoe-horn their content into some ignoramus off-the-shelf "templates" from whorehouses like ThemeForest or TemplateMonster; well to be brutally frank most always result in buggy, broken inaccessible train wrecks of idiocy that are almost guaranteed to be slow loading inaccessible train wreck laundry lists of how not to build a website. Same goes for all the nitwit simpletons using "frameworks" like Bootcrap and jQueery where they end up with 100k or more code before they've even thought about plugging content into a page.

    CONTENT dictates markup, CONTENT and markup dictates layoutS -- yes PLURAL. CONTENT, markup and layout dictating any fancy artsy-fartsy presentation you hang around it -- CONTENT FIRST! Because at the end of the day people visit websites for the CONTENT, not the goofy graphics you hang around it and most certainly NOT any goofy bandwidth wasting scripttardery.

    Which is why most of the imbecile's out there crapping out websites any old way and then dumping a can of shellac on it have no business making websites in the first place. Polishing a turd doesn't mean it's still not a turd, and dumping bug excrement on it -- no matter how hard and shiny it can get -- isn't the answer. Neither is the "Let's see how much code we can throw at this for NOTHING." that seems to be taking over the entire industry with people using tens or hundreds of K of markup, hundreds of K of CSS in a half dozen files, and hundreds if not thousands of K of "JS for nothing" all to deliver single digit K of plaintext and a half dozen content images. Herpafreakingderp people!
     
    Last edited: Dec 22, 2014
    deathshadow, Dec 22, 2014 IP
    monfis likes this.
  12. Front end-dev

    Front end-dev Greenhorn

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #12
    Dirkdunn & deathshadow both of you make the responsive design one step upper. And the time if any one think development any website without cross browser support and cross device support. You will definitely loss your at least 50% customer...
     
    Front end-dev, Jan 9, 2015 IP
  13. John Osel O. Diaz

    John Osel O. Diaz Greenhorn

    Messages:
    45
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    8
    #13
    Nowadays your site has to be mobile friendly or you won't really have much success with the current generation. Mobile friendly sites or "Responsive sites" are essential because most of the people nowadays rely heavily on their phone. If your site is not responsive it won't get much attention. The attention span of kids these days are not that long so if your website looks bad on a mobile phone, the user might just close your site or find something else that's worth their time and that would satisfy their aesthetic yearning.
     
    John Osel O. Diaz, Jan 28, 2015 IP
  14. monfis

    monfis Well-Known Member

    Messages:
    1,476
    Likes Received:
    31
    Best Answers:
    0
    Trophy Points:
    160
    #14
    One of my recent SEO projects was a health site for teenies (acne). By today, after two years running, Google counts around 280.000 page impressions and 120.000 visitors per month. 60% - 70% of them enter using mobiles; imagine the loss of business without a responsive design.
     
    monfis, Feb 7, 2015 IP
  15. learnwebsitedesigncom

    learnwebsitedesigncom Active Member

    Messages:
    264
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    58
    #15
    The first thing that I was going to say was that Google encourages websites to be mobile friendly. Two of the ways that it does this is to add a little text that says "mobile friendly" at the beginning of the website description and the second is it gives mobile friendly websites more authority when it comes to mobile searches.

    Also, if you design your own websites, it might be best to learn Bootstrap. Bootstrap is an HTML, CSS, and JavaScript framework that makes it really easy to design responsive websites, and it's easy to learn.
     
    learnwebsitedesigncom, Feb 12, 2015 IP
  16. King Manu

    King Manu Active Member

    Messages:
    149
    Likes Received:
    22
    Best Answers:
    4
    Trophy Points:
    75
    #16
    the 360x640 resolution was 11,48 % of my last month traffic
    the 320x568 was 9,52 % .
    The 1366x768 ( my laptop resolution ) was 0,39 % .

    Do i need to say more about why?! Go mobile friendly my friend . Or responsive like me
     
    King Manu, Feb 13, 2015 IP
  17. charliev

    charliev Banned

    Messages:
    21
    Likes Received:
    0
    Best Answers:
    1
    Trophy Points:
    26
    #17
    Getting your site mobile friendly is a must these days. Most people are using smartphone to browse a website. If you use wordpress, then try to get a responsive theme, so you don't have to worry as it adjust your site from desktop to smartphone.
     
    charliev, Feb 14, 2015 IP
  18. sundaybrew

    sundaybrew Numerati

    Messages:
    7,294
    Likes Received:
    1,260
    Best Answers:
    0
    Trophy Points:
    560
    #18

    WRONG - GET A "response theme with FLUID layouts"

    Otherwise you will look like shit in the desktop ;)

    Just a response theme looks like crap .......you need a FLUID with or MAX-WIDTH 98% or greater on a responsive theme,

    use something like wordpress + Genessis by studiopress,

    BUY A PREMIUM theme, its SO worth it, I can code and its better to buy a theme and an engine.

    Let me know if you have any other questions, I have been doing online sales and web mastering for 12 years ;)

    MOBILE IS NEEDED 100%

    Check this OUT:

    Statistics

    http://www.youtube.com/yt/press/statistics.html

    Product
    • YouTube has more than 1 billion users
    • Every day people watch hundreds of millions of hours on YouTube and generate billions of views
    • The number of hours people are watching on YouTube each month is up 50% year over year
    • 300 hours of video are uploaded to YouTube every minute
    • ~60% of a creator’s views comes from outside their home country
    • YouTube is localized in 75 countries and available in 61 languages
    • Half of YouTube views are on mobile devices
    SO BASICALLY HALF A BILLION USERS ARE MOBILE ;)

    YEAH - Time bro ;)
     
    sundaybrew, Feb 14, 2015 IP
  19. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #19
    WRONG -- since turdpress asshattery is the road to failure, as are the scam artist BULLSHIT known as off the shelf themes. There is no such thing as a "premium" theme, they are universally half-assed halfwit rubbish that only people who don't know enough about websites are DUMB ENOUGH to be duped into thinking lets them have a website.

    The very notion that you can simply "buy a theme" and then crap your content into it is so utterly and completely back-assward, it's a miracle the practice continues apart from the ignorance of the average "sophisticated Internet investor, will give money for vague promises". By their very nature off the shelf templates are not designed for YOUR content, and instead try to have their layout dictate the content.

    That's why you START with the content or a reasonable facsimile of future content, instead of dicking around in some goofy paint program like photoshop, instead of dicking around with some bloated crap sleazed together by an artist who knows nothing about your content, and instead of dicking around with some bloated code sleazed together by people who didn't know enough about HTML or CSS to be making a website in the first damned place.

    Turdpress, off the shelf templates, framework idiocy like bootcrap and jQueery -- it's all sleazy shortcuts that will bite you in the ass sooner than later if you are building anything more complex than a blog for grandma.

    Let's use that steaming pile of crap known as Genesis as an example. If you don't know what's wrong with this:

    <link rel='stylesheet' id='child-theme-css'  href='http://www.genesisframework.com/wp-content/themes/genesis/style.css?ver=2.1.2' type='text/css' media='all' />
    <link rel='stylesheet' id='simple-social-icons-font-css'  href='http://www.genesisframework.com/wp-content/plugins/simple-social-icons/css/style.css?ver=1.0.5' type='text/css' media='all' />
    <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.genesisframework.com/xmlrpc.php?rsd" />
    <style type="text/css"> .enews .screenread {
    	height: 1px;
        left: -1000em;
        overflow: hidden;
        position: absolute;
        top: -1000em;
        width: 1px; } </style><link rel="Shortcut Icon" href="http://www.genesisframework.com/wp-content/themes/genesis/images/favicon.ico" type="image/x-icon" />
    <link rel="pingback" href="http://www.genesisframework.com/xmlrpc.php" />
    <!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
    <style type="text/css" media="screen"> .simple-social-icons ul li a, .simple-social-icons ul li a:hover { background-color: #eee !important; border-radius: 3px; color: #333 !important; font-size: 21px; padding: 11px; }  .simple-social-icons ul li a:hover { background-color: #f15123 !important; color: #fff !important; }</style></head>
    <body class="home blog content-sidebar" itemscope="itemscope" itemtype="http://schema.org/WebPage"><div class="site-container"><header class="site-header" role="banner" itemscope="itemscope" itemtype="http://schema.org/WPHeader"><div class="wrap"><div class="title-area"><h1 class="site-title" itemprop="headline"><a href="http://www.genesisframework.com/">Genesis Framework</a></h1><p class="site-description" itemprop="description">Supports HTML5 &amp; Mobile Responsive Design</p></div><aside class="widget-area header-widget-area"><section id="nav_menu-4" class="widget widget_nav_menu"><div class="widget-wrap"><nav class="nav-header" role="navigation" itemscope="itemscope" itemtype="http://schema.org/SiteNavigationElement"><ul id="menu-primary-navigation" class="menu genesis-nav-menu"><li id="menu-item-189" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-189"><a href="http://www.genesisframework.com/sample/">Sample</a>
    <ul class="sub-menu">
    	<li id="menu-item-193" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-193"><a href="http://www.genesisframework.com/sample/sub-page-11/">Sub Page 1.1</a>
    	<ul class="sub-menu">
    		<li id="menu-item-196" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-196"><a href="http://www.genesisframework.com/sample/sub-page-11/sub-page-21/">Sub Page 2.1</a>
    Code (markup):
    Do the world a favor and stop making websites, stop making templates, and take some time off to learn how to use HTML and CSS properly.

    To summarize what's wrong with that, sending screen layout to "all", static style inlined in the markup, invalid REL, type attribute on a LINK known to cause favicons NOT to work, IE CC's to make up for developer ineptitude and the steaming pile of halfwit bull known as HTML 5, endless pointless classes for nothing, ID's on things that should NEVER need ID's (like LINK), the code bloat RPC edit garbage that NOTHING actually uses, aria role BLOAT and schema BS for NOTHING that the semantic markup shouldn't already be delivering, absolute URL's for nothing... There are even telltales like the single quotes showing whoever's writing the back-end code doesn't know enough about PHP to be doing that either. There is NO legitimate reason for the above code to be much more than:

    <link
    	type="text/css"
    	rel="stylesheet"
    	href="/wp-content/themes/genesis/screen.css"
    	media="screen,projection,tv"
    />
    
    <link
    	rel="shortcut icon"
    	href="/wp-content/themes/genesis/images/favicon.ico"
    />
    
    </head><body>
    
    <div id="top">
    
    	<h1>
    		<a href="/">
    			Genesis Framework<br />
    			<small>Supports HTML5 &amp; Mobile Responsive Design</small>
    		</a>
    	</h1>
    	
    	<ul id="mainMenu">
    		<li>
    			<a href="/sample/">Sample</a>
    			<ul>
    				<li>
    					<a href="/sample/sub-page-11/">Sub Page 1.1</a>
    					<ul>
    						<li><a href="/sample/sub-page-11/sub-page-21/">Sub Page 2.1</a>
    Code (markup):
    At least if you understand how to leverage inheritance, how much of that is pointless code bloat that makes the page slower, harder to work with, and serves NO legitimate purpose, and bother taking the time to grasp what semantic markup is and how to use it. Crap like "genesis" is developer ineptitude of the highest order -- though really that summarizes 99.999999% of what I've seen people sleaze out any old way in turdpress.

    Of course, such ineptitude is how you end up with people wasting 33k of markup on 4k of plaintext and no content images -- basically three to five times as much code as should be needed and completely missing the POINT of HTML out of ignorance, apathy, ineptitude, and just plain wishful thinking.

    plow turdpress, to blazes with off the shelf templates -- and if you disagree, you probably don't know enough on the topic to be allowed to have a website in the first damned place, or are part of the problem in the form of some form of sleazy scam artist preying upon the ignorance of others!
     
    deathshadow, Feb 15, 2015 IP
    monfis likes this.
  20. sundaybrew

    sundaybrew Numerati

    Messages:
    7,294
    Likes Received:
    1,260
    Best Answers:
    0
    Trophy Points:
    560
    #20
    You JUST DENOUNCED A MILLION DOLLAR INDUSTRY ;)

    I think YOU NEED TO GO OUTSIDE and get some fresh air -- Love You
     
    Last edited: Feb 15, 2015
    sundaybrew, Feb 15, 2015 IP