| 
  • If you are citizen of an European Union member nation, you may not use this service unless you are at least 16 years old.

  • You already know Dokkio is an AI-powered assistant to organize & manage your digital files & messages. Very soon, Dokkio will support Outlook as well as One Drive. Check it out today!

View
 

COP4813 Assignment 10 - Programming for Mobile

Page history last edited by Dr. Ron Eaglin 7 years, 4 months ago

 Assignment #10 - Programming for Mobile Devices

 

Objectives

 

To implement a web interface for the touch (mobile) environment

 

Supports Course Outcome 1,3,5

1 – Understand and use all the capabilities of modern web browsers.

3 – Use XML, XSL, CSS, and correct techniques to create properly structured and well designed web sites.

5 – Ability to deploy web based designs in a server environment.

 

Assignment

 

For this assignment you will simply implement a mobile version of your main (default) web page. The page must work correctly on a mobile device (iPad, iPhone, Android phone or Android tablet). It must contain the same menu and features as your standard web page. I will be testing with an iPhone 6, Samsung Galaxy S5, and iPad 2.

 

You can either (1) have a different CSS file applied to your main page, or (2) go to a totally separate page for mobile devices, or (3) design an interface that works well on both phone and desktop.

 

You ONLY need to provide a mobile interface for your main page.

 

All features of your main page must view and perform on all devices in a similar and intuitive fashion. This is particularly true of images and the menu system.

 

Information

 

For this assignment you will need to research the CSS and Javascript events necessary to implement the interface. The menu system should activate on a touch the same as if a click occurred with a mouse.

 

Estimated Completion Time

 

10-20 hours with no experience, 2-3 if thought out ahead of time

 

Supporting Lectures 

 

There are currently no lectures directly supporting this topic. All materials must be gathered through web research, however some very useful articles are shown in resources.

 

Questions and Answers

 

 

 

External Resources

 

Detecting a mobile device with Javascript - http://www.abeautifulsite.net/detecting-mobile-devices-with-javascript/ 

 

Handling touch events for mobile interface -  http://mobiforge.com/design-development/html5-mobile-web-touch-events

 

Using a different CSS for different devices - http://www.htmlgoodies.com/beyond/css/introduction-to-css-media-queries.html

 

Google Chrome Device Emulations - https://developer.chrome.com/devtools/docs/device-mode#media-queries 

 

Grading Criteria

 

Testing with https://www.google.com/webmasters/tools/mobile-friendly/ 

 

For each item found 2 points off.

 

Comments (0)

You don't have permission to comment on this page.