That badge you see up in the header came from PDN (Photo District News) because A Photo Folio won for best website design. The winners were Sang An with Design 3 – Brooklyn Bridge and David Coventry with Design 6 – Gramercy. Those were the only two designs I submitted… guess I should have done all of them.
Trent is in the process of moving his portfolio to A Photo Folio. He said he is switching from LiveBooks for the dynamic resizing, HTML5-based iPad compatibility, in-house hosting and the pricing as compared to the custom site design he would have needed.
Brad is also teaching a workshop in Santa Fe that looks pretty cool (here).
Thanks for the props, Brad!
All of our designs have the exact same features and options so it can be difficult to spot what makes them different from each other. Here’s a simple guide to the differences.
Design 2 – Manhattan
This design has hidden menu and thumbs drawers on the left and right side of the screen. When you mouse over them they pop out. In a nutshell this design is about giving the most real estate possible to the images.
Design 3 – Brooklyn Bridge
This design has a fixed and open menu on the left making it super simple for people to navigate between the galleries and pages. The thumbs show up in a massive grid that overlays the image making it quick and easy to scan the contents of your website. In a nutshell this design is about ease of use.
Design 4 – TriBeCa
This design has a menu that is hidden on top and thumbs that are hidden on the bottom, both of which are revealed when you mouse over them. Instead of drawers opening the entire image shifts up or down to reveal the menu or thumbs. In a nutshell this design is about slick presentation and is one of the few designs that works extremely well with panoramics and wide images.
Design 5 – Chelsea
This design is very similar to Design 3 with two important differences. 1.) You can set an upper limit for the image size. All our sites have dynamically resizing images but in this design you can cap the growth at a certain point. This allows you to load smaller images for faster load times and to ensure that you know how your images will look on all screen sizes. 2.) The menu behaves a bit differently in its position relative to the image. Read about that here: http://aphotofolio.com/whats-the-difference-between-design-3-and-design-5. In a nutshell this design is about ease of use
Design 6 -Gramercy
This design has the fixed open menu on the left and a row of thumbnails along the bottom of the image. These thumbs can be set to open automatically when a gallery is selected or only show when the thumb icons are clicked. In a nutshell this design is about impressing users with a big image but also having a quick overview of the contents at their fingertips. It’s the best of both worlds.
Design 7 – Midtown
This design is very similar to Design 3 except when clicking on a gallery thumbnails come up first instead of the first image in the gallery. This allows users a quick overview of the contents of your site by loading only the thumbs, but you can still make an impact with full screen images once they click on a thumb. In a nutshell this design is about speed.
On the day Apple announced they sold one million iPads (here) A Photo Folio releases our custom designed iPad sites, built using HTML5, for all new and existing customers.
We are committed to delivering exceptional websites on all platforms, that’s why we were the first and are currently the only portfolio website design company to deliver this for the iPad.
Because our websites are database driven we can deliver exceptional flash websites for the desktop and HTML5 sites for the iPad.
The iPad sites are designed to showcase your photography and video but also make full use of the unique finger swiping capability and orientation change from horizontal the vertical.
Our database seamlessly delivers your image galleries, thumbnails, videos, text pages, links to your blog and all your contact information.
When technology evolves we do to, A Photo Folio is committed to change.
I’m agnostic when it comes to programming languages. I’m a former photo editor who now designs websites for the user/client experience, but I have no vested interest in any one programming language.
When I set out to start building sites I had certain requirements for the design and function. Flash was the only language that afforded these requirements. If another, better language comes out that meets these requirements, I would switch today.
Some people are saying HTML5 is a great new language to build sites with. Unfortunately it doesn’t meet several of my requirements.
1. Support for fonts – Art Directors love typography. It is important that our users can load high quality magazine and advertising fonts in their websites. In HTML5 you can only use a handful of web safe fonts
2. Scaling – The cornerstone of our design is the image scaling. It allows us to display images easily on monitors from 13″ – 30.” HTML5 does not support scaling.
3. Browser Independence – It’s important that our sites look the same in browsers built 10 years ago (IE7) and browser released today. HTML5 is not supported by most of the browsers people are using today.
4. Video Independence – It’s important that video on our sites displays correctly in every single browser. HTML5 requires that you encode your video in several different formats if you want it to show up in different browsers.
So, whats all the fuss for HTML5 all about? Apple decided it would not support flash in its hand-held devices (ipad, ipod-touch and iphone). But, guess what? That’s actually fine, because my requirements are not applicable on a hand held device, because it’s a fixed platform. We actually already build our iphone and ipod-touch mirror sites and our soon to be released ipad sites in HTML and will switch to HTML5 when it’s released (oh, and it’s not even been released yet so one more strike for the desktop experience).
Many experts think Flash will never be replaced on the desktop, because we’re long past the point where anything can be agreed upon as a group on the internet. You can be sure of one thing though, if anything does replace Flash as the de facto standard for a rich media experience on the desktop, we will adopt it.
PS- No matter what we will benefit from all this as Adobe makes major improvements to flash.
UPDATE #1: I found this statement from Hulu, a joint venture owned by NBC, ABC and Fox, is along the lines of what I’m saying here:
An Aside on HTML5
Those are the highlights of our new player. Before we move on to the other updates to our site today, let me address a related topic that’s been in the news a lot recently: HTML5. Plenty of users and members of the press ask about this topic all the time.
When it comes to technology, our only guiding principle is to best serve the needs of all of our key customers: our viewers, our content partners who license programs to us, our advertisers, and each other. We continue to monitor developments on HTML5, but as of now it doesn’t yet meet all of our customers’ needs. Our player doesn’t just simply stream video, it must also secure the content, handle reporting for our advertisers, render the video using a high performance codec to ensure premium visual quality, communicate back with the server to determine how long to buffer and what bitrate to stream, and dozens of other things that aren’t necessarily visible to the end user. Not all video sites have these needs, but for our business these are all important and often contractual requirements.
That’s not to say these features won’t be added to HTML5 in the future (or be easier to implement). Technology is a fast-moving space and we’re constantly evaluating which tools will best allow us to fulfill our mission for as many of our customers as possible.
The Google Chrome Browser now has Flash built in:
If you’re not ready to tackle learning wordpress you might want to check out Tumblr http://www.tumblr.com/
Tumblr is the easiest micro blogging platform in the world and can be installed on a subdomain of your website (http://blog.yourdomain.com). After your site is live sign up for tumbler and tell us where you want it installed (example: blog.mydomain.com). Then on your tumblr blog click customize, then info, then check “Use a custom domain name”. Give it the same name you told us (example: blog.mydomain.com). Done!
If it hasn’t already, your website will become more important than your printed portfolio. That’s what APhotoFolio is all about.
Portfolios have migrated online so your website must be treated as something other than storage for outdated imagery. Often an agency will award a job without calling in a book. For example, when an AD sends me a layout, we discuss style, emotional tone and production values. I will send the AD a number of websites showcasing the work of the photographers best suited for the job. Once we have settled on a recommendation (and know that the photographer is interested and available), the appropriate imagery is culled from the photographer’s site and presented to the client in a deck for their approval. Sometimes the book is called in, sometimes it isn’t.
At first glance it might seem strange that we have a Design 5 (Chelsea), because everything on it besides the ability to enter an upper limit for the size of the picture box is exactly the same as Design 3 (Brooklyn Bridge). Except, there is one other fundamental difference in the way the menu behaves. The menu on Design 3 is fixed to the left side of the screen (you can still adjust border and menu widths). The menu on Design 5 is fixed to the side of the images (you can still adjust spacing).
Here’s an example where we have a site in a browser window and we make the window more horizontal (by dragging the window out to the right) to show you that behavior.
Design 5 – Chelsea
Design 3 – Brooklyn Bridge
A Photo Client is a simple, robust, client proofing/image delivery system that we can install on your A Photo Folio website. We have over 50 photographers using this add-on software. It can easily be added to any “live” APhotoFolio website. Learn more at: APhotoClient.com.
Here are 5 reasons why APhotoClient is the best image delivery tool available:
User Experience (UX) is fast becoming an important way to create a competitive advantage for one product over another. One reason why it’s so powerful is because the end user may have no idea what makes using one product superior to another they just come away from the experience happier.
From a portfolio website perspective I’m sure you can imagine why it’s important that your potential clients have a good experience using your site over your competitors even if they don’t know why.
When creating APhotoFolio websites I came up with a list of UX practices based on my experience as a Photography Director and from reading several books that I then built into the sites. Here are some examples:
Where Am I?
Nobody likes being lost and a website with hundreds of images can be an easy place to get lost. We give users visual clues where they are using physical indicators, color and boxes.
What is important here?
Nothing teaches you the value of hierarchy like working at a magazine. Hierarchy on a website helps the user determine what is most important on the page, where to go first and how to navigate the site. You can easily create hierarchy on our sites with size, position and color of text on the menu.
Which things belong together?
We give you precise control over the spaces between items because grouping is another important user feedback to help determine what belongs together.
How much is here?
Often overlooked on websites is letting the user know how much content is available for them to see. It’s easy in the physical world to look at the size of a store and quickly determine how much is available and how much time it might take to look, but online it can be quite difficult. That’s why a menu that shows everything available, thumbnail grids and numerical feedback are important parts of our websites.
How clear is the communication?
We give you words, icons and color to communicate with, but I believe simplicity is most important. A site should be clear in its mission. If there’s anything that separates APF websites from the rest of the pack it’s our commitment to simplicity.