|Assignments due in one week unless otherwise stated. I may add some things during the week, so double check the schedule each week!|
Week of September 17th
I would like you to do some research on how to integrate both background images (background to a division etc) or regular
images effectively into a page that will work on all sizes of media. Then show me your results.
We are now going to move on to looking at JQuery Mobile.
Look at the examples under basic examples to get started and second group of basic examples.
The zipped examples are there and there are accompanying Smartboard pdf files that cover some of the things.
JQuery Mobile site
There are a lot of excellent JQuery Mobile tutorials at YouTube.
Experiment a little!
RWD and jQuery mobile are two ways to write code usable on mobile devices. A book I found really helpful when I was starting to learn JQuery Mobile is jQuery Mobile First Look by Giulio Bai. Look around on the web for information about it if you are interested.
You should look at my examples (I have included everything I am asking you to work with) and my accompanying pdf files examples.
First: Show me what you came up with for the background image experimenting I asked you to do.
Second: JQuery Mobile basic assignment
Week of September 11th
|Continue reading about and reading RWD both at sites and on youtube, there is a lot of
I would like you to do some research on how to integrate both background images (background to a division etc) or regular images effectively into a page that will work on all sizes of media. Then show me your results.
Your first assignment is to draw your own original layout of 8 or more boxes (include some images) and the arrangement they would have at different screen sizes and then implement your design. The current wisdom is to start out with the smaller device and move to the bigger.
Your second assignment is to make a RWD page that is inspired by the research you have done. I want something reasonably complex and it should include one or more images and a background image.
Your third assignment is to look up UX Design and send me a page explaining what you found.
Week of September 4th
|Please read some of the articles on Responsive Web Design that I have listed under links and presentations.|
Definitely listen to the first two videos I have posted under links I would also suggest looking at some other videos at YouTube and looking at my examples and the presentation.
Look at the W3 schools information on Responsive Web Design.
Find two more articles or videos on Responsive Web Design and tellme the addresses.
First: I want you to experiment with writing a page that decreases columns and changes other aspects of the page. Essentially experiment with something that would work on full screen, on a pad and on a phone.
Second: Changing layout Your next assignment is to create a page that shows the 6 boxes and their movement as the screen increases and decreases. Follow the images on the pdf.
Third: Write a third page that experiments with other layout changes that you encounter in your research. Please include an image that diminishes in size to fit the layout.