Question:
Our Mavim Portal users visit the Mavim Portal on different types of devices; each with different screen resolutions. For some users; the content is not readable. How can I make sure that this is as easy to read as possible for as many people as possible?
Answer:
The Mavim Portal was built with a Full HD (1920 x 1080) resolution in mind and in most cases the content is easily visible at this resolution. Still; it may happen that your users visit the Portal on devices with a lower resolution or that you want to display a lot of information in one screen.
In this example; the actual content consists of two charts. A home page on the left and a gray/blue chart on the right. If you look closely you can see that the information uses only a limited part of the screen:
To make the Mavim Portal suitable for as many screen resolutions as possible; we recommend doing the following:
- Make sure the Visio charts are the right shape.
- Set up the Mavim Portal so that there is sufficient space for the content.
- Explain to users what the optimal settings are.
We will elaborate on these tips in more detail below:
1. Make sure the Visio charts are the right shape
This is the most effective way to make the best use of screen space.
The Visio charts in Mavim can be displayed on half a screen; or on a whole screen:
-------------------Half-screen ------------------------------------- Full-screen------------------
As you can see in the example above; the blue/gray chart is easy to read in both variants. In the full screen; there is white space on the right and in the half screen; there is white space at the bottom. The start navigation you see on the left in the second image is less optimal in shape: It is squeezed together when displayed in half-screen. As the administrator of the Mavim Portal; you have no influence on how users of the Mavim Portal view the content. Therefore; you need to take both scenarios into account.
By using the correct shape; you can save space in these areas:
The optimal shape of a Visio chart follows approximately a 4:3 aspect ratio. Thus; the diagram should be slightly wider than tall; as you can also see in the example above.
2. Set up the Mavim Portal so that there is sufficient space for the content
You can also save space at the top of the page. We're going to look at this section now:
\
Go to Dashboard > Lock icon > Mavim Portal Administration > General to adjust the following settings:
Then click Update and refresh the Portal.
As you can see; the white top bar with the logo and the line "Published on date in version name" are now no longer visible:
Focusweergave:
The Focus view toggle button can be used to show or hide the tabs for any given topic. Note that switching to a new topic will reset the view to show tabs once more.
By adding &focus=true after the homepage URL; a homepage will be shown directly in the focus view (for example: https:/<portalURL>/Portal/Topic?webdcv=w28d10c173v1002&view=Description&source=d10c173v1002&page=0&maximize=true&latest=true&focus=true )
Then; by using the other settings in the General tab; buttons that are not used can be hidden. While this does not directly affect readability; it can make it easier for the user to focus on the content.
3. Explain to users what the optimal settings are.
Does the Portal still seem unappealing on a particular user? If so; we recommend taking a look at the user's settings. In the example below:
- The screen resolution set to 1280x720; while 1920x1080 is recommended.
- The zoom of the browser set to 125%.
- The favorites bar enabled.
These non-optimal settings cause scroll bars to appear and part of the diagram to fall off the screen.
You can check the browser's zoom factor here:
We recommend the following settings:
- Browser: A modern browser such as Edge; Chrome; Opera; Firefox or Safari. Please note that Internet Explorer is no longer supported.
- Screen size and sharpness: On small netbooks; simple tablets or older systems; small text can be more difficult to read.
- Resolution (Display settings): Minimum 1920 x 1080.
- Text size (Display settings): Maximum 125%.
- Zoom factor in the browser: 100%
- Favorites bar and other toolbars: Disabled
- Display: Maximize; full screen or app.
Advice: In Microsoft Edge it is possible to install websites as apps. Apps are displayed as icons in the Windows start bar and can thus be opened easily by clicking on that icon. Once opened; the app has only a small menu bar and no address bar; favorites bar or other toolbars:
Users can create apps by navigating to the Mavim Portal home page and then choosing Apps > Install this site as an app: