• About Us
  • Blog
  • Basket
  • Account
  • Sign In
  •  

Blog

Website Optimisation for Apple devices - iPad and iPhone

Published on Wednesday, September 20, 2017

Website Optimisation for Apple devices - iPad and iPhone

51Degrees shares updated JavaScript to enable device detection for Apple devices

In 2015 we released a detailed blog on Device Detection for Apple iPhone and iPad

Since then Apple have released the iPhone 6s, 6s+, 7, 7+ and more recently the 8, 8+ and X. Identifying these mobile devices can be challenging. When putting plans in place to optimise websites for mobile devices like Apple, companies have two choices. Try and run a solution internally or simply have 51Degrees do the work for you with the added benefits of the Apple device properties we provide in our data files.

For information on the 'HardwareModelVariants' property we added in May this year refer to this blog: 'Detect Apple iPhone Model Numbers and User-Agents'

Because we endeavour to support companies and hobbyists with our unique open source solutions, we are sharing some JavaScript that will enable you to set up an internal solution if you wish. We would, however, encourage you to save yourself the time and effort and use our data files to support your strategic website optimisation decisions.

This blog offers you a method to detect different apple devices using JavaScript that can run on almost any website. If you did decide to take it a step further using a Device data package, you could access the key properties for the Apple devices accessing your website. The outputs of these files can also be fed into Google Analytics custom dimensions feature to further drill down the analytics regarding the Apple technologies being used to access your website. This sample code requires no external calls to any 3rd party sites and can all be run server-side, allowing you the fastest detection possible.

Updated JavaScript code for iPhones

If you prefer to do it yourself, the JavaScript extract you can use to detect the latest iPhone devices is shown below:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
// iPhone model checks.
function getiPhoneModel() {
    // iPhone X
    if ((window.screen.height / window.screen.width == 812 / 375) && (window.devicePixelRatio == 3)) {
        return "iPhone X";
    // iPhone 6+/6s+/7+ and 8+
    } else if ((window.screen.height / window.screen.width == 736 / 414) && (window.devicePixelRatio == 3)) {
        return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus";
    // iPhone 6+/6s+/7+ and 8+ in zoom mode
    } else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 3)) {
        return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus (display zoom)";
    // iPhone 6/6s/7 and 8
    }else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 2)) {
        return "iPhone 6, 6s, 7 or 8";
    // iPhone 5/5C/5s/SE or 6/6s/7 and 8 in zoom mode
    } else if ((window.screen.height / window.screen.width == 1.775) && (window.devicePixelRatio == 2)) {
        return "iPhone 5, 5C, 5S, SE or 6, 6s, 7 and 8 (display zoom)";
    // iPhone 4/4s
    } else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 2)) {
        return "iPhone 4 or 4s";
    // iPhone 1/3G/3GS
    } else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 1)) {
        return "iPhone 1, 3G or 3GS";
    } else {
        return "Not an iPhone";
    }
}

Updated JavaScript code for iPads

The iPad has had three major releases; The iPad mini 4, iPad Pro and iPad Pro 9.7". Both the iPad mini 4 and iPad Pro 9.7 have similar resolutions to their predecessors, however the iPad Pro has a much higher resolution. We can use this information from the vendor to specifically find this device.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
// iPad model checks.
function getiPadVersion() {
    // iPad 1, 2 and iPad Mini 1
    if (window.devicePixelRatio == 1 ) {
        return "iPad 1, iPad 2, iPad Mini 1";
    // iPad Pro
    } else if((window.screen.height/window.screen.width == 2048/2732)&&(window.devicePixelRatio == 2)) {
        return "iPad Pro";
    // All other iPad devices
    } else if (window.devicePixelRatio == 2) {
        return "iPad 3, iPad 4, iPad Air 1, iPad Air 2, iPad Mini 2, iPad Mini 3, iPad Mini 4, iPad Pro 9.7";
    } else {
        return "Not an iPad";
    }
}

New Algorithm

51Degrees recently announced the launch of their new 3x faster algorithm which can achieve speeds of over 22million detections per second. Great news for Adtech companies where every millisecond counts in the programmatic and RTB environment. We are including this new feature as part of our free evaluation.

Try our 30 Day Free Trial and get access to Enterprise Level Device Intelligence for your website

GET STARTED

New Algorithm Performance

Comments (0)
Lily
>

Lily

Other posts by Lily
Contact author

Name:
Email:
Subject:
Message:
x

Tags

.NET 2013 2014 4G 51Degrees 5G A.C.Roma A7 ABI Acer Affiliate Marketing Alcatel Amazon AMP Analysis Analytics Android Android 5.0 Lollipop Android Kitkat Android Lollipop Android Media Stick Apache API Apple Apple TV Archos Asha Asian Market ASP.NET Asus Australia Big Data Black Friday Blackberry Blink Browser C C# Case Study CeBIT CES Chrome Cloud CMS combinations Comparison Competition CoolPad COTW Cron CSS3 Data Data Blog Data File Data Model Daydream Denver Design Desire Eye Desktop Detection Developers Device Device Data Device Detection Device Intelligence Device Popularity Device property Device Types Device Use Display dmexco DoCoMo Doogee DotNetNuke Download Drupal Email EReader E-Reader Ericsson Evaluation Event Examples EXPLAY Rio Facebook feature Firefox Firefox OS Fly Foundation Framework France Galaxy S3 Galaxy S5 Galaxy Tab A Galaxy Tab A 8.0 Galaxy Tab A 9.7 Germany git repositories Global Google Google Daydream GSMA HAProxy Hardware Hisense HTC HTC ONE MAX HTC OS HTML5 HTTP HTTP Headers Huawei HUAWEI. UPDATE HUDL Huwaei IBC Icemobile Prime 4.0 IE IFA IIS Image Optimiser Image Optimizer India Infographic Ingeniux Internet usage iOS iOS 7 iOS 8 ipad iPhone iPhone 6 IsEmailBrowser IsWebApp Italy Japan Java Javascript Jolla Kentico Keynote Kindle Kindle Fire Kindle Fire HD Leagoo Lenovo LG Location Log File Analysis LTE Lumia m.dot macOS Map Memory Meta Data Mi 4S Micromax Microsoft Miia Style Mobile Mobile Analysis Mobile Analytics Mobile Devices Mobile Marketing Mixer Module Motorola MVC4 MWC MWC 2017 MWC16 MyPhone Native Native Apps NET New Release News News Letter Nexus Nexus 6 Nexus 9 NFC NGINX Nokia Nokia 3310 Non-Mobile NVIDIA Omate On7 OnePlus 5 Opera Opera Mini Operating System Optimisation OS OSX 10.10 OTA Panasonic Patent PC Pebble Performance phablet phone PHP Poland Presentation Press Release Price Band PRIV programmatic PS4 Python QMobile QR Codes Redirection Research Reseller Responsive Images Responsive web design RESS Review reviews RIM Ringmark RTB RWD Safari Samsung Scala Screen Screen resolution Screen Size SEO Server Server-side optimisation Set Box Set Top Box Sharepoint Shark 1 SHIFT phones Sitecore Sitecore version 9 SLUSH Smart TV Smartphone Smartphones Smartwatches Snapdragon Sony Sony Xperia Spain Swedish Beers Symbian Tablet Tablets Tesco Testing Tips Top 5 TOTW TV UDS UK Umbraco Update updates US User Agent UserAgent User-Agent Vendors Version 3 Video VoLTE VR Wearable Web Web Apps Web content management WebKit WebMatrix White Paper Widgets Widnows WiFi Wiko Wileyfox Windows Windows Phone Xbox XBox One Xiaomi Xperia Xperia z Yosemite Z10 ZenFon 2 ZOPO ZTE