Improve Posting View Navigation

1 Initial Problem

In the desktop view the posting view became crowded since the Edit Blog and Edit Posting buttons both appear in the toolbar and the toolbar is duplicated on the screen.

In the mobile view the important navigation elements are hidden first. In both views there is no quick list to navigate to single postings available.

2 Conceptual Summary

The bottom navigation bar should be removed. Instead a "Top of Page" Button or Link is provided to scroll up to the top of the page.

A Dropdown offers direct navigation to the single postings.

The mobile view offers the main navigation buttons/dropdown instantly.

3 User Interface Modifications

3.1 List of Affected Views

• Blog > Presentation > Posting View

3.2 User Interface Details

Desktop View

A Dropdown to quickly access the single postings is offered.

The duplicated navigation bar is removed, instead a Top of Page Button (could be a Link, too) is offered.

A "Next" navigation should follow the top to bottom order of the posting sorting, latest posting being on top. Clicking "Next" will work down the list.

Mobile View

The main navigation controls are provided instantly.

3.3 New User Interface Concepts

The navigation could be implemented be either using existing KS Button, Dropdown, Button combination or by introducing a new View Control combining the three elements. See also Improve Navigation / Mobile View request for learning modules.

The "Top of Page" scroll Button or Link could, if accepted, be implemented on other views using Page Editor content, e.g. learning module or wiki pages.

3.4 Accessibility Implications

The "Top of Page" behaviour should be assessed, if implemented.

4 Technical Information

No technical issues.

5 Privacy

{ Please list all personal data that will need to be stored or processed to implement this feature. For each date give a short explanation why it is necessary to use that date. }

6 Security

No security implications.

7 Contact

• Author of the Request: Killing, Alexander [alex]
• Maintainer: Killing, Alexander [alex]
• Implementation of the feature is done by: {The maintainer must add the name of the implementing developer.}

8 Funding

If you are interest in funding this feature, please add your name and institution to this list.

• …

9 Discussion

Kruse, Fabian [Fabian], 18.09.2023: Overall I welcome the suggested improvement, especially the removal of the lower tool bar and the additon of a "Back to top" button/link. I also welcome the abandonment of the "Latest Posting" button.

But, concerning the suggested Dropdown, it should be kept in mind that real-life blog titles tend not to be as short as the ones in the mockup (see "Desktop View" under 3.2 of this page). Real-life titles can be much longer (example: Modernisierung in Aktion: "Removing of Legacy-UIComponents-Service and Table“ or SIG OER lädt zum Treffen rund um Open Educational Resources in ILIAS ein). I get the impression that these longer titles would make the Dropdown visually quite unpleasant.

On desktops, the other posts can be easily accessed through the side bar (see screenshot "Current Posting View (Desktop) under 1 of this page). Not sure if duplicating the functionality would be of real benefit to anybody. Adding the Dropdown could still be an improvement on mobile screens, as it would allow for easier navigation than now.

JourFixe, ILIAS [jourfixe] , 18 SEP 2023 : We highly appreciate this suggestion and schedule the feature for ILIAS 9. Please discuss the concept of "Top to Page" in the UI Clinic to get a general concept for this pattern in ILIAS. And please move "Edit Posting" and "Edit Blog" to a separate dropdown within the toolbar. In case the Kitchen Sink provides an appropriate navigation element, please use this for the implementation. Will be discussed in the next LUI meeting. Concerning long posting titles we prefer to cut titles after a defined width by the UI Drowdown component.

10 Implementation

Test Cases

Test cases completed at 2023-10-13 by Tödt, Alexandra [atoedt]

• amended 482 : Zurück- oder weiterblättern
• 486 : Druckansicht eines ILIAS Lernmoduls anzeigen

Approval

Approved at 2023-10-12 by Brauns, Johanna [jbrauns].