< All Topics

How to upload website images in the Hosted.com Website Builder is easy and can greatly improve your site’s visual appeal and increase user engagement. Visual content is vital for attracting visitors and effectively communicating your message. Whether displaying products, sharing information, or establishing a specific design aesthetic, selecting the appropriate images for your website is important. This guide will take you through the steps to upload website images.

How To Upload Website Images

1. Login to your Hosted.com account by visiting www.hosted.com/login and entering your username and password.

Upload Website Images In Website Builder - Hosted.com Login Screen

2. Once logged in, navigate to the left-hand menu under Manage Services and select Website Builder.

3. At the top of the Website Builder page, you will see the Content Elements Tab.

Upload Website Images In Website Builder - Website Builder Main Page

4. From the menu, select Images to upload from your computer or choose an image from the default options.

5. For Videos, click the tab and upload or select the URL of a video you want to add to your page. 

Once you’ve selected your content, click Upload. The images or videos will appear in the options to Add Items.

IUpload Website Images In Website Builder - Add Items

Additional Information

Tips for Optimizing Image Uploads

By following these best practices, you can ensure when you upload website images in Website Builder, they are optimized for both search engines and users, leading to a better overall experience and increased visibility.

Compressing images reduces file size without losing too much quality. There are two types of compression you can use depending on your needs:

  1. Lossy Compression: Permanently removes some image data to reduce file size. Use with caution, as excessive lossy compression can degrade image quality.
  2. Lossless Compression: Reduces file size without losing any image data. Ideal for images where clarity and quality are essential, for example, product pictures.

Tools like TinyPNG, ImageMin, and ShortPixel can help. To help speed up initial page loading times, implement lazy loading, which delays loading images that are below the fold (not on the visitor’s screen yet).

Ensure images are not too large, as they can slow down page loading times, and use the correct sizes for where they need to be placed on your site. For example, don’t upload a large image and scale it down with HTML; this will cause it not to load correctly.

Choose the Right Format

  • JPEG: Ideal for photographs and images with lots of colors.
  • PNG: Best for images with transparency, logos, and graphics with sharp lines.
  • WebP: WebP is a more modern format that offers better compression and quality compared to PNG and JPEG

Organize image files by separating them into folders within File Manager. If uploading multiple files immediately, use the Dropzone feature in File Manager for more efficiency.

Best Practices for Image Selection 

  • Relevance: Choose images that are relevant to your content or brand message. 
  • Quality: Use high-quality images that look professional even when scaled up or down. 
  • Consistency: Maintain consistency in style and aspect ratio across all pages for a cohesive look.

Regularly test your website on different browsers and devices to verify that images are loading correctly and that your optimization efforts are effective.

Search Engine Optimization (SEO) Considerations 

When uploading images, Use descriptive file names (e.g., product-image.jpg) instead of generic ones like image123.jpg.Write descriptive alt text with keywords related to each image.

Alt text helps search engines and screen readers understand what the image is and appears if the image fails to load. Similarly, add captions to give context and additional information.

Create an image sitemap to assist search engines in discovering and indexing your images. Place images strategically within your content to enhance understanding and engagement.

Was this article helpful?
Please Share Your Feedback
How Can We Improve This Article?