Introduction to Web Development at UNL

Skill Level: 
Beginner

So, you want to know more about web development at the University of Nebraska–Lincoln (UNL). Perhaps you are a new web developer on campus or are simply interested in how we do things. This guide will help you with some of the fundamentals.

The Essentials

Web development at UNL might be slightly different than web development elsewhere, even other universities. The following are some of the most important fundamentals for you to know.

  • The Web Developer Network (WDN) is a community of web developers at UNL. Collectively we help each other and improve the university’s web presence. Learn more about the WDN.
  • All websites at UNL are required to use the UNLedu Web Framework, which is developed by the WDN. Learn more about the framework.
  • Web accessibility (a11y) is required. All websites and web applications must be useable by people with disabilities. Learn more about accessibility.

Web Developer Network

The Web Developer Network is a group of web developers at UNL who work together, share ideas and improve the university’s web presence.

Suggested reading and links:

The UNLedu Web Framework

The UNLedu Web Framework is a package of HTML, CSS and JavaScript that all websites at UNL are required to use. The framework allows for consistent user interactions and branding across all UNL web pages and websites. The framework also provides many essentials such as a grid system for responsive design, content styles such as image styles, and widgets such as notices and events widgets.

Many web developers at UNL use UNLcms to host their websites, which is already configured to use the framework. It is important to note that the framework is built so that it can be used by any content management system or programming language and the use of UNLcms is not required (but UNLcms does make things super easy).

Suggested reading:

Web Accessibility (a11y)

Web accessibility, or making content usable by people with disabilities, is required by law. The word ‘a11y’ is the short form of accessibility and it means that there are 11 characters between the first and last letters of the word. Per the WDN’s Standards Guide - section 3.1 websites are required to meet both the Web Content Accessibility Guidelines (WCAG) 2.0 level AA standard for web accessibility as well as the Section 508 standard. It is important to note that the current legal landscape reflects the requirement of these standards. Accessibility is already baked into the global regions of the framework. All you need to worry about is what you place in the #dcf-main area.

Some common accessibility issues that should be a priority to fix include the following. Please be aware that this is just a subset of what needs to be checked. We have an automated auditing tool called UNL Web Audit which scans your sites for accessibility issues (and other things too), but it can’t catch everything.

  • Make sure all media has alternate text. For images this means providing meaningful alt text and captions for video. UNL MediaHub makes it easy to host and order captions for your videos. Web Audit will make sure that media has alternative text defined, but can not verify the quality of the alternate text. For example, it is extremely common to see placeholder alt tags which do nothing to help the visually impaired.
  • Make sure that text has a contrast of 4.5:1 to meet the contrast requirements. Web Audit will automatically test for this.
  • Make sure that interactive content such as links, buttons and form controls have textual names. It is common to see form fields without associated labels and buttons and links that have only an image or font icon but no text. Web Audit will automatically check for these.
  • Assistive technology such as screen readers can not read text in images, so avoid placing text in images. Instead, use CSS to position the text above the image wherever possible, which will make the text available to assistive technology. Web Audit can not check for this.
  • Ensure that your HTML follows correct semantics wherever possible. Use HTML regions, ensure that your document outline is correct (based on heading elements)
  • Manually test your sites by just using a keyboard; make sure that every piece of content and interaction can be accessed by just a keyboard. Also test your sites with a screen reader such as VoiceOver.

Learn more about accessibility

We can’t cover everything about web accessibility, so we have curated some materials to help you learn more:

Contributed By: 
IIM