PhotoSecrets goes “mobile”

PhotoSecrets has been upgraded with a mobile-first, responsive, app-like layout. The ten photography location guides look like native apps — complete with a tab bar and touch-sensitive photos. Touch a tab to see a full-screen map; touch a photo to see a full-screen version; or swipe a full-screen photo for a slideshow. Designed to look simple and natural on a mobile phone, the layouts automatically reflow to any size screen, including desktop.

“I’ve been working for over three years now — learning and coding HTML, CSS, PHP and JavaScript — to reimagine my PhotoSecrets book series as a mobile digital experience. I hope this ‘on-the-go’ design helps you find and photograph your favorite locations.”
— Andrew Hudson

Features

• Apple-like : The status bar, tab bar, and photos are the same size as in the Apple Photos app, for a familiar experience and natural navigation.
• Touch sensitive : Swipe the slideshow for a different picture; touch a photo for a full-screen version; scroll down with one tap; touch a tab to see a different section.
• Responsive : The layout and images automatically adapt to any screen size.
• “Lightning load” : Behind-the-scenes technology is used to deliver and display each page as fast as possible:
  • Cached files : All pages are served immediately, as the time-intensive PHP work is done beforehand, allowing the server to instantly send pre-made HTML files.
  • Only three files : One HTML (text), one CSS (styling) and one JavaScript (actions) file contain everything, and the last two are common to all pages, so subsequent pages only need one HTML file;
  • Minimized and compressed files : All files have comments and whitespace removed, and GZIP compression applied, as smaller files = faster download time;
  • Common HTML : Global text (such as the menubar and footer) is in the common JavaScript file, not the main HTML file, to further reduce file size;
  • No images needed : The page text and layout is displayed immediately, as all images (including ads and maps) are sized in the document but loaded later, resulting in a lightning-fast initial display;
  • Lazy-loading : Full-screen images for the slideshow are not downloaded until just before they are to be displayed.

Evolution of PhotoSecrets Guides

• 1995 : PhotoSecrets.com registered — same ownership for 19 years.
• 1997 : World’s first color travel guide book for photographers published — PhotoSecrets San Francisco.
• 1998 : Book layout improved with PhotoSecrets San Diego.
  
• 2012 : The world’s first web-app photo guides.
  After ten+ years photographing and publishing coffee-table books, I remade the PhotoSecrets concept as an online guide.
• 2013 : Faster loading and welcome pages added.
  
• 2014 : Mobile-first layout, designed for your cameraphone.
  

You might also like

PhotoSecrets guides get welcome pages

Full-screen images and mini maps speed your tour.

PhotoSecrets guides improved with faster loading

The seven online travel photography guides get faster loading and better navigation.

PhotoSecrets London

The world’s first free, online, interactive travel guides for photographers.

Sources: Screenshots from PhotoSecrets; photos from Wikipedia and Flickr, with credits and links on the appropriate PhotoSecrets guide pages.