Hello!
When you upload images that are already low quality or really big (dimensions or file size). The end result will not be pleasant.
For websites, we have always recommended images that are 72 dpi and are no larger than 1000 pixels on the longest side. We also advise that they are saved using sRGB and an extra step is to add an embedded color profile to the image.
When you upload any photograph to Weebly, our system will automatically optimize it for web use. Including a color profile will ensure the image retains it's color exactly the way you intended.
There are a number of photo editing programs available. Photoshop still remains one of the top programs for editing images for web and print, by both professional, amateur photographers and web designers. They do offer a free trial if you don't have Photoshop and would like to try it out. Just go here Photoshop Free Trial https://creative.adobe.com/products/download/photoshop
They offer a number of free trials for other Adobe products here: http://www.adobe.com/downloads.html
The following tutorial will guide you on how to setup Photoshop with the proper color profile for web images.
1. Open Photoshop.
2. Click the 'edit' tab at the top.
3. Choose 'color settings' near the bottom.
4. In the new window click the drop-down menu and choose.
North America/Web Internet and save the changes.
If you are using a different version of Photoshop such as the European version. Create a new color profile and ensure the settings match these shown in the photo. To do that just start making changings to the current profile you see to match the image. Then click save and give it a new profile name. Like New North America Web/Internet.
Once your color profile is completed. To save your images going forward, using the new settings, click 'Save As' under the 'File' tab. Choose jpeg in the image format drop-down menu. Then be sure the ICC color profile box is checked. Click save and an image quality window will appear. Choose the quality you desire. Remember the higher the quality the larger the file size. If you slide the bar from large to small file size. You will see the actual file size in kb on the side. So long as you stay below 100kb in size. It will make it easy for just about anyone especially those on a slower connection to view your images. There will also be three options called 'Format Options'.
1.) Baseline Standard - This format will only display the image on the website after it is completely finished downloading.
2.) Baseline Optimized - This format simply optimizes the color of the image but, is not widely supported by all web browsers.
3.) Progressive - This option partially displays the image on the screen as it is downloading. Depending on the number of scans chosen, it can take 3-5 scans to display the entire image.
If you are using a different photo editing software, please refer to the user guide or color profile tutorials for your program online by doing a quick Google search.
Tips for creating a happy visitor environment on your website.
1.) File size and type plays a huge role in the functionality of your website. Try keeping a majority of your images under 100 kb each. Photographers, graphics designers, etc. who will want a higher quality image, will be an exception. We suggest uploading a smaller file size, then link it to a larger file size or the full sized image as needed.
2.) Try limiting the number of images per page. Keeping the number of images down to around 10 per page will greatly improve the page loading speeds. This will be especially important to those who are using a slower internet connection.
3.) Image formats, while we discussed jpegs in more detail earlier. We recommend that you stick with jpegs, gifs and png files for all your images. Tiff and BMP file types are not recommended for website usage.
4.) If you need images for your site. Don't forget to check out our free image gallery or purchase a professional image from our Pro gallery provided by Getty Images. You can access these by dragging over an image element. Click upload. In the new window click the 'search' tab. Enter your keyword and images will begin to appear. Free images that are added to a page, will display a creative commons notice in the footer of your site. Removing the free image will remove the creative commons footer credit.
Pro images are $5 each and do not require any credit to the photographer. They are yours to keep. You will receive a copy of the purchased image to download to yor computer via email for your backup.
Below is a view of our photo gallery after doing a search. Press the Professional tab to see Professional images.
Retina images
You can upload retina images on Weebly. However, they will not display in retina resolution. Don't worry we have not forgotten about our retina screen users. This feature is planned for the future. There isn't an eta at the moment. We will make an announcement when it's released.
Hello!
When you upload images that are already low quality or really big (dimensions or file size). The end result will not be pleasant.
For websites, we have always recommended images that are 72 dpi and are no larger than 1000 pixels on the longest side. We also advise that they are saved using sRGB and an extra step is to add an embedded color profile to the image.
When you upload any photograph to Weebly, our system will automatically optimize it for web use. Including a color profile will ensure the image retains it's color exactly the way you intended.
There are a number of photo editing programs available. Photoshop still remains one of the top programs for editing images for web and print, by both professional, amateur photographers and web designers. They do offer a free trial if you don't have Photoshop and would like to try it out. Just go here Photoshop Free Trial https://creative.adobe.com/products/download/photoshop
They offer a number of free trials for other Adobe products here: http://www.adobe.com/downloads.html
The following tutorial will guide you on how to setup Photoshop with the proper color profile for web images.
1. Open Photoshop.
2. Click the 'edit' tab at the top.
3. Choose 'color settings' near the bottom.
4. In the new window click the drop-down menu and choose.
North America/Web Internet and save the changes.
If you are using a different version of Photoshop such as the European version. Create a new color profile and ensure the settings match these shown in the photo. To do that just start making changings to the current profile you see to match the image. Then click save and give it a new profile name. Like New North America Web/Internet.
Once your color profile is completed. To save your images going forward, using the new settings, click 'Save As' under the 'File' tab. Choose jpeg in the image format drop-down menu. Then be sure the ICC color profile box is checked. Click save and an image quality window will appear. Choose the quality you desire. Remember the higher the quality the larger the file size. If you slide the bar from large to small file size. You will see the actual file size in kb on the side. So long as you stay below 100kb in size. It will make it easy for just about anyone especially those on a slower connection to view your images. There will also be three options called 'Format Options'.
1.) Baseline Standard - This format will only display the image on the website after it is completely finished downloading.
2.) Baseline Optimized - This format simply optimizes the color of the image but, is not widely supported by all web browsers.
3.) Progressive - This option partially displays the image on the screen as it is downloading. Depending on the number of scans chosen, it can take 3-5 scans to display the entire image.
If you are using a different photo editing software, please refer to the user guide or color profile tutorials for your program online by doing a quick Google search.
Tips for creating a happy visitor environment on your website.
1.) File size and type plays a huge role in the functionality of your website. Try keeping a majority of your images under 100 kb each. Photographers, graphics designers, etc. who will want a higher quality image, will be an exception. We suggest uploading a smaller file size, then link it to a larger file size or the full sized image as needed.
2.) Try limiting the number of images per page. Keeping the number of images down to around 10 per page will greatly improve the page loading speeds. This will be especially important to those who are using a slower internet connection.
3.) Image formats, while we discussed jpegs in more detail earlier. We recommend that you stick with jpegs, gifs and png files for all your images. Tiff and BMP file types are not recommended for website usage.
4.) If you need images for your site. Don't forget to check out our free image gallery or purchase a professional image from our Pro gallery provided by Getty Images. You can access these by dragging over an image element. Click upload. In the new window click the 'search' tab. Enter your keyword and images will begin to appear. Free images that are added to a page, will display a creative commons notice in the footer of your site. Removing the free image will remove the creative commons footer credit.
Pro images are $5 each and do not require any credit to the photographer. They are yours to keep. You will receive a copy of the purchased image to download to yor computer via email for your backup.
Below is a view of our photo gallery after doing a search. Press the Professional tab to see Professional images.
Retina images
You can upload retina images on Weebly. However, they will not display in retina resolution. Don't worry we have not forgotten about our retina screen users. This feature is planned for the future. There isn't an eta at the moment. We will make an announcement when it's released.
