Many websites and mobile applications support user uploaded images and other files. This requires a service to receive and process the uploads, store them safely, transform them to match the website or app’s design, and deliver them to your users. This also requires a user interface within your site or app that allows users to easily upload images.
Web or mobile developers may want to build applications that allow users to download PDFs, support document previews, or embed image thumbnails of Office files. However, implementing these types of capabilities can be quite a challenging task.
In 2010, Apple introduced the iPhone 4 with Retina display. In order to simplify things for developers, the logical screen resolution remained the same as previous iPhone models (640x960) while the physical screen resolution was exactly doubled (1280x1920). This means that if, for example, you embed an image tag in your HTML page with width of 200 pixels and height of 300 pixels, and you display a double-size image of 400x600 pixels, the Retina display shows all pixels of the larger image, resulting in a much clearer visual result and without performing browser-side down-scaling.
If your web or mobile application involves user-generated content, you may encounter users who upload inappropriate photos or images to your application. These could be images which offend other users - adult content, violent photos, etc. - or images which cause your site to violate laws or regulations.
Handling user uploaded images and other files on your website can be a time consuming task. As images grow larger, uploading and processing them becomes more and more complex. For example, common upload issues for images and other files may relate to browser limitations, server configuration issues, memory and timeout issues. Specifically, handling user uploaded images on your website can be a hassle. In this post, we'll show how Cloudinary's cloud-based image management service can help you turn user uploading into a lightweight operation that bypasses your servers altogether.
How do you crop an image to a custom shape? How do you add a shadow effect to an image with transparency? How do you add text overlay to an image without using HTML?
If you build or maintain a website with a lot of images, you've probably had many questions like these. Most developers who work with images have scripts or tools that can achieve dozens if not hundreds of image transformations - from basics like crop and resize, to advanced stuff like shadow and transparency, watermarks, face detection, etc. But how do you mix and match these transformations correctly to solve a problem or achieve a certain effect?