Responsive images will grow or shrink in size according to the screen size. It uses percentages rather than pixels so it knows exactly how much of the container it needs to use.
To see what a responsive image does change the width of your screen and see how the image changes sizes.
Image setup using WYSIWYG:
Step 1: Upload your image into the Image Manager.
Step 2: Select your image and either copy the URL or click on the image icon and it'll transfer it for you
Step 3: Enter your alt text, if needed in the appropriate box.
Step 4: Set width to 100% and leave height blank or delete the value inserted. The little lock icon on the right of the boxes should "unlock" and that means it will be responsive.
Alternate text allows users who use screen readers to be able to gain the purpose and importance of the image. Images can be decorative, links, or contain information. It is important to include any vital information from an image in the alt text, especially if it is a function that can be use such as a link to another page. You can use the Alt Tree link in the sidebar to help determine what information is needed.
Good rules of thumb for alt text:
For example, consider the book covers used on the Southside Reads page:
alt="A Woman is No Man: A Novel by Etaf Rum book cover with link to Goodreads description page">
