Looking for a creative way to display content to your website visitors and spur them to action? For content that needs to be noticed, such as a “Save 15% off your next purchase!"
or “Don't forget your shopping cart", consider a web design feature called “modals,” known to most of us as the pop-up boxes that are automatically seen at certain points of a user’s experience.
Don't forget your shopping cart!
Modal dialogs, when used properly, can free up valuable webpage real estate. Modals can also provide some great interactions between your users and your content.
They’re a great way to add a level of sophistication to your site and give your audience a direct call to do something.
Note: You need to be running LRS Antilles Content Manager version 17.3 or above. (Contact HelpDesk to upgrade.)
Modals are fun, but they also need to be used carefully. Here’s a chart to help you decide if a modal is right for you.
Before you create a modal, think about what specific action you want the user to take. Then see if this action matches the guidelines on this chart.
Will the content of the modal dialog enhance the user experience?
Your website content should be designed specifically to help your visitors.
Do you really want to interrupt the user’s experience, get their full attention and have them interact with information before continuing?
Use a modal.
Is it better if the modal text stay within the existing content on the page?
Do not use a modal.
The content should most likely remain on the page itself and not within a modal.
Are you providing a clear and specific way of opening the dialog that a user won’t miss?
Use a modal
Meaningful link text and/or styling are an absolute necessity when you are enticing users to click on a link that will trigger a modal.
Is the content within the dialog considered unnecessary “fluff” such as “Welcome to/Thanks for visiting our website!”
Do not use a modal
Usually, if you question the usefulness or importance of content, it is better to leave it out altogether.
1. Create the modal
2. Add Text & Images
You can add the text for the pop-up directly in this box, where it reads "Modal Content." Include a call to action in the title. The content should have the information needed such as email, phone number, or link.
3. Trigger the Modal.
Now that you have the modal, decide where you want it to pop up. To trigger the modal, select the text or image you want to become the trigger and click the link button. In the insert link box (see below) include the ID of your modal as the Url - don't forget the "#" symbol Set the Class to “Open Modal”. Voila. You're done.
You have two options with modals: you can use a link to trigger a modal or the modal can fire when the page is loaded.
Sign up for our blog to learn all about web design and construction, best practices and LRS Antilles Content Manager.
You can even include the modal as part of the url for linking.
Modal dialogs, when used properly to provide information to users in a clean and efficient manner, can be extremely useful and create a better user experience.
Be sure to contact our HelpDesk to learn more or to request a modal stylized for your company’s website – and give your users the direction you’ve been wanting.
Want to stay up-to-date on the latest with LRS Web Solutions? Subscribe to our blog.