Mobile Web Design
3 credits
| Both HTML pages are valid and use proper semantic tags | 15 |
| Both CSS files are valid | 10 |
| All required elements are present on both pages | 10 |
| Page has a pleasant, designed appearance | 20 |
| The fixed layout page is fixed | 20 |
| The dynamic layout page is dynamic | 25 |
| Total | 100 pts |
to create fixed and dynamic css layouts for desktop displays
For this lab you will need to create two html pages, each with it's own external CSS stylesheet. Both page's content will need to consist of a main header, a top navigation section, a left sidebar, a main content area, and a footer. The actual content "text" in each of these areas can just be Lorem Ipsum sample text of appropriate length. The html and css code must be valid. You html code will be checked to make sure that the tags that are used are semantically appropriate. Both pages should render with a pleasant, designed appearance at desktop resolutions from 800x600 pixels and higher.
One of your two html/css page combinations should render in the browser at a fixed width. When the browser that is displaying it is resized the page's content should not be altered. Name your fixed width html page fixed.html and name it's accompanying stylesheet fixed.css
The second of your two html/css page combinations should be called dynamic.html and dynamic.css and should render in the browser with a dynamic layout. This dynamic layout can be fluid/liquid, elastic, or any combination that you feel works well for your design, it's your choice. When the browser displaying the dynamic page is resized the page should change as the size changes.
If you know or have read about responsive design, this is not what I am looking for in this lab. There should not be any specific page size breaks in the content's layout.
