Final Exam Materials:

Download and get to work

This is the mock-up for the final exam site.

SiteRedLines

10 Responsive Design Problems and Fixes

As more corporations and online giants turn to responsive design, it’s beneficial to understand the limitations that come with it and how to work around them.

http://uxmag.com/articles/10-responsive-design-problems-and-fixes

Feedback Form Wizard
http://www.thesitewizard.com/wizards/feedbackform.shtml

View the link to the class presentation here:

http://prezi.com/98jqvducycww/?utm_campaign=share&utm_medium=copy&rc=ex0share

Download file here

@media screen and (max-width:500px){
#mainHead, #intro, #mainContent, #socMed{
width:95%;
position: relative;
display: block;
padding:2%;
}

#mainHead article, #intro article, #mainContent article{
width: 100%;
margin: 0 0 2% 0;
padding:1.5%;
}

#socMed{
margin:0 auto 0 auto;
}

#socMed ul{
display:flex;
justify-content:space-around;
}
}

@media screen and (min-width:501px) and (max-width:800px){
#mainHead, #intro, #mainContent, #socMed{
width:95%;
position: relative;
padding:2%;
}

#mainContent article:first-child{
width:100%;
}

#mainContent article{
width:48%;
}

}

CSS Only Drop Down Menu

http://red-team-design.com/css3-dropdown-menu/

Some ideas to think about while designing your web site:

Sometimes it’s nice to go back to basics and ask fundamental questions. Today, we’re going to take a look at “what elements influence the user experience of a website?” Understanding this can make it much easier to plan your UX research and ensure that you’re examining each element to some extent and that that element is working well for your users.
The 5 elements that we’ve selected that need to be examined in a UX context are:

• Usefulness of the Website
• Adherence to Functionality
• Usability
• Influence
• Visual Design

https://www.interaction-design.org/literature/article/5-elements-of-the-online-user-experience

EXAM

Don’t forget there is an exam this Thursday October 29th.

Please arrive to class on time.

Things to study:

1. Types of CSS Selectors
2. The Acronym list from the preceding post that we went over in class.
3. You will have to write out the code (from memory) for a basic multi-column single page.
4. The semantic html tags and their usage. http://www.w3schools.com/html/html5_semantic_elements.asp