Formation of Requirements for University Website Interfaces Based on Accessibility and Usability Standards / Формирование требований к интерфейсу сайтов ВУЗов исходя из стандартов доступности и удобства использования

Кирьянов Денис Александрович ORCID: 0000-0001-8502-8333 магистр, Балтийский государственный технический университет ВОЕНМЕХ имени Д. Ф. Устинова 190005, Россия, г. Санкт-Петербург, ул. 1-Я красноармейская, 1 Kiryanov Denis Aleksandrovich Master's Degree, Department of Information Systems and Software Engineering, Baltic State Technical University "Voenmeh" anmed after D. F. Ustinov 190005, Russia, Saint Petersburg, 1st Krasnoarmeyskaya str., 1 dennis.kiryanov@gmail.com Другие публикации этого автора

Previously published in Russian in the journal Pedagogy and Education https://nbpublish.com/ppmag/

Introduction

When designing the user interface of mass software, it is essential to consider the numerous limitations of the user audience, including sensory, motor, cognitive, and psychological limits.

Knowledge of these features allows you to design a user-friendly interface, minimizing premature fatigue and other cognitive load. This will eventually make the software product more attractive, functional, and convenient and increase the economic effect of its implementation, increasing user conversion.

Currently, almost every university (higher educational institution) in Russia has a website, but unfortunately, the information posted on these sites does not always meet the needs of the user audience. The basic principles of color combinations and user interface convenience are not considered when designing interfaces. In addition, very often, the features and limitations of users, including people with health restrictions, are not taken into account, which makes the posted information challenging to perceive or even inaccessible to people with disabilities.

This circumstance can be explained by insufficient analysis of the user audience, incorrect understanding of the purpose of such information resources, and ignorance of basic accessibility standards. This study is designed to eliminate this gap because university websites play a vital social role, being, in fact, a guide to the world of higher education and should be accessible to every user.

This article investigates the limitations of university website users' capabilities. Then, the requirements for the user interface are formed based on the analysis of the target purpose and audience, the requirements for the target hardware and software platform, and the consideration of the limitations of user capabilities.

1. The purpose of a university website: According to 273-FZ ^{[1, Article 29]}, the main purpose of a university website is to form an open and publicly accessible information resource.

Sites of this type contain the necessary information about the educational institution on the Internet, in accordance with ^[2], and also publish data on the academic programs being implemented, teaching staff, tuition fees, contact information, management, publication of necessary documents, and other important information for the site's target audience.

Ideally, a university's website should be an essential tool for interaction between various groups of users: applicants, students, and scientists, being a single point of access to numerous educational and information projects of the academic institution. It can be used to receive documents for admission, order certificates, provide information about admissions campaigns, class schedules, information about individual student performance, etc.

University websites are intended for use by a wide user audience, including people with health restrictions, who, per paragraph 5 of Article 15 of the 181-FZ ^[3], should be provided unhindered access to information.

2 Description of the target audience: Let's consider the target audience of university websites, which we will understand as a set of real and potential users interested in receiving information posted on its pages and ready to choose to study or work at this university.

Thus, it can be concluded that the main group of users of such sites are applicants, students, and teaching staff.

Based on the statistical data presented in ^[4], the following general portrait of students can be formed: these are, with a slight predominance, women (53%), the age of 82.4% of the students lies in the range from 17 to 26 years ^{[4, p. 184]}. 7.2% of students are citizens of foreign countries (mainly citizens of Kazakhstan, Turkmenistan, and Uzbekistan) ^{[4, p. 187]}. Most students from foreign countries are citizens of China and India ^{[4, p. 188]}.

The target audience of the teaching staff is 57.6% women, 66% of this target audience are people aged 30 to 60 years, and 73.5% have scientific degrees ^{[5, p. 92]}.

This work analyzed the statistics of visits to the websites of eight universities in Russia to analyze the behavioral factors of the target audience and determine its size and geographical features.

The list of selected universities for research is given in Table 1. Table 2 shows statistics on visits to the analyzed university sites, formed based on data provided by the company Similarweb.com ^[6] (data for December 2021).

Table 1 – List of university websites selected for comparison

Table 2 – Statistics of visits to university websites

Indicators like page views per visit and the user's time spent on the site can indicate both high user engagement and poorly structured information on the sites in question. Users may be looking for the necessary page for a long time, scrolling through 4–5 insignificant pages with irrelevant content before that.

The share of direct visits, on average approaching 50%, indicates that users purposefully visit the selected university’s site, as well as the importance and usefulness of the university sites under consideration.

Figure 1 illustrates the main interests of visitors to university websites presented in Table 1 (based on the data Similarweb.com ^[6]).

Figure 1 – Interests of university website visitors

As can be seen from Figure 1, among the interests of the user audience of university websites (Table 2), science and education, technology, news, and media can be distinguished. This means that users visit the university's website for information about educational programs, costs, and admission information.

Based on the research ^{[7, 8]}, it is also possible to form applicants’ main goals, which create a significant part of the target audience of university websites. Among the main motives for applicants are interest in the profession, preparation for entrance exams, the possibility of studying at the expense of budgetary funds, and opportunities for future employment in their specialty. At the same time, the main criteria for choosing a university are highly qualified personnel, the possibility of internships, including foreign ones, a developed material base, and guarantees of employment upon graduation.

Table 2 shows that the primary visitors to university websites are users from Russia, Kazakhstan, and Ukraine. Nevertheless, although most visitors come from Russia (on average, 91.28%), there remains a need to organize successful cross-cultural communication with users from other countries.

Gert Hofstede's theory of cultural dimensions ^[9] allows for an international comparison of the target audience by measuring the cultural values of representatives of different countries. To compare the cultural values of users from Russia, Ukraine, and Kazakhstan, the Hofstede model based on six dimensions was applied ^[10]. For comparison, Russia, Kazakhstan, and Ukraine were selected as the users of these countries, which make up the main user audience of university websites from Table 2. The results of the comparison are shown in Figure 2.

Figure 2 – Application of the Hofstede model for target audience analysis

As can be seen from Figure 2, the target audience of Russian university websites has approximately the same cultural values and behavior in general, which means choosing a single strategy in marketing and design, content placement, etc.

According to the high-power distance index, users expect to see an information resource that inspires confidence and respect for the organization. Therefore, it is necessary to place information on the pages of universities' websites that directly affects the image of an educational institution: data on leadership, quality of teaching, developments, and publications, famous graduates, reputable organizations with which cooperation is conducted, visits of officials, etc.

The average level of individualism among the target audience testifies to the awareness of oneself as "we," the desire to work in a group, to be part of something big and solid. Therefore, the information on the university's website, including graphic material, must be submitted from the point of view of the importance of common goals and interests, maintaining traditions, and emphasizing the importance of teamwork.

The average level of the masculinity index shows that the target audience is aimed at respecting cultural values and honoring relationships (respect for traditions, mentors, and elders).

The high level of uncertainty avoidance among the target audience suggests that visitors are somewhat conservative, so the design should be traditional, similar to other university sites, so as not to cause irritation.

The high level of long-term orientation reflects the target audience's desire to plan their future after graduation. It is important to post information about the future profession, the path of development, career growth, development in the scientific field, etc., supported by live examples.

The assumption index's low level indicates the target audience's commitment to strict social norms.

3 Basic requirements for the hardware and software platform of university websites: The hardware and software platform, according to GOST R 53622-2009 ^{[11, clause 3.1]}, is a single complex of computer equipment and system programs.

Considering university websites' hardware and software platforms based on the purpose of such information systems, we can conclude that they are designed to store, transmit, and display information for their users.

Such a platform also implies the necessary automation of the processes of collecting and entering information and processing the received data for subsequent use and must meet the requirements imposed by legislation for such software [1–3, 12].

From the point of view of the functioning and structure requirements, a university website hardware and software platform is a server or a group of servers on the Internet that host databases, a content management system, and software responsible for presenting data to the end user.

Such sites' hardware and software platforms should be able to process requests from users of mobile and stationary devices, have a mobile version (adaptive design), and a version for the visually impaired. Also, the functionality for changing and supplementing sections of the site should be implemented.

To ensure the necessary level of information accessibility and ease of use, the university's website must comply with GOST R 52872-2019 ^[13], the WCAG 2.1 standard ^[14], and GOST R ISO 9241-20-2014 ^[15]. These standards largely duplicate and complement each other, regulating the requirements for perceptibility, manageability, safety, clarity, and reliability.

The HTML and JS code of university websites should be error-free. The page processing capabilities of various user applications, including assistive technologies, should be provided, and maximum compatibility with existing and developing user applications is also required. The site must use a secure HTTPS connection to ensure safe data transfer.

4 Approaches to interface design that minimize the limitations of users of university websites

4.1 Main limitations of features and their description

When visiting a university's website, users may encounter numerous restrictions, which are a serious obstacle to obtaining the necessary information.

Undoubtedly, the most vulnerable in this regard are users with disabilities: vision, hearing, and musculoskeletal problems. However, poorly designed sites can also create additional restrictions for other user groups.

The following main problems can be distinguished that prevent the use of the university's website to varying degrees ^{[16, p. 11–13]}:

1. cognitive impairment, i.e., difficulties in perceiving information: problems in finding and allocating useful data, concentration, identification of important objects, and decision-making;

2. motor disorders: difficulties when using input and control elements (for example, the site is not adapted to the use of the keyboard; you only need to use the mouse);

3. hearing impairment: the user does not hear the audio content, and the text version of this content is not provided;

4. visual impairment: the user does not see graphic materials, and their text description is not provided; the user has color blindness or reduced vision, and a special version for the visually impaired has not been developed; the posted content is not adapted to the use of special screen access programs that read the text;

5. technical limitations: the site interface is difficult or impossible to use on some devices (mobile devices, displays with a small screen), and the site works slowly (low performance of the software and hardware platform, instability under heavy loads, etc.).

Next, we will consider the most well-known and often used approaches to designing interfaces, which are proposed to be used in developing interfaces for university websites. These approaches make interfaces more convenient without overloading the user's short-term memory or causing premature fatigue.

4.2 Hick's Law: When developing approaches to reducing the cognitive load on the user, the results of research by William Hick ^[17], called "Hick's Law," are often taken into account.

According to this law, the time it takes a person to make a decision increases logarithmically with increasing choices. Hick's research was subsequently continued by other researchers ^{[18, 19]}.

The primary meaning of Hick's law in relation to the design of web interfaces is that they should be as simple as possible: they do not need to be overloaded with data, but on the contrary, it is necessary to use the separation of complex elements into simpler ones, reducing choice; apply logical grouping, simplifying the process of selecting options and making navigation and use of the site user-friendly, reducing cognitive load and attention. For example, according to Hick's law, one menu with ten items is better than two menus with five in each.

4.3 Gestalt principles: Gestalt theory, which appeared in the 1890s as a response to the philosophy of atomism, was subsequently developed by German psychologists in the first half of the 20th century.

Currently, the basic idea of Gestaltism is widely used in interface design, according to which organized objects are perceived by the human brain faster as a whole than its components.

The following main gestalt principles can be distinguished [20–22]:

1. the principle of similarity: objects that have common visual characteristics (or look the same), such as shape, size, color, texture, meaning, or orientation, are perceived as connected groups or blocks; at the same time, color is a stronger property of grouping than shape and size, and among the forms, the simplest is chosen;

2. the principle of proximity or adjacency: objects that are closer to each other are visually perceived as a coherent group of objects;

3. the principle of continuity (continuation): points connected by straight or curved lines are seen most smoothly, i.e., the elements of a line or curve seem more connected to each other than elements arranged randomly, and the perception of visual information is continuous;

4. the principle of closeness: a group of elements is often perceived as one recognizable shape or figure, even if some of the information is missing;

5. the principle of symmetry: symmetrical elements are perceived as a single whole.

As follows from the above gestalt principles, the main idea of this theory is the grouping of objects based on visual similarity and location, based on the cognitive and psychological characteristics of the user. For example, the proximity principle is applied when designing navigation panels, cards, galleries, banners, lists, and the main text: connected elements are located as close as possible, and disconnected elements are located separately. The principle of symmetry is widely used to reduce cognitive load on content-loaded pages, lists, and navigation. Symmetry creates visual comfort and allows you to concentrate on the necessary information ^[23].

4.4 Miller's Law: In 1956, George Miller described a pattern ^[24] in which a person's short-term memory often cannot recall and repeat more elements (binary digits, letters of the alphabet, monosyllabic words). Miller associated this feature with the fact that a person paraphrases the information received by translating it into their inner verbal language.

The researcher also found that with the use of grouping, the possibilities of short-term memory increase.

This feature, called "Miller's Law," is often used to reduce the cognitive load on the user. At the same time, grouping, fragmentation, and presentation of data in a user-friendly template or format are used. For example, phone number formatting, credit card formatting, and text selection in frames are very often used.

4.5 Jacob's Law: Jacob Nielsen revealed a certain pattern of user behavior ^[25], which is called "Jacob's Law" and is widely used today. Nielsen noted that users spend most of their time on other sites, which means that they prefer other sites to work as well as all other sites they are already familiar with.

Visitors' user experience conditions this law and requires following generally accepted patterns in the design of interfaces to reduce the time it takes to get used to the interface and keep the user on the site's pages as long as possible.

In his main works ^{[26, 27]}, Nielsen explores the usability and accessibility of interfaces, considering such indicators (heuristics) as the main indicators of a qualitatively designed interface:

1. Visibility of the system status: the system should inform users about what is happening through appropriate feedback within a reasonable period of time;

2. the coincidence between the system and the real world: the language should be understandable to the user (familiar phrases and concepts), the information is displayed in a natural and logical order;

3. user control and freedom: reversibility of user errors, their easy correction;

4. compliance with standards, i.e., platform and industry agreements;

5. error prevention through well-thought-out logic and conditions in the interface;

6. recognition, not recall: the cognitive load on the user should be minimized, and the information necessary to use the design (for example, field labels or menu items) should be visible or easily accessible if necessary;

7. Flexibility and efficiency of use: users should be able to configure and automate routine operations;

8. aesthetic and minimalistic design;

9. easy error diagnosis: error messages should be expressed in simple language (without error codes), accurately indicate the problem, and constructively offer a solution;

10. help and documentation: it is best if the system does not need additional explanations, but documentation explaining the functionality should be provided if necessary.

5 Checking university websites for compliance with accessibility standards

There are many different kinds of tools for assessing the accessibility of a website's web interface ^[28]. Let's use the "WAVE" tool ^[29] to check university websites from Table 1 for compliance with WCAG standards. The results of the check are shown in Table 3.

Table 3 – Checking university websites for compliance with WCAG standards

Table 3 shows the results of checking the main page and the version for the visually impaired (when multiple design themes were selected, the default theme was selected: white background, black text). Based on the data obtained, we can conclude that even the version for the visually impaired is poorly optimized for use by people with disabilities.

Thus, the high number of errors associated with the contrast of the text suggests that visitors with visual impairments may not read some text, even in a special version for the visually impaired. It is worth noting that the subsequent results of checking the usual versions of sites show an even greater number of accessibility errors related to the contrast of text and background.

Errors related to the absence of the "alt" attribute indicating that the contents of graphic materials will be inaccessible to screen readers or all users when the image itself is unavailable. Each image must have an "alt" attribute and provide alternative text.

Similarly, the absence of an associated text label (the "label" element) indicates that the function or purpose of this control will not be presented to users of screen readers.

The detected accessibility errors indicate that if a link or button on a website page does not contain text, then readers will not recognize their function or purpose and may mislead those who interact with the interface via the keyboard.

ARIA [30–32] (accessible rich internet applications) is a technological standard developed by the World Wide Web Consortium to enable the full use of the Internet by people with physical disabilities (impaired functioning of the visual organs and musculoskeletal system). It is a set of special attributes that can be added to any markup but is especially often used in HTML. The presence of violations of the ARIA standard indicates possible problems with the interaction of auxiliary devices with the site interface and the potential limitation of the capabilities of users with disabilities.

The detected warnings mainly relate to poor formatting and text presentation on the pages of the analyzed sites.

Analyzing university websites for compatibility with accessibility standards allows you to identify the most common errors and devise ways to eliminate them when designing their interfaces.

6 Basic requirements for the user interface of the University website

6.1 Accessibility requirements

As mentioned above, the interface of a university's website must comply with legislation and accessibility requirements, consider user sensory-motor and cognitive-psychological limitations, and meet users' needs.

Based on GOST R 52872-2019 ^[13], the WCAG 2.1 standard ^[14], and GOST R ISO 9241-20-2014 ^[15], we formulate below the basic requirements for the accessibility and ease of use of the University's website.

To ensure the perceptibility of information, a text version of all non-text content should be provided, considering the target audience's characteristics. So, for example, a full-featured version of the site for the visually impaired should be provided, with a large font, in black and white tones, if possible, hints or simplified terms, conditional signs, and voice should be provided.

It is necessary to ensure that all functionality can be controlled only using the keyboard and the mouse or other methods. Users should be able to adjust the browser window size without losing the site's functionality, i.e., the design should be adaptive. The functionality of controlling the playback of audio and video content posted on the site should be provided: volume control, shutdown, and pausing. The university's website should have a navigation menu, and the functionality of data search and determination of the current position on the site should be provided.

When placing audio and video content, it is necessary to avoid frequencies that can potentially cause visually induced seizures (no more than three flashes per second) and loudness that can harm hearing.

To better understand the information posted by users, it is necessary to make the entire text easy to read and understand: abbreviations should be deciphered; rare words and phrases should be explained or should not be used. It is necessary to ensure the predictability of the display of information and the behavior of the site as a whole: shifting the focus to another component should not cause feelings of loss of orientation on the page and changes in its meaning; the user interface should change only at the user's request; uniformity in navigation and component names is required.

In addition to the above, special functionality should be provided to prevent or correct user errors when entering: detecting water errors in automatic mode, hints and error messages, and instructions explaining the rules for working with the site.

The user should have the "right to make an error": input fields should be checked both on the client and on the server side, and a mechanism for changing the entered data should be implemented when filling out step-by-step forms, it is necessary to save each step so that the user does not lose the entered data by accidentally closing the tab with the site.

6.2 Requirements for the placement of content and structural elements. The main goals and needs of applicants were identified from the analysis of university websites' target audience. Accordingly, when designing the main page, information blocks with information about admission (links to bachelor's, master's, postgraduate studies, etc.), the admission process, cooperation with large companies and employment opportunities in them, foreign internships and student exchange, and teacher qualifications are required.

This information should be clearly visible and highlighted, and links should lead to pages with well-structured information relevant to the title.

When analyzing university websites (Table 1), it was noticed that many of them rely on showing university news. Information about educational programs, which is the main need of visitors, is presented on secondary pages and is not always easy to find. This fact reduces visitor conversion, at least when recruiting for paid programs ^[33].

Following Jacob's law, the interface and structure of the university's website should be similar to other sites in this area. The analysis of university websites (Table 1) concluded that the main menu should be located in the header; in the upper right corner, there should be a button to enable the version for the visually impaired and a language selection button. Also, you need to place a search form in the site header (it can be enabled by the corresponding button). Such placement of controls will be most familiar to the user audience and will reduce the time spent getting used to the interface.

The information on the main page should be presented in a single-column template, divided into information blocks. A slideshow or video can be integrated (such blocks on the sites considered are usually immediately after the header). The main menu should be duplicated in the site's footer.

6.3 Requirements for compliance with the color scheme and text submission: When creating content and choosing the site's color schemes, Hofstede's analysis of the target audience and the basic principles of color selection should be considered.

Blue or blue tones are preferred as the main colors, as they symbolize trust, loyalty, wisdom, intelligence, faith, and truth. Such colors produce a calming effect associated with technology and modernity ^{[34, 35]}.

The page's main color should give the entire page its tone. The secondary color should complement the main color and be close to the main one. The highlighting color used to highlight certain areas on pages should be more contrasting than the primary and secondary and should be used in moderation ^[36].

To reduce premature fatigue of the user when reading the posted information, preference should be given to dark blue or black for the main font. A line of text should contain 50-70 characters. To keep the view on the text column of the page and eliminate involuntary translations of the view to neighboring columns, the size of the fields must be at least 10% of the width of the text line. Inter-characters and line spacing that are too small are uncomfortable for the user and should be avoided when developing a website design ^[37].

When designing a university website, it is also necessary to follow the other principles discussed above (Hick and Miller's laws, gestalt principles, Jacob's heuristics): apply separation of complex elements into simpler ones, simplifying the selection; use data fragmentation and formatting; handle user errors, etc.

Also, it is worth paying special attention to the development of a version for the visually impaired since, as the study conducted within the framework of this work shows, errors in the availability of content in such modes were found on all analyzed university sites (Table 1), which makes it difficult or even impossible for the corresponding group of users to use these sites.

Conclusion

In this paper, it was shown that a well-designed interface of a University's website should comply with legislation and accessibility requirements, take into account sensory-motor and cognitive-psychological limitations of users' capabilities, and meet their needs.

The analysis of eight university websites revealed the main interests, geographical features, and behavior of the user audience, and the subsequent verification of compliance with the accessibility requirements of versions for visually impaired sites revealed numerous violations, which once again confirms the relevance of the topic of this study. Also, it can be concluded that the methods of organizing content on the analyzed sites do not meet the requirements of the main user audience or applicants, which may slow down the return of capital invested in the development.

The paper describes the main possible limitations of users of the university's website: cognitive impairments (difficulties in perceiving information), motor impairments (the site is not adapted to the use of controls and input), hearing and visual impairments (lack of text accompaniment of media files), various technical limitations (low productivity, inability to use on mobile devices).

The paper concludes that to adapt a University's website to the limitations of users' capabilities, it is necessary to follow basic practices such as Hick's Law, Gestalt Principles, Miller's Law, Jacob's Law, and Heuristics. Based on these practices, the basic requirements for the user interface of the University's website are formed.