In one of the latest design iterations, the site logo has changed to incorporate the new Fluent UI design. The site logo has now rounded borders. Let’s do a quick design review of how this work or don’t work for some companies.
In the end, you will learn a trick on how to revert the changes, Microsoft did on the logo.
This time we take a look at the fundamentals on the page and text layout on modern SharePoint pages in communication sites. The text layout is the essential design element on web sites and the intranet. 95% of a current information system is base on just text.
First, let us define some basics on typography on the web to have a better understanding later on the available layout options we currently have.
Recently two changes have been shipped with the latest browsers versions that impact your development today too. In short, you can now better define the loading behaviour for images. It’s big news in case of performance and usability. Those changes are:
A common practice these days is to organise site collection in hub sites. It gives you a great possibility to arrange your content more dynamically than ever before in SharePoint. On specific site type, we are dealing in any SharePoint project, for example, are project sites.
These project workspaces only have a defined start and end date. A site collection like this can be useful for a couple of weeks, to month or in case of long-running projects for years. What to do when the workspace reached his end of life?
Recently many new user interface element got introduced to SharePoint that provides additional information about other services in Office 365. While you can argue this information might be valuable for users, you can also say that that information is just a consumer marketing attempt for already paid products.
In general, to keep the user informed it is a great thing to have a feature like this but from a design perspective and even end-user experience, those elements are not optimal. If this kind of information is valuable for the user inside an organisation, it is up to the organisation and not a decision made by any service provider.
To be clear, if this shows up on a free OneDrive user interface, but it is not something for a corporate environment.
You might have recognised that the workbench of the SharePoint Framework has a responsive design tester included. In this blog post, I take a look what possibilities we have to properly test the responsiveness and the user experience of a web part.
There are also some pitfalls included if you entirely rely on the integrated too.
The modern experience is responsive by default, but it doesn’t mean that your web part will be. Especially with the new team sites and communication sites, the behaviour of web parts is as tricky as it ever was. Office UI Fabric doesn’t help you to achieve a significant user experience because it is out of their scope and offers only smaller components or full-page scoped methods, but nothing in between as needed as in web parts.
The surrounding design of a web part, for example, is defined by Office UI Fabric and even the grid system is provided by that toolkit.
When you write a web part, you might worry more about how the same web part behaves in different containers already defined by the overall page design in SharePoint.
Time to show you a trick how this container pages optimisation is possible in the SharePoint Framework and show the basics.