As many of you know, we've been on a bit of a tear lately developing and releasing responsive HTML5 designs for exported websites. These new designs utilize the most modern web technology and are optimized for display on iPhones and Android phones, tablets like the iPad, desktop computers, and even large monitors. As with all exported displays, these new websites automatically synchronize themselves with your Dripbook account.
Back in December of 2012, we released our first two designs for exported websites using responsive HTML5 technology . Then in February of this year, we released three more responsive HTML5 designs. And today, we're happy to double the number of responsive HTML5 designs we offer by releasing five more.
If you've been thinking of upgrading an older design, now is a great time. You can change the design of your exported website anytime, and these new designs are easy to use. And if you have any questions, you can always get in touch with us to get help.
These new designs offer the following features :
• All HTML5 - no Flash, no plugins needed
• Full bleed Splash images plus large display for images and video
• Disabled righ-click for viewer to save or copy images
• Responsive design means the website shrinks to fit on iPads and iPhones, expands to fit large monitors
• Responsive design means navigation automatically adapts to work on iPhones and Android phones
• No mobile re-directs - all links work on all devices
• Deep linking of URL web address - send links to individual genres or portfolios
• Sharing enabled for individual images on individual portfolios - share to Facebook, Twitter, Pinterest, Tumblr, Linkedin + Email
• Track individual views in real time with Google Analytics
• Use a custom logo with transparent background to display over images
• Use custom Google fonts
• Use the computer's keyboard arrows to advance images (for designs like the Left Thumbnails where images can progress next and back)
Let's get on to the fun part - what do these new designs look like?
The Left Slider (HTML5) design :
Responsive HTML5 design optimized for desktop, tablet and mobile. Navigation is a column to the left. Portfolio images are presented as a slider.
For an example of the Left Slider (HTML5) design,
see Sivan Miller Photography :
The Left Thumbnails (HTML5) design :
Responsive HTML5 design optimized for desktop, tablet and mobile. Navigation is a column to the left. Portfolio images are presented above a strip of thumbnails.
The FilmGrid Filmstrip (HTML5) design :
Responsive HTML5 design optimized for desktop, tablet and mobile. Genres open to a full page presented with all the portfolios "open" showing a wide range of work right away. Portfolio images are presented as a filmstrip. Clicking an image from the small thumbnails on the FilmGrid takes the viewer directly to that image in the portfolio.
For an example of the FilmGrid Filmstrip (HTML5) design,
see Lucy Quintanilla | Art Director :
The Style Tile (HTML5) design :
Responsive HTML5 design optimized for desktop, tablet and mobile. A modern design with portfolios presented as uncropped images arranged in vertical columns. Main images are presented with next + back selections.
For an example of the Style Tile (HTML5) design,
see Owen Photo :
The Simple Thumbnails (HTML5) design :
Responsive HTML5 design optimized for desktop, tablet and mobile. Portfolios are presented as a simple list. Portfolio images are presented above a strip of thumbnails.
For an example of the Style Tile (HTML5) design,
see Allison Michael Orenstein Photography :
Looking for even more examples? Here's examples of all of Dripbook's website designs.
These new responsive HTML5 designs are built for modern browsers, so they won't work in older browsers like Internet Explorer 8. You are welcome to continue using the previous Flash designs - it's up to you.
Now let's get on to the funner part - how do you use these new designs?
Head to QuickNav > Export > Exported Websites, choose one of the designs, configure it, and export your new design to your web host.
Here are some important details when thinking about using the new designs:
• We highly recommend creating and uploading a custom logo with a transparent background. Check this FAQ with detailed instructions.
• Dripbook's new designs operate best with larger images. We are now asking that you upload images at least 2,000px high. Smaller images will work but may not look as good.
• Dripbook's new designs work best with high definition video - We are continuing to ask that you upload video at 720p or 1080p.
• Dripbook's new designs use larger Splash images and work ideally with Splash page images of a horizontal aspect ratio. We suggest that you upload Splash images from 3,500px wide by 2,000 px high to 3,000px wide by 2,000 px high. You are free to try any sizes you'd like.