A guide to foursquare image sizes
Traditionally, users haven’t really cared about the way images are cropped and resized on foursquare because they’re more of an “in the moment” type of thing. But as more and more brands start to use the platform — especially with the advent of local updates — more of those images are going to become “crafted.” If a restaurant is showing off their newest burger, for instance, they need to make sure users see the item they’re referring to and not the French fries at the bottom of the plate.
With foursquare’s wide variety of image sizes across the website and apps, it’s sometimes hard to tell exactly how that image will look when users see it. Some images are cropped wide, others tall and yet others are square.
The templates below can help guide you in making sure your images will appear as planned once foursquare does their cropping to make sure the important parts are visible across the range of places they’ll be seen. To represent the mobile apps, we’ve shown sizes from the iPhone app, but the Android apps follow roughly the same ratios even though their pixel sizes will vary (by device).
Check-in Photos/Local Updates
Check-in photos and local updates both follow the same dimensions. In the website activity feed and mobile app detail screen, they’re shown with a short, wide crop. Inside the mobile activity feed, it’s more of a traditional horizontal photo crop.
On the website, they can also appear in a few different sizes depending on how many images are show. If two are shown, the leftmost image is narrowed and a vertically cropped image appears next to it. If three images are shown, the second and third photo are both horizontal images.
On venue pages, the photos will be cropped to a square. This is likely the least important configuration to work around.
In either case, the top portion of the image could be blocked by the shout or update message. The white box grows depending on the number of lines of text required.
Tip Photos
Like check-in photos, tip photos appear in short, wide crops in the activity feeds. Clicking through in the mobile apps takes you to a square view, while the clicking on the desktop version reveals the entire photo.
Other Images
There are a few other images that you’ll find throughout the site:
- Profile Photos: These vary greatly in size, but always appear as squares. They can incorporate transparency, which appears on a white background in most spots, but creates a neat effect on user profile pages.
- Brand Headers: 860 x 130 pixels is the standard anywhere on the site.
- Explore/Promoted Updates: The mobile app version of Explore is very photo heavy. Images at 600 x 240 top every entry, but these aren’t worth optimizing for because it’s impossible to predict which venue image will be seen by users.
Bonus tip
Sometimes pictures need to be animated for the full effect. Any foursquare photo you can upload from your desktop (tips for everyone, plus local updates/check-ins for brands) can be an animated GIF. It will only appear animated on the website, though. The mobile apps ignore the animation and show just a still image.
Please note: these sizes were current as of July 30, 2012, but could change at any time.
