Mobile Web Guidelines and Styles
Follow the documentation on UCSD's MWF website for HTML elements and styles.
When designing mobile web applications, follow these guidelines for the mobile decorator:
- Heading icon: The UCSD logo will always be at the top left, linking to
- Heading title: The title in the heading is the web application name and the link always takes the user to the root of your application. You specify the name and URL by editing the
This is where the web applicaition content displays. You can peruse over the following sample pages. These pages have the same HTML semantics and content but is rendered differently based on the different classes of devices.
View examples of how the MWF degrades gracefully across different device types.
The footer includes a button which links back to the UCSD Mobile home page
http://m.ucsd.edu and the copyright notice and "UCSD Full Site", linking to
If you wish to customize "UCSD Full Site" link, add the following to your jsp page's head section if you are using sitemesh from UXT:
<meta name="footer" content="News Full Site" /> <meta name="footer.url" content="http://ucsdnews.ucsd.edu?ovrrdr=1" />