Everyone knows the old adage that a picture is worth a thousand words. But what most people don’t realize about images is what needs to be taken into consideration when using them on websites and in mobile apps.
Controlling who can access your images and videos, and when, can be an important concern for your business and security workflow. You may have resources that you only want some of your users or employees to access, or you may need to make sure that your original resources are secure, and only transformed (edited) versions of your resources are delivered, e.g., with a watermark or logo displayed.
In the world of web design, what you don’t see can hurt you. Worse, it can damage your brand reputation, bottom line, or both.
Specifically I’m talking about images. Images can consume a lot of bandwidth (upwards of 70% of it for some sites). You get charged to send them. Your users are are charged to view them. In fact, you’re both probably getting charged for images that are never seen because website visitors never scroll down far enough to view them.
There was a time when it was not a punishable offense to click on a web page and wait several minutes for a full page reload. In fact, you could prepare a cup of coffee and still see your web page reloading when you came back. AJAX changed everything. The ability to communicate with a remote web server for a page reload revolutionized how web applications are built.
At Build.com, where I’m a software architect, we manage hundreds of millions of images. Our site offers more than 1 million home improvement products, such as tubs, toilets, cabinets, fireplaces – really any thing homeowners need for their improvement projects. And for each item, there are multiple images – product and gallery images, action shots, close-ups and thumbnails – that our visitors view from a variety of devices, including mobile phones, tablets, their desktop computers and our native app. In addition, these images are used in many view templates – on the landing page, via search, by category and in the cart.
Most developers are familiar with ImageMagick, a very capable open source software suite that they can use to manage and manipulate images.
The functionality of ImageMagick is typically utilized from the command-line, but wrappers have been written for a wide selection of programming languages, making ImageMagick a very popular choice among developers.
There’s no debating the fact that including images on your website or mobile app draws the interest of users and leads to stronger engagement. For example, posts that include images produce 650 percent higher engagement than text-only posts, according to a WebDAM infographic. Use of attention-grabbing images is only going to grow. Consider that by 2018, 84 percent of communication will be visual, the infographic noted.
There are lots of images and videos all over the internet. A lot of applications these days demand that the user is able to manipulate files and upload to the server. Thankfully, PHP provides the functions to handle file uploads.
In Part 1 of this series, I discussed (rather abstractly) what it means for an image to be “responsive.” In short, a responsive image is a variable image that adapts to fit variable contexts, in order to provide a great experience to users no matter what their screen, browser, network connection, or device may be.
With the decreasing price-performance ratio of computing, research efforts in face detection and face recognition algorithms are rapidly expanding and new techniques for both of these are achieving greater accuracy and reduced processing time.