Images and Copyright

Image Types

Questions and Answers

What are the three main types of images used in HTML web pages?
The three main types of images used in HTML web pages are JPEG, PNG, and SVG. A fourth popular image type is GIF.
When would you use each type of the three images?

JPEG (or Joint Photographic Expert Group -- I didn't know this until today!) is best for photographs with many colors, it's smaller size is an advantage for web use.

PNG (or Portable Network Graphics) is best for images that require transparency or have text. It provides better compression without losing quality, it is, however larger in file size compared to JPEG.

SVG (or Scalable Vector Graphics) is ideal for logos, icons, and other graphics that need to be scaled without losing quality.

GIF (or Graphics Interchange Format) is used for simple animations and images with more limited color palettes.

Copyright

Questions and Answers

What is Copyright?
Copyright is a type of legal protection that gives visual artists, writers, developers, and other creators of content the right to control the use and distribution of their work.
What is Fair Use in terms of Copyright?
Fair Use is an exception to copyright that allows for use of the copyrighted materials in specific circumstances such as for educational purposes, research, or commentary.
List two types of Copyright licenses and what they are used for.

Creative Commons licenses give content creators a standardized way for content creators to specify how their works can be used.

Public Domain is a status where a work is no longer protected by copyright and can be used for any purpose without permission. It is granted either when the original copyright expires or when the creator releases it into the public domain.

How can you be sure you have permission to use an image?
To be sure that you have permission to use an image you can check the copyright status, this is frequently indicated on the image's source page or found in the image's exif data. You can also obtain permission directly from the image's creator. Finally, you can obtain your images from reputable stock image sites that grant free use rights.
Websites With Free-to-Use Images

Free to Use and Reuse Sets The Library of Congress' collection of images, texts, and audio files that are free to use and reuse.

Unsplash High-resolution images, many of which have a Creative Commons Zero license.

SnappyGoat a search engine and database featuring images in the public domain or with Creative Commons Zero Licenses.

Image Optimization

Questions and Answers

What is image compression/optimization?
Image compression/optimization are processes used to reduce the file size of images.
Why do we need to compress/optimize our images?
We need to compress/optimize images so that they load more quickly and efficiently on web pages. There are two main types of image compression. Lossy compression removes data from an image that the human eye typically does not notice. It offers up to 90% reduction in file size, but can cause artifacting (or blurs) in the images. Lossless compression reduces the size of image files without removing data from the image, but the size of the reduction is significantly smaller, up to 30%.
Image Compression Tools

TinyPNG can compress up to 20 images (PNG, JPEG, and WEBP filetypes) of 5mb each at a time.

Image Compressor a compressor and EXIF viewer/editor.

Kraken.io A professional-grade image optimization tool with both free and paid options.