Project

General

Profile

Actions
Copy link

Task #3700

open

LibeOffice Help redesign/evolution

Added by Olivier Hallot 5 months ago. Updated 4 months ago.

Status:
In Progress
Priority:
Normal
Assignee:
Juan José González
Target version:
-
Start date:
2023-11-22
Due date:
% Done:

0%

Description

LibreOffice Help was ported to Web pages to benefit of the modern browser technology for a better user experience.

The original design preserved the layout of the old Help application (which was a special configuration of LibreOffice Writer).

The Objective of this ticket is to bring the HTML help with further improvements, such as

  1. Draft a modern layout mockup for the help.
  2. use modern CSS techniques (grid, responsiveness, form factor,and others)
  3. Suggest improvements in colors, fonts, accessibility and usability
  4. Compliance with pages dark mode
  5. Clean, secure and refactor a few javascript pieces
  6. improve page navigation (index for long pages?)

Improvements can go to Help master branch as soon as they are ready.

Files

Download all files
Screenshot 2023-11-24 at 9.57.25.png (689 KB) Screenshot 2023-11-24 at 9.57.25.png Juan José González, 2023-11-24 17:00
Screenshot 2023-11-24 at 10-00-25 LibreOffice Help.png (1.79 MB) Screenshot 2023-11-24 at 10-00-25 LibreOffice Help.png Juan José González, 2023-11-24 17:00
Actions
Copy link
 #1

Updated by Olivier Hallot 5 months ago

  1. SEO techniques are welcome as well
Actions
Copy link
 #3

Updated by Beluga Beluga 5 months ago

Olivier Hallot wrote:

  1. Draft a modern layout mockup for the help.
  2. use modern CSS techniques (grid, responsiveness, form factor,and others)

Note that the current site already uses grid and is responsive. The only problems regarding responsiveness are some tables, mainly on ScriptForge pages. Some CSS would need to be written for a couple of design approaches regarding them.

  1. Suggest improvements in colors, fonts, accessibility and usability

Are there any known accessibility problems on the current site?

Actions
Copy link
 #4

Updated by Beluga Beluga 4 months ago

I simplified the layout with https://git.libreoffice.org/help/commit/25f39b53fb292ec90368f2afd3678884a1a8bb27 and it can be seen on https://help.libreoffice.org/24.2/en-US/text/shared/05/new_help.html

Regarding future work, about the header, in your screenshot the Module & Language dropdowns are on the right, but the donation button has disappeared from the header. All three elements would only fit there on wide screens. With 1080px wide (tablet landscape), they would not all fit to the right. We need to think about this more, where to place the elements on the different screen sizes.

Actions
Copy link

Also available in: Atom PDF