How-To Articles

How-To Articles - Image Resize

Category: Image Resize

How to Resize Images for Responsive

How to Resize Images for Responsive

Posted By Olivia Justice
March 24, 2017 Category: How To, Image Resize

Is your website powered by Virteom CMS? Do your images look good on your laptop but not on your 4k monitor? Are your pictures a good size on desktop but become oversized or deformed on a mobile device? More than likely you’re using pixels to set the dimensions of your photos, but is that the best way? This article will explain how you should be sizing the images on your Virteom powered website so that they look good across all devices. As you make edits and additions to the pages of your website you find yourself adding images to support your content. Typically, the size of your image is too large for your page and with the popup picture below you set dimensions of your image using pixels: Setting your images dimensions using pixels is what makes your image stretch on your cell phone or from one screen to another. You don’t want to use pixels to set the dimensions of your images. For example: Here we have a picture of a tablet: Once we add it into the image uploader we see the width and height of this image is 1000px by 667px. If we kept it that size, it would be very large on the page and it would take up a lot of space. If it was viewed on a mobile device, it would appear stretched out and require you to scroll left and right. Take a look:   Your first instincts may be to resize the image using the width and height that are in the image properties. If we resize the image to 600px by 400px and preview the page you’ll see in the browser it loo