Mobile

Mobile Websites  |  Mobile Applications

 

The guidelines below are intended to assist Web developers in preparing mobile-friendly Web content. These guidelines should be considered an addition to the previously established guidelines and requirements for the Web.

The University has developed a website for mobile users. To be included in the mobile site, email the Web Team.

 

Mobile Websites

Our recommendation is that any Web project be designed according to responsive design principles in the hope that a single website can be produced to serve both full and mobile browsers. If this is not an optimal solution and it is determined that a dedicated mobile site is required, consult the following guidelines.

Developers might notice that mobile-friendly sites and accessible sites have many common features including useful ALT text, single column design, no frames, no pop-ups, no Javascript and no dynamic menus.

Images

  • Minimize the use of images. If you must use them, make them relevant and supply meaningful ALT text so that mobile devices can use the text descriptions.
  • Make images smaller than 100 pixels. Specify the image height and width in the source code.
  • Don't use background images on your mobile pages.

 

CSS

  • Use external style sheets to control presentation.
  • Ensure that contents are readable without style sheets.
  • Use the link element to link to an external style sheet. Some handhelds don't recognize @import or @media.
  • Keep the CSS simple and remove extraneous styling information.
  • If you put the mobile stylesheet after the screen stylesheet in your code, then use "display: none" for whatever you don't want going to a mobile device.

 

Forms

  • Limit the use of forms (particularly text elements). It is difficult for mobile users to input many characters.

 

Things to avoid

  • Frames
  • Image maps
  • Tables
  • Pop-ups
  • Dynamic effects that specifically require mouse or keyboard for navigating

 

Back to Top

 

Mobile Applications

User Experience

The University Communication Standards Committee (UCSC) oversees the official presence of The University of Texas at Austin on all mobile application platforms (a.k.a., “app stores”). To have a mobile application considered for publishing as part of the official university presence, send an email to UCSC to initiate a review of the code, content, art and promotional material for accessibility, trademarks, branding and other considerations.  We also need to see a maintenance plan including contact information for the developer and a backup in case a bug is identified and/or the app breaks due to changes in the Operating System.
 

Contracts

  • If your app will be developed by a third party vendor, it will require an official contract with the vendor and the University.  That contract should include some provisions for maintenance and updates through the life of the app.  We see a major update each year and several minor updates from both major OS (Apple and Android).  Any update could cause an app to stop functioning or require changes in design. 
  • If the cost from the vendor is higher than $5,000, the contracts office is likely to ask you to conduct an RFP (which takes 4-6 months) or justify a sole source agreement. 
 

IT Policies

The app will need to be tested and approved by the UT Information Security Office for security and privacy scans as well as the Accessibility team for mobile app accessibility scans.
 

Licensing

If your app is being developed and published by a third party vendor, you may choose to either use the official UT app store licenses or your vendor’s own developer’s licenses. 

If you use ours:

Pros

  • Your app would appear next to ours when users search for “University of Texas”
  • Your app would appear to be officially sanctioned by the university
  • Your app may get some additional promotion on our website

Cons

  • All updates would need to go through us and we would submit them to the app stores on your behalf – eventually (and soon) we will be unable to sustain this model for free and will instead move to a cost recovery model and charge a small fee for updates to users of our app store licenses

If you use theirs:

Pros

  • Your updates will all go through your vendor

Cons

  • Your app would appear to be developed by a third party and not UT
  • Your app could appear to some users as “not official”

 

Branding

If you use the official UT app store licenses, you are required to use our mobile app icon design template, described below.  This ensures that all official UT apps have a common icon, indicating they are approved and tested to meet all UT policies, standards and guidelines.
 

Mobile Application Icon Guidelines

Please note, the UCSC will share exact specifications and a pre-approved template on request.

Requirements

  • Orange border as demonstrated in official UT app and template
  • White background as demonstrated in official UT app and template (when background is visible)
  • No gradient across icon to denote 3D “button” shape (will be removed in current official UT app)
  • All text must be demonstrably legible when used on each of the top ten most common handheld mobile devices, as per current Google Analytics traffic reports for utexas.edu and related domains
  • In cases where an icon or image requires additional copy:
    • Benton Sans is only approved font (license may be supplied as part of management fee, or can be purchased by app creator)
    • Font color must be official UT orange as defined under current brand guidelines and accessibility requirements
    • Copy must meet legibility requirement
    • Use of pre-existing icons or marks must be approved by the VP or dean of department or CSU that owns any included mark, as well as the Office of Trademarks and Licensing
  • Addition of copy to pre-existing icons or marks must be approved by the VP or dean of department or CSU that owns any affected mark, as well as the Office of Trademarks and Licensing
  • Every element of an app icon -- including marks, colors, images and copy -- must relate specifically to the CSU that has created the app and/or the app's intended audience or use

Recommendations

  • All copy and design elements should be centered within the border (no requirements regarding margins); alignment along the sides is discouraged
  • Use of photography is discouraged if alternatives are available and meet all requirements
  • Use of colors that pair well with the required orange border is encouraged -- but not required

Examples

 

Back to Top