There is a link which when clicked displays images as an overlay (translucent black background, center aligned image). Clicking outside the image or pressing escape key closes the overlay. At present I have not placed a close button. Is a close button necessary? This is a website. The images can be of varying size.
Although it has become quite common that overlays close on an outside click, it brings some usability flaws if you don't offer the close button:
- Users that are new to the internet might be confused or feel lost when they can't find the close button (my mother, for example)
- On (some android (?)) tablets, these overlays still don‘t seem to work really well, and closing the window by clicking outside is sometimes not possible (don't ask me why, it's just my experience).
Also consider users that are kind of experienced, but never came in contact with the missing close button - what will they do?
With a nice and big enough "X" (or better the word "close"), you wont't have these problems. And I doubt it will seriously break your design.
I would make the choice to add a little x in the upper right corner. perhaps on hover since its a web app. Make sure it doesn't distract from the photos if you can.
Here's the part of my answer that's important. TRACK IT!
As they say, "The reason you have a choice is because the answer is unclear"
Use mixpanel or google analytics or the like to track the escape, click outside or the "x" and find out what your user base REALLY does.
Very simple and free to do. If you do so, post back the data you get here. We'd all like to know.
I have came across few interfaces which use java script overlay window to display enlarged images. These overlay windows carry controls to navigate forward and back but lack a CLOSE button. You cannot close by clicking outside the image (on overlay windows itself) and there is no CROSS or Close button to click. You can close overlay mode by clicking on the image itself but there are no clues, no directions, no hints that you could get out of overlay mode and continue to read page's content.
An example: http://jacksonchoi.com/archives/100
I find this overlay pattern without a close button confusing and frustrating. However with the persistence it is being used, I feel it is being accepted and perhaps goes through user-testing as well. This site offer user experience and usability solutions and they keeping this overlay mode is rather a surprise. Howerver if I was the subject of a useability pattern, I must have stuck there and wouldn't had clicked on the image unless I had started random clicking which a user does if he feels stuck on a page.
Concluding: it is a bad usability pattern and I would put an X or a text "close" on the top-right corner of the window.