In a piece of content providing advice or instructions, it can be helpful to call out especially helpful information separately to make sure the reader doesn’t miss it or provide extra guidance to really help them out.
Examples
Tips on the full-width multi-column block
How to make tips on the full-width multi-column block
Tips on the full-width multi-column block with custom borders
Replace style id `stk-theme_00000` with yours before adding it to your Style Manager. For more info, please go to the Introduction page.
You can also adjust divider style and color in the component CSS.
Content Experience Impact
Readers want to get the maximum benefit for the minimum amount of work, so by highlighting the most valuable tips and tricks in a more visual form, you can draw their eye to the most relevant content and quickly provide them incredible value. Tips can also be used to provide additive information to help the reader take their learnings to the next level, without breaking the flow of your main text. When designed well, with colorful backgrounds, icons, and different font styles, these can also provide some visual interest as the reader scrolls down the page, thereby upping engagement.
Dos
Help your tip stand out with a stylized frame, different background color, or even an icon placed by the header of the tip.
Make the design of your tips uniform down the page so the reader can easily scan and find each one throughout your content.
Don'ts
Don’t call out everything in your content as a tip—if everything is emphasized, nothing is. Instead, consider the goals the user is trying to achieve or what is most important to them and only highlight that information as a tip.