User Interface Personalization
The course “User Interface Personalization” focuses on adaptations that web developers can implement in web pages and web applications to suit various needs of users. Most of us are probably already aware of various types of adaptation and personalization on the web. For example, many websites show personalized advertisements, based on things that “they” know about us. This type of personalization is based on data that we have provided, for example, by visiting certain websites, by “liking” certain types of content, or by mentioning certain topics in e-mails or other content that we create.
Another type of adaptation is the phenomenon that a webpage may look differently depending on whether you are viewing it on a desktop computer, a laptop, a tablet or a smartphone. The deciding factor is, of course, the size of the screen on the device.
This is very useful, but some people need, or would at least benefit from, adaptations that go further than this. There can be several reasons for this, which can be summarized by saying that the website or application is not accessible to them. In this context inaccessible does not mean that the website or application cannot be reached due to downtime or a slow internet connection or security reasons. Inaccessible here means that there is a mismatch between your skills and abilities and the features of the website.
The goal of the course “User Interface Personalization” is to teach how to create a better match between these skills and abilities on the one hand and the website on the other.
Features of This Website
This website contains pages with a variety of HTML features:
- structural elements such as
header
,main
,nav
,section
and heading elements (h1
,h2
, etcetera), - an
iframe
that embeds a video (see Accessibility and Usability), - images and the elements
figure
andfigcaption
(see Browser Features), - a large table with
caption
,thead
,tbody
andtfoot
(see GPII Common Terms), - a definition list using
dl
,dt
anddd
(see ICT Accessibility Glossary), - lists (on several pages, but especially on the Links page),
- a form (see Contact Form),
class
,id
androle
attributes that can be used in CSS selectors and JavaScript (in addition to the elements themselves);- links to “alternate stylesheets”—especially for high contrast—in the
head
of each page; - valid HTML and CSS code, except where a specific feature prevents this (Vimeo's
iframe
code).