Website Image Optimization & Video Uploads Guide (Spring 2023)
This is a guide to web image optimization and video uploads for students in Senior Portfolio (Graphic & Interactive Design/GAD 4196) at Tyler School of Art and Architecture. Use the resources below to find out how to optimize images and videos for your chosen website building platform.
What is image optimization?
Image optimization means making sure your images are the best size and resolution for the platform you’re hosting them on. If an image is too small, it can appear blurry, while images that are too large will cause your website to load slowly and can also impact your ranking on search engines. See the article below for an overview of web image optimization. In general, 2500 pixels is the ideal width for an image that fully stretches across a browser window.
While this article covers general rules of thumb for web images, you’ll also want to check the optimal image sizes for the specific website builder you’re using. See the resource list later in this article.
How do website builders host videos?
Some website builders allow you to upload videos directly, while others require an external hosting service like Youtube or Vimeo. Note that on many website builders, autoplay is available only for GIFs or silent background videos, while videos with audio will need to be clicked to play. File size limits for direct video uploads are also a consideration. Take these factors into account when choosing your site builder. See the platform-specific guide below to find out more about how each site hosts videos.
Platform-Specific Resources
Adobe Portfolio
Image Optimization
Video Formats: Direct Upload or Embed from Vimeo/Youtube
Silent Background Videos (with looping autoplay):
Cargo
Image Optimization
Video Formats: Direct Upload or Embed from Vimeo/Youtube
Silent Background Videos (with looping autoplay):
Squarespace
Image Optimization
Video Formats: Direct Upload or Embed from Vimeo/Youtube
Silent Background Videos (with looping autoplay):
Webflow
Image Optimization
Video Formats: Videos with audio can only be embedded from external sites like Vimeo/Youtube. Silent background videos can be uploaded.
Embedded Videos:
Silent Background Videos (with looping autoplay):
Wordpress with Semplice
Image Optimization
Video Formats: Direct Upload or Embed from Vimeo/Youtube. With uploaded videos, you can enable autoplay, looping, muting, and more.
ReadyMag
Image Optimization
Video Formats: Videos with audio can only be embedded from external sites like Vimeo/Youtube. Silent background videos can be uploaded.
Embedded videos:
Silent Background Videos (with looping autoplay):
Format
Image Optimization
Video Formats: Direct Upload or Embed from Vimeo/Youtube.
Silent Background Videos (with looping autoplay):
