Asset optimization means serving images and videos on a website with the smallest file size possible while preserving an acceptable level of quality. Delivering optimized assets on your website is crucial to keeping the page load time to a minimum, providing a better user experience for your visitors. Well-optimized assets also boost your SEO since search engines like Google punish sites with poor load times.
Here are our recommendations for maximum file sizes for assets:
Banner Images
Maximum resolution: 72ppi
Recommended width: 2000px
Maximum file size: 400kb (use judgment to alter if quality is too low)
File Type: .jpg, .png, .webp
Note: The height of banners will be different on different screen sizes so we recommend selecting images that do not have the subject close to the edge of the photo.
Regular Images
Maximum resolution: 72ppi
File size: 50-100kb
File Type: .jpg, .png, .webp
Video Banner
Maximum file size: 5MB
Maximum video length: 10s
File Type: .mp4
Note: Other videos that are not banners should be uploaded to video hosting platforms like YouTube or Vimeo. Click here for a full tutorial on embedding videos from third-party sources.
Recommended tools:
Photo: https://bulkresizephotos.com/en
Video: https://www.ps2pdf.com/compress-mp4
Recommended Asset Libraries
Additional Recommendations
The below file types are not commonly accepted within the platform:
| File Type | Potential Issues | Recommendation |
|---|---|---|
| .mp3 | Performance Issues: MP3 files can be large, which may slow down your page load times. This can negatively impact user experience and SEO. Bandwidth Usage: Streaming MP3 files consumes server bandwidth. If your site experiences high traffic, this could lead to increased costs and potential slowdowns. Cross-Platform Compatibility: Not all devices or browsers handle MP3 files the same way, so you might encounter issues with playback across different platforms. SEO Impact: Large or numerous MP3 files can impact your site's search engine ranking due to slower load times and increased bandwidth usage. Accessibility: MP3s might not be the best choice for accessibility. People with disabilities might have trouble interacting with embedded audio, and you might need to provide alternative formats or transcripts. | *Embed: Consider using a dedicated audio player service or hosting platform such as PodBean or Spotify that handles these issues for you. These services often optimize performance and offer better compatibility across devices and browsers. |
| .ppt, .pptx | Embedding PowerPoint presentations directly on a website can lead to several issues: Performance: PowerPoint files can be large, which can slow down your website's loading time and negatively impact user experience. Compatibility: Not all devices or browsers handle embedded PowerPoint files well, leading to inconsistent user experiences. Trustworthiness: Embedding editable files means that anyone can change wording or data on the slides. Accessibility: PowerPoint presentations may not be accessible to all users, particularly those using screen readers or other assistive technologies. SEO: Search engines may be unable to index the content within PowerPoint files, which can negatively impact your site's search engine optimization (SEO). | PDF Format: Convert the presentation to a PDF and provide a download link. Slide Sharing Platforms: Use platforms like SlideShare or Google Slides to host your presentations and embed them using their provided embed code. These alternatives can help mitigate the issues associated with embedding PowerPoint files directly on a website. |
| .xlsm | Security Risks: XLSM files contain macros, which are essentially small programs or scripts that can automate tasks in Excel. These macros can pose security risks, as they might be exploited to execute malicious code. This makes XLSM files a potential vector for malware. Compatibility Issues: Not all users have software that can handle XLSM files. While many users might have Microsoft Excel, others may use different spreadsheet applications that don't fully support Excel macros, leading to compatibility issues. Performance and Load Times: XLSM files can be large and complex, which might slow down page load times or create performance issues on your website. User Experience: Directly embedding XLSM files might not offer a user-friendly experience. Users would need to download the file and open it in Excel or another compatible program, which could be cumbersome. Accessibility Concerns: Users with disabilities might face difficulties accessing or interacting with macro-enabled files. Ensuring that the content is accessible to everyone can be challenging. Data Privacy: If the XLSM file contains sensitive data or macros that perform calculations, embedding it could expose confidential information or proprietary formulas. Browser Support: Browsers don’t natively support XLSM files, so users will need to download and open them in an appropriate application, which could complicate the user experience. | Exporting Data to a More Universal Format: If macros are not needed, convert your data to a more accessible format like CSV or XLSX. Providing Download Links: Offer a link to download the file, ensuring users understand they need appropriate software to view or use it. Using Web-Based Tools: Utilize web-based spreadsheet tools or platforms that allow users to interact with data without needing to download files. |
| .tiff | Large File Sizes: TIFF files are often large because they are high-quality images with uncompressed or losslessly compressed data. Large file sizes can slow down page load times, negatively affecting user experience and SEO. Limited Browser Support: Most web browsers do not natively support TIFF files for direct display. While modern browsers handle common image formats like JPEG, PNG, and GIF seamlessly, TIFF files may require users to download and open them with specialized software. Performance Issues: Due to their large file sizes, TIFF images can consume significant bandwidth, impacting page performance and potentially increasing hosting costs. Incompatibility: Users might not have software or plugins installed to open TIFF files directly in their browsers. This can lead to a poor user experience, as users may be prompted to download the file instead of viewing it immediately. Accessibility: TIFF files might not be the most accessible format for all users, particularly if they require specific viewers or software to interact with the content. | Use Web-Friendly Formats: Convert TIFF files to web-friendly formats such as JPEG for photographs, PNG for images requiring transparency, or WebP for a combination of high-quality compression and broad browser support. |
| .mov | Browser Compatibility: MOV files are a format developed by Apple for QuickTime. Not all browsers natively support MOV files, which can lead to playback issues. Users on non-Apple devices or browsers that don’t support QuickTime might have trouble viewing the content. Performance Issues: MOV files can be large, which might slow down page load times and impact overall site performance. This can lead to a poor user experience and negatively affect SEO. | mp4 Format: Convert to mp4 (for banners only) *Embed: Upload to video hosting platforms like YouTube or Vimeo to get an embed code, which you can then add to your website pages. Click here for a full tutorial on embedding videos from third-party sources. |
| .doc, .docx | Embedding .doc (Microsoft Word Document) files directly on your website is generally not recommended due to several issues: Browser Compatibility: Most web browsers do not natively support displaying .doc files directly. Users will typically need to download the file and open it in Microsoft Word or a compatible word processor, which can disrupt the user experience. Security Risks: .doc files can contain macros, scripts, or embedded objects that might pose security risks. These elements can potentially be exploited to deliver malware or harmful code to users. | PDF Format: Convert the document to a PDF. |
*Excessive use of embed codes and external scripts is discouraged. This will increase the number of HTTP requests your visitor’s browser has to make to display your website, ultimately hurting your page load time. To avoid this issue, spread out your videos to different pages or embed playlists where possible.