[[TOC]]

Testing must be done after any changes done on the website. these changes include:

• Adding/Deleting a page
• Adding/Deleting content on a page
• Adding/Deleting Webflow components
• Changing effects
• Changing classes

In order to test properly, it is required to follow these steps:

It is important to understand what will affect our changes. When modifying classes, it is important to understand that these classes can be used in more than one place.

As an example, a menu contains menu items. If these contain an effect and the effect is modified, Testing phase must take into account that all these menu items are working in the expected way.

A helping tool for this is to check under the Styling Selectors toolbar for the classes we modified, and see in which other elements/pages it is being used and check there.

First step is to verify if everything looks fine from the designer view, as well as the preview. Content here must look fine before publishing the website.

1. Open the published website in a web browser. test changes with the screen as maximized as possible to view it in wide-screen desktop view.

2. Lastly, start with the browser in maximized window but keep re-sizing it from big to small. look for inconsistencies, specially in spacing, content stacking on top of each other when not needed, etc.

1. Open the inspector in the web browser and choose a tablet device, to see changes as if you were using a tablet.

2. Open the inspector in the web browser and choose a phone device, to see changes as if you were using a phone. Use same steps as previous bullet point.

3. Check other pages to see if there aren't other alterations. When modifying things such as effects, classes, Webflow components, other pages could be altered if things were not set properly from the beginning, leading to unwanted behaviors.

1. Open the published website in your phone's web browser.
2. (IF AVAILABLE) Open the published website in your tablet's web browser.
3. Check other pages to see if there aren't other alterations. When modifying things such as effects, classes, Webflow components, other pages could be altered if things were not set properly from the beginning, leading to unwanted behaviors.

Usually some changes, specially those related to using custom code, do not reflect well in all web browsers and even there are some differences between the same web browser used in different operative systems. Due to this, it is recommended after these kind of changes not implemented natively in Webflow to:

• Check from both Windows and Mac web browsers.
• Use different web browsers to test if everything is working properly.