Black Header 1022×200

websites

web marketing

web thinking

digital creative agency

Black Header 1022×200

websites

web marketing

web thinking

digital creative agency

Prospectus Web Facebook Link
Oct 222016
 

This page features a large engineering drawing that enlarges to three times its original size when hovering. Hovering your mouse over the ‘live mini site’ (right) displays a zoomed image inside the original image. Moving the mouse outside the image returns the image to the original size. This is a simple yet effective technique to use a massively large image on the web.

The original AutoCAD drawing is 7,200 px by 10,800 px and was plotted on 24-inch by 36-inch engineering sheets and a PDF file. The PDF file was 5.4 MB. The page was developed to distribute the information with a simple link to the page. Viewers can see the details of the image without having to burn 5.4 MB of data usage. The image was converted to a JPG format and reduced to one-third of original size. The image on the right is 683 px by 1,024 px. You can visit the page here. This is about the largest image we can use without forcing the viewer to scroll, especially on mobile devices. While hovering on the image, the image zooms 3 times larger revealing the details.

This examples shows how Prospectus LLC was able to provide access to a large-format AutoCAD drawing without having to distribute a huge file by email. This technique also protects their work from being easily downloaded. Post counters and tracking cookies keep track of how many time the page was viewed and the location of the IP address of the viewer. This techniques can be very effective for professionals like builders, architects, surveyors and engineers to display details of their work while protecting it from being downloaded.
‘Live’ Mini Site – Cursor is Active