ThemeKit UI

Background Images

Responsive Images

Image Insert
Images are inserted in a website page using the <img> tag which allows an alt text attribute to insert keywords for the search engines and screen readers.
Background Images
Another method of inserting an image is to use it as the background for a contaoner.
Background images should be avoided since they cannot have alt text for the search engines.

Slideshows

The same applies to full width or content width sliders which should have lazy loading images inserted in two or three sizes.

Browser Background

Background Color & Gradient

All the ThemeKit widgets created by EverWeb Widgets are responsive with the content centered with a maximum width setting. There are controls for setting the containers background to a sloid color or two color gradient.
An alternative is to use a background widget like the ThemeKit UI Image BG widget and set the container backgrounds to zero opacity.

Mobile Phones

If an image browser background is essential, make sure the image is removed for mobile phones. A background image and/or animated items should be avoided on phones since they just cause confusion on these small screens.

ThemeKit UI Image BG Widget

Image BackgroundWidget

The widget can be inserte as the lat item - below the footer bar or footer widget if present.

Mobile Phones

On mobile phones there is no image and the browser background defaults to the solid color or gradient background

ThemeKit UI Bacgground Image