Inline Content Best Practices Guide

[1WSCGomez]

Inline Content Best Practices Overview

This document describes the inline content assets specifications, requirements, procedures and best practices for building Inline Content within ContentCast.   Adhering to these guidelines and best practices ensure maximum partner adoption, browser compatibility, optimal page load, performance times, partner site compatibility and mobile-friendly delivery.

General Guidelines 

1. Performance
   1. All inline content should not exceed 2.5MB in size.   This ensures fastest delivery and optimal performance for the best user experience.   
   2. Use WebP Image formats when possible.
   3. Do not use non-native fonts for your inline content template.   Leveraging the fonts that are already on end-user systems eliminates the need for the browser to download custom fonts.   Examples of native fonts are Verdana, Arial, Helvetica, Times New Roman and Courier.
2. General Content builds 
   1. Inline pages should have at least 1 video, 3 or more images in the gallery and 3 feature blocks.
3. Product Status
   1. Requested – A person has requested that the content be built for the given product.  The request can come from either a retailer or another internal company user.
   2. Draft – You are actively working on the inline sku.  A work in progress.
   3. For Review – Content is ready for review.   Set to this status if you need another peer to review the content internally for approval.   This does not trigger any notifications or automated workflow.
   4. For Publish – Once you are satisfied with your content and are ready to publish the content live, click the Publish button.   The product status will update to “For Publish”.   This lets our Content QA team know that its ready for syndication.
   5. Live – The product will be set to Live once our Content QA team does a review to ensure the content is free of any profanity, vulgar or offensive content.
4. Accessibility
   1. Do not use images that have text embedded in them as this will fail accessibility standards set by several retailers and will lead to retailers taking down your content
   2. Do not take a screenshot of a text block and upload as an image as this will fail accessibility standards set by several retailers and will lead to retailers taking down your content

Videos 

Product videos are the most interacted pieces of content in syndication. 

• 10 video maximum per product
• 200MB maximum size per video.   100MB Suggested File Size
• Supported File Types for cross-compatibility:
  • Recommended:  .mp4 (MPEG-4)
  • YouTube URLs
• Recommended Video Compression Codec:  H.264
• Frame size / Resolution:   Preferred: 1208×720 (16:9)
• Video Bitrate:   2000-5000kbps
• OPTIONAL: Upload a custom thumbnail (not supported for YouTube videos) that will peak the consumer’s interest.  
• Video Duration:  minimum of 30 seconds and maximum of 2 minutes.    The only exception where video should be longer is if the product is very complex with a longer sales cycle.

Video Accessibility

Make sure to enter a video title and upload a closed captions file for each video to be WCAG/Accessibility compliant.

• Format for closed captions:  .vtt
• Timing syntax: use . [dot] to differentiate milliseconds.   Ex:  00:00:01.04

Media Gallery 

• Maximum file size:  50MB per image asset
• 10 images maximum
• Avoid duplicates or images that are extremely similar.
• Minimum of 800 pixels wide
• WebP images preferred
• Animated GIFs are not recommended
• 72 dpi compression
• Best Practice:   3-5 images

Image Accessibility Check

• Make sure to add a title/description for each image. These values will be used as the images’ alt text for screen readers.
• DO NOT include images that contain embedded text as it violates ADA and 508 compliance laws.

360 Spin  

• 20 images maximum recommended for optimal performance.   50 images is the system maximum.
• Recommended to use images with a white background.
• Use lossless PNG or WebP Image format when possible.
• Maximum file size is 5 MB.
• Best Practice:  8-12 images

Hot Spots 

• Maximum file size for main image:  50MB
• Max height:   600px Recommended
• No max width as image scales to the full width for responsiveness.   If image is too big, please upload a smaller image.
• Best Practice:   3-5 Hot Spots per Image

Feature Section

Contains marketing text and images.   

• Features Images should be approximately 400 pixels wide but no more than 1400px wide.   
• Banners should be at least 700 pixels wide but no more than 1400px wide.   Best Practice:  1200px wide
• Background images should be 1200px wide but no more than 1400px wide.   
• WebP format preferred
• Text guidelines: Bold, Italics, increase/decrease in font sizes and custom font colors are supported. Please use as needed.
• Best Practice:   3-5 Feature Blocks with balanced image and text

Carousels

• If uploading multiple images, make sure they are all of same height for a cleaner transition between slides.
• Best Practice: 3-5 slides (feature blocks) within the carousel

Product Q&A

• Try to address commonly asked pre-sales or product questions with a how-to video for more engagement and customer satisfaction
• Best Practice: 5-10 FAQ’s

Documents

• All documents should be in PDF format
• Maximum of 5 PDF documents per product
• PDF Maximum File Size:  20MB
• Cannot contain MSRP information

Comparison Tables

• Best Practice: Limit to a maximum of 4 products.   The more products results in decreased performance due to real-time partner catalog mapping.
• Use short product titles in columns
• Limit to a maximum of 10 rows.    Only include key features to compare rather than a huge list of specifications.