Supporting Information

PageBuilder Best Practices

Guidelines on how to create good user experiences with PageBuilder on WOL


This page identifies some key ways to help you produce high quality, organised, web-pages using PageBuilder.

If you would like more specific advice on how to get the most out of the various PageBuilder widgets, please view the PageBuilder Widget Guidelines.

Best Practices

Search engines look for information towards the top of the page to display alongside the results returned to their users. Good Search Engine Optimization (SEO) requires clear, deliberate, content (like an introduction or overview) to be one of the first pieces of content on the page.

Think about the type of search results your page should show up in, and the description that might accompany the page title on a search results list. Try to incorporate this into the body of the content and try not to cover too much on any single page.

Too much, varied content can overwelm the user. Consider the primary goal of the page and organise your content around that goal. 

Outdated content and images negatively impact the user experience by causing confusion on whether any information is up to date and can be trusted, as well as negatively impacting the relevance and timeliness of the page. Images that include old screenshots of WOL will no longer be relevant and will not support users.

Audit your pages and remove or update older, no longer relevant content. Ensure all images are displaying correctly. For journals with frequent updates the pages should be audited and updated as often as needed.

As with outdated content, broken images and links create a frustrating and confusing user experience. If a user finds a broken link, taking them to a dead-end, they are more likely to leave the site resulting in loss of usage.

Audit all homepages and fix broken images and links.

The new default styling for Wiley Online Library and its hubs utilizes a standard set of fonts, colors, borders and layouts. Content that has been copied from other software into pagebuilder widgets can overwrite the default styles resulting in an inconsistent design that creates an inconsistent experience, can harm the user's trust in the site, and give an unprofessional appearance.

Tip: Create an empty rich text widget and replace the content in a linear, single column format. On a windows PC, you can copy the text from any source and paste it into a Rich Text widget using the ‘CTRL + Left Shift + V’ command to paste the text without the unwanted styling. If this isn’t possible, please select all the content and click the small rubber (eraser) icon in the rich text editor to reset the formatting. Then highlight the individual headings and use the style dropdown to reinstate heading styles.

If you have more general style requirements, please use your point of contact at Wiley to make a suggestion and we will do our best to accomodate it. 

If you are familiar with HTML, please ensure there is a single H1 on your page that articulates the pages purpose. IF the page has multiple functions, like a Journal Home Page, please clearly lable your page sections with second and thrid level headings. Try not to skip heading levels or have multiple level 1 headings on a single page. 

Breaking the center well (main column) into two-columns interferes with the page readability and responsive design flow when the page is viewed on different devices (mobile instead of a desktop computer). This layout should be avoided unless vital to your content strategy.

Be sure to modify the layout widgets to utilize the full width of the center well​ (main column).

Some aspects of your journal or hub will continue throughout multiple pages. When editing these widgets, be sure to begin editing at the correct scope so that your changes are reflected across multiple pages.

If you forget to do this, you can always 'reset' the widget to the higher scope. Then go back into editing at the correct scope.

If you are unclear on which scope to make a change, please contact support. Making changes at the wrong scope can affect the entire site, not just the page you were working on.