There are times when one wishes to add just a “simple” static photo to improve feel and presentation of our/client’s site or photo blog. The idea usually goes like this:
For the following part, we will need to be comfortable with a simple editing of html code, preparing JSON list of our photos, including jQuery/Ajax script, and with a little bit of css styling.
If you have not done so before, download it here:
Patches1.0.1.zip v 1.01 | Complete set of files. Fixed a minor error in the index increment and displaying full set of images. – [downloaded 1036 times]
While writing my previous posts on color management and web browsers [1, 2], I realized that instead of guessing as to whether a browser understands how to manage colors, a few measurements of color patches would go a long way. Questions, such as, what will happen with untagged images in Chrome 11 or is it safe to use sRGB profile for photos displayed on a wide-gamut monitor would then be easier to answer. By all means, these questions are not trivial and would deserve an in-depth study of the browser documentation and perhaps many hours spent on Google. Unfortunately, with many browsers one would still be unclear on the exact way by which are the (un)tagged images processed.
To address browser color capabilities in the most straightforward way, we would just send images of RGB primaries through the browser and record their colorimetric values. In order to do that, we would need a set of images that are either untagged (no color space information is associated with them) or images that carry color space information in the form of icc/icm profile. After the measurement is done, a quick comparison with known CIE 1931 chromaticity coordinates of RGB primaries of standard color spaces (sRGB, Adobe98 RGB, Pro Photo RGB) would reveal any color processing done by the browser. To measure the radiometric output, we can use the same device that we use to calibrate our display.
Every day, hundreds of thousands of photos are uploaded to the web. There are many web surfers, photography amateurs, pros and photo agencies browsing for the best pictures. Nothings gets more frustrating then seeing an image that took several hours of editing and rigorous color management discipline, only to realize that colors got shifted and that the whole visual experience is compromised. Main culprit is often wrong setup of the web browser or use of browser that cannot be setup to effectively manage colors (IE, Opera).
This post will guide you through the powerful options in Firefox that enable color management of images that are tagged with icc profile. If the image is not tagged with icc profile, its color interpretation will default to the computer system color space, which in most cases is close to sRGB and and then converted to the monitor RGB. If the image is tagged with icc profile and if there is no monitor profile available, monitor RGB values are assumed and the monitor default profile is used for conversion. For calibrated and profiled or any decent monitor, results for tagged and untagged (but edited on standard sRGB gamut monitor) images will be just fine. However, troubles will most probably arise on a wide-gamut monitor.
In this short post, I will share a web page redirection code for users of iPad, iPhone or ipod who have no access to Adobe Flash media.
In this example, /directory/ is optional (in case that your site or iPad friedly version of your site resides in another directory) and index1.html is an alternative index.html that does not contain any Flash code. Index1.html is essentially a copy of the index.html where the Flash part is replaced with JQuery or html5 code to display the original slides or movie. It is where the visitor will be re-directed to.