Introduction to Website and Web App Development

Universal Design


Beyond creating a website, web designers must create websites that people want to use and are able to use. This comes in two forms: usability and accessibility. Usability refers to the experience of using your website - is the layout logical and easy to understand, does it meet the needs of your users, and does it prompt them to take the actions you want to take. User Experience Design is an entire field, of which web development is only a part of it. Think about this video:

Think about how the infusion center was designed with the people who would be using the center - the patients and the staff. In web design, we take a very similar approach - we design for the users we want and the tasks we want them to do, whether it’s learn about us, buy something, or engage in social media.

Accessibility is the second part of this puzzle and defines the work that is undertaken to ensure that a website is accessible to all, including those with unique needs. This may include screen reader or assistive device support, or support for neurodiverse individuals. Usability and accessibility go hand-in-hand in assuring websites are available to all.

The Myth of Average

Semantic styling is an accessibility requirement. But it also brings us things like the “Reader Mode” in your browser which makes reading easier. Captions and transcripts are useful for people with hearing difficulties, but also with attention difficulties or ESL students or for people who just prefer to read. Access is a “minimum threshold” - while we make sure all children have access to all materials. But we don’t tend to tailor materials to the needs of each student, which is something that technology, combined with our wealth of digital resources enables us to do. When we make adjustments for students with disabilities, we tend to do it to provide students with disabilities with an “average” classroom experience. As Harvard researcher Todd Rose points out, there is really no such thing as the “average student”:

In the next section, we’ll talk a bit more about accessibility. But let’s look at captions for one example. Captions, by law, are required for students who are d/Deaf or hard of hearing. However, any people use captions at gyms and restaurants, (back when we could all go to those places), to follow along with a TV in a crowded environment. Captions also have tremendous value for students with autism, ADHD, Down’s syndrome, and English learners. The addition of captions makes the video accessible to a group that didn’t have access before, but it also makes the experience better for everyone if students are shown how to leverage these tools.

This is one of the key principles behind Universal Design for Learning - “designing for those on the margins improves the experience for all”.

Universal Design

Developed at NC State University by the late architect Ronald Mace, founder of NC State’s Center for Universal Design, Universal Design principles aimed to “be applied to evaluate existing designs, guide the design process and educate both designers and consumers about the characteristics of more usable products and environments.” UD principles are widely accepted in engineering and ICT fields as the basis for user experience design and for creating experiences that are usable by all. Again, while we tend to construct for our own needs, Universal Design forces us to consider other perspectives around seven principles:

  • Equitable Use
  • Flexibility In Use
  • Perceptible Information
  • Tolerance for Error
  • Low Physical Effort
  • Size and Space for Approach and Use

While some of these items clearly don’t apply to a virtual world, reviewing the full list of Universal Design Principles can be helpful in thinking about how to design user experiences for all.

Universal Design for Learning

We know that all students learn differently. Universal Design for Learning, a framework designed by Anne Meyer and David Rose that emerged from Universal Design principles, supports teachers in designing high-quality learning experiences for all learners. While this includes accessible content, it is much more. UDL is designed to support all students, presenting materials in multiple ways, giving students flexibility to interact with the material in the way that works best for them, and provides for different ways for students to express their knowledge. The intent of a UDL classroom is inaccurately summarized as an “IEP for all students”, providing each with the supports and accommodations they need, which can reduce stigma for all students and provide them the tools they need.

UDL is designed to improve teaching and learning for all students based on brain science. The framework is based on the idea that there are three areas of the brain key to learning:

  • Affective Networks that govern interest, effort, persistence, and self-regulation.
  • Recognition Networks that govern perception, language, and comprehension.
  • Strategic Networks that govern physical action, expression, communication, and executive function.

For web designers, UDL is a great framework to use to for designing engaging web-based activities.

The UDL framework recommends providing multiple means of:

  • Engagement. Specifically, UDL recommends providing student choice and autonomy in assignments and instructional materials, ensuring that instruction has perceived value and relevance for students and that threats are minimized. UDL also recommends providing options for sustaining student effort including high-salience goals, fostering collaboration and community, and increasing mastery-oriented feedback.
  • Representation. In addition to providing accessible content, UDL recommends that content is represented in multiple different means (i.e. video, audio, reading, and graphical), that vocabulary is made clear, that multiple media types are used, and that content is framed in the context of both existing background knowledge and generalizability.
  • Action and Expression. In addition to allowing students the flexibility to express their knowledge in different ways, UDL recommends providing students options for fostering executive functioning including supporting goal setting, planning, information management, and progress monitoring.