Duke 1 Posted February 8, 2013 Report Share Posted February 8, 2013 Do any of your books(Larrry) contain information on how to checki if a user is accessing a webpage on a desktop or smartphone? I want to create seperate web pages and css files for each type- desktop and smartphone. Would it be better to use PHP or Java? Thank you Quote Link to post Share on other sites
Larry 429 Posted February 8, 2013 Report Share Posted February 8, 2013 No, none of my books do that, but you're getting into a serious debate here: separate sites for mobile vs. desktop or just one responsive site. If you do want to do one responsive site, you'd use PHP on the server to detect and redirect mobile devices. http://detectmobilebrowsers.com/ Quote Link to post Share on other sites
abigail 16 Posted February 9, 2013 Report Share Posted February 9, 2013 I also want to have different sites for desktop and mobile.But I want to detect the screen width so tablet and larger get the full website and smaller gets the moble website.But I haven't researched how to do it because I'm working on something else right now. Quote Link to post Share on other sites
margaux 171 Posted February 9, 2013 Report Share Posted February 9, 2013 I use this code on some of my sites. It serves up a different page for phones. You would need to amend it for tablets. function mobilePhone() { $type = $_SERVER['HTTP_USER_AGENT']; if ((strpos((string)$type, "Windows Phone") != false) || (strpos((string)$type, "iPhone") != false) || (strpos((string)$type, "Android") != false) ) { return true; } else { return false; } } if (mobilePhone() == true) { header('Location: http://www.example.com/mobile.html'); } ?> Quote Link to post Share on other sites
Larry 429 Posted February 11, 2013 Report Share Posted February 11, 2013 Margaux, I think that's pretty dangerous code. It gives a very false sense of handling the problem, when it really doesn't. Compare your code with that used by detectmobilebrowsers.com: <?php $useragent=$_SERVER['HTTP_USER_AGENT']; if(preg_match('/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4))) header('Location: http://detectmobilebrowser.com/mobile'); ?> 1 Quote Link to post Share on other sites
Edward 108 Posted February 11, 2013 Report Share Posted February 11, 2013 Larry i love you! Quote Link to post Share on other sites
Larry 429 Posted February 11, 2013 Report Share Posted February 11, 2013 I'm blushing! Glad that was helpful. Although I should say again that there are downsides to creating separate sites and a strong argument to creating one site that works regardless of the device. 1 Quote Link to post Share on other sites
margaux 171 Posted February 11, 2013 Report Share Posted February 11, 2013 Thanks Larry for pointing out another useful resource. Abigail and I are looking for detection of mobile phones only - tablets are served the same site as desktops. Unfortunately the code you've referred to would mean tablet users would be served the mobile site. What do you think of the Mobile_Detect class which allows you to target tablets specifically thereby excluding them from the redirect? I agree that there are big downsides to creating different sites for different devices, but sometimes there are strong arguments to do so. Quote Link to post Share on other sites
Larry 429 Posted February 11, 2013 Report Share Posted February 11, 2013 I've not used that other class but it looks okay. Just for my own benefit of understanding your reasoning, a 7" Nexus tablet or a small Kindle will be served the same content as someone using a desktop computer with a 27" screen? And what would you do with an iPod? It's not a mobile phone technically but it's the same user experience (except for downloading data) as an iPhone. Yes, to be clear, there are arguments to both approaches (separate sites and redirection or one responsive site). It's a lot of work either way and I wouldn't want anyone to make that decision casually. Quote Link to post Share on other sites
Edward 108 Posted February 11, 2013 Report Share Posted February 11, 2013 I'm blushing! Glad that was helpful. Although I should say again that there are downsides to creating separate sites and a strong argument to creating one site that works regardless of the device. Cannot thank you enough for what I have learned. Quote Link to post Share on other sites
Larry 429 Posted February 11, 2013 Report Share Posted February 11, 2013 I'm glad to hear it. That's my goal, after all. 1 Quote Link to post Share on other sites
HartleySan 826 Posted February 12, 2013 Report Share Posted February 12, 2013 This might be a worthwhile video to watch in which the creator of responsive design (Ethan Marcotte) talks a bit about when to use responsive design and when to create a separate site: 1 Quote Link to post Share on other sites
Larry 429 Posted February 12, 2013 Report Share Posted February 12, 2013 Thanks for sharing that. Quote Link to post Share on other sites
margaux 171 Posted February 12, 2013 Report Share Posted February 12, 2013 Just for my own benefit of understanding your reasoning, a 7" Nexus tablet or a small Kindle will be served the same content as someone using a desktop computer with a 27" screen? And what would you do with an iPod? It's not a mobile phone technically but it's the same user experience (except for downloading data) as an iPhone. Good questions which highlight the decisions a web designer, developer and indeed the owner are required to make.They also highlight how increasingly complex web development is becoming. What are we going to do when google glass comes online? I always start with the users (e.g.what device they will be using to access the site and where from ) and what the objective of the page is e.g. selling, dissemination of information etc. Obviously, cost and time constraints have to be factored in. These considerations determine what devices need to be targeted with separate sites, responsive design or not at all. Quote Link to post Share on other sites
abigail 16 Posted April 9, 2013 Report Share Posted April 9, 2013 Does my mobile detection work?Maybe someone could test it for me, using your mobile device.I have tested it at mobiletest.me and I can see it looks good.But what I don't know is if it will detect the devices.Of course, if you see anything wrong that I didn't notice, you can tell me about that too. http://adviceofthequeen.com Quote Link to post Share on other sites
Antonio Conte 426 Posted April 9, 2013 Report Share Posted April 9, 2013 Works fine in Safari and Chrome on my iPhone 4S. Quote Link to post Share on other sites
abigail 16 Posted April 9, 2013 Report Share Posted April 9, 2013 Great. Thanks for letting me know. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.