'

Mobile First: How To Approach Mobile Testing

Понравилась презентация – покажи это...





Слайд 0

HOW TO APPROACH MOBILE WEBSITE TESTING @tompeham I @usersnap


Слайд 1

THIS IS ME! @TOMPEHAM I @USERSNAP


Слайд 2

THIS IS ME! Say hi! @TOMPEHAM I @USERSNAP


Слайд 3

BEFORE WE GET STARTED… You can find all resources here.


Слайд 4

HERE IS HOW TO APPROACH MOBILE WEBSITE TESTING


Слайд 5

“Responsive Design is no longer a luxury, but a necessity.” - InVision


Слайд 6

What does RWD mean? This means that developers should be creating their websites so a user can access it from any smart device, be it iPhone, smartwatch, Kindle or notebook, without running into problems.


Слайд 7

Getting started with mobile testing The goal of mobile website testing is to deliver a consistent but relevant experience to users across all those different devices, and that can be really hard to manage.


Слайд 8

What to look out for When it comes to mobile website testing there are 4 basic things to look out for. These are: 1. Does the site look great on each device
 2. Is it free of bugs on each device
 3. Is the interface user-friendly on each device
 4. Is the site optimized for each device


Слайд 9

Validate your HTML and CSS code You should first try to validate the HTML code of your page. It’s not because the website works for you that it’ll work for everyone. So the most important step is to make sure you’ve covered the basic and the website is on par with all HTML and CSS standards.


Слайд 10

W3C mobileOK Checker W3C is a web based automated validation tool and is one of the best tools to check the compatibility of your site on mobile devices: https://validator.w3.org/mobile/


Слайд 11

Chrome Developer Tools The Chrome Developer tools are a great place for fixing HTML and CSS issues. Through the whole testing workflow, the Chrome Developer Tools should be your home base.


Слайд 12

Test on different browsers and operating systems You should then test your website on multiple browsers, especially the ones which are most popular in your target audience. This probably means testing in Firefox, Chrome, Safari or Internet Explorer.


Слайд 13

Testing on BrowserStack Browserstack is a web service that allows access to desktop and mobile devices and can be used by professionals to test their sites. https://www.browserstack.com


Слайд 14

Test for different mobile devices The best way to test the responsiveness of any site is by simply testing it on different mobile devices. The user experience varies depending on the page loading time, pixel densities and the size of the tap targets.


Слайд 15

Testing with Android Emulator and iOS Simulator Since comprehensive testing on each mobile device is often not possible due to cost and time limitations, a mobile device testing suite works best in testing. Other than testing on the real mobile devices, you can also use an emulator. Emulators are software that are mainly designed for testing apps and default web browsers. Here are some of the best emulators…


Слайд 16

Responsinator Responsinator is great tool for testing your responsive web design. It’s free of any cost and works great for performing a quick layout check. http://www.responsinator.com/


Слайд 17

Am I Responsive? Am I responsive is a web based tool that will show you if a certain website has an responsive web design. Though it’s more a tool for a quick and simple check, than for testing and bug tracking purpose. http://ami.responsivedesign.is


Слайд 18

MobiReady MobiReady is basically an online testing tool. It performs a number of tests and provides a comprehensive result for the compatibility of your website for the mobile use. http://ready.mobi


Слайд 19

Mobile testing after deployment As with all things development related, there’s no guarantee that after deployment, your website will be flawless. In fact, there will be bugs, always. So, after deployment, you’re going to want to keep an eye on your responsive website. Here are two great tools to help you…


Слайд 20

Pingdom This tool monitors how the user experiences the website and where they might find potential hiccups. 
 http://tools.pingdom.com/fpt/


Слайд 21

Usersnap Usersnap helps you get information about bugs, without bothering your users all too much. https://usersnap.com


Слайд 22

THAT WAS A LOT…


Слайд 23

Enjoyed this presentation?


Слайд 24

Enjoyed this presentation? Yes you did? Awesome.


Слайд 25

Enjoyed this presentation? Yes you did? Awesome. Give it a tweet!


Слайд 26

Enjoyed this presentation? Yes you did? Awesome. Give it a tweet! PLEASE! :)


Слайд 27

ONE LAST THING… JUST PING US ON TWITTER.


Слайд 28


×

HTML:





Ссылка: