The following guidelines for image dimensions are based on Divi’s default layout settings. Image Dimension Guidelines Based on Divi’s Column Layouts GIF’s are unique because they can be animated, which is sometimes useful. GIF’s are good for small images with limited color. The PNG format also supports transparent background capability which is perfect for logos and graphical elements. PNG’s are great for smaller images with a lot of detail. PNG is also a very compatible format for the web. JPEG’s should be used for all of your full-color photographs like featured images and background images. JPEG’s are good for most situations because of its compatibility, use of color, and small file size. In general, most images on the web are either in JPEG, PNG, of GIF format. Background images are displayed using CSS and are mostly used purely for design purposes. Keep an eye out for these when using certain Divi Modules.įrom what I have researched, Google doesn’t read background images automatically since they are not wrapped in an img tag. Make sure you are adding this info to your images whenever uploading a new image to your media gallery.Īdditionally, the Divi Builder allows you to add ‘alt’ text and title text from within certain modules. When it comes to reading images, search engines rely on the image’s filename, ‘alt’ text, captions, file type, file size, etc… This info is placed in the img tag which displays your image.
#Fluid image lightbox how to
For a complete guide on how to optimize your images, go here. That way you aren’t slowing your page load time down too much. Also try your best to keep all of your image file sizes between 60kb and 200kb. It is always best to optimize (resize, compress, crop, etc…) your images before uploading them to WordPress. Note: There are useful aspect ratio calculators out there that may help you find the right image dimensions as well. If you haven’t already done so, you can check out Divi’s image templates to see the standard sizes and aspect ratios recommended for your images. For this post, I will be basing all recommended image dimensions on these aspect ratios. The 3:4 aspect ratio is useful in Divi for displaying portraits.ĭivi was built with three aspect ratios in mind – 16:9, 4:3, and 3:4.
The newer high definition televisions and monitors today have the 16:9 aspect ratio which has a wider display. The 4:3 aspect ration is the standard screen size for older TV’s and monitors and has a more box-like display.
#Fluid image lightbox tv
These should look familiar to you if ever adjusted your TV screen or monitor settings before. The two most popular aspect ratios are 4:3 and 16:9. The number on the left of the colon represents the width (x axis) and the number on the right of the colon is the height (y axis). Divi Image Optimization Guidelines Use Divi’s Image Aspect Ratio (16:9, 4:3, 3:4)Īspect ratio expresses the proportional dimensions of the width and height of an image or screen.
In the sections below I’ll show in detail how an understanding of these three factors can be used throughout Divi, resulting in perfect image sizes for any use case.
0 kommentar(er)
