Explore tips about working with photos and taking photos for your website.
- [Instructor] More than any other element on your site, photos help your site visitor connect emotionally with your brand, your products, and with you. Before you begin, you'll want to choose the right kinds of photos for your site. Choose photos that support your page's content. They should have something to do with the text on the page. The photos should show and demonstrate your product or service. Photos of smiling people are really nice, but it's better if they are smiling about your product or service, not just smiling to be smiling.
Tell a story in your photos. Sometimes, a photo conveys more than just how your product looks. How does it make your clients feel to interact with it, or with you? And finally, support your brand. Is your brand more formal, or more casual? Your photos should reflect that style. Beautiful, professional photos are the best way to go. If you don't have a big budget for your website, try to scrape together a few bucks to hire a professional photographer to create some striking images for your website.
If you can't afford this, spend a little money on online or stock photography. The right photo in the right location can make all the difference in a successful website. In general, Squarespace sites feature two types of images. First, there are some spots for very large photos. These are often banners that stretch across the top of the page, or a large background image. You can also use smaller photos in the sidebars or in the main text of your website.
Make sure your photo is the right size and shape for the location where you intend to use it. What do I mean by that? As you know, images come in two over-arching shapes. A tall rectangle, and a wide rectangle. These are called portrait and landscape photos. Or, portrait and landscape orientation. You may have seen these terms associated with your printer. They apply here in photography as well. As much as you might love one photo verses another, you can't fit a square peg in a round hole.
You also can't fit a landscaped photo in a portrait hole, and vice versa. When images in the right format are placed in the right locations, you will improve the look of your website. If you're taking photos for your site, this is a good reason to take a photo in both orientations. You'll then have a landscape and a portrait version of each scene, so you've got more flexibility in how you use your photos. In general, when working with images on the web, here are some things to keep in mind.
These are web things, not just a thing limited to Squarespace, by the way. There are only three image formats that work on the web, JPG, PNG, and GIF. JPG is used for photos, PNG for logos and cartoons, and GIF is for animations. As you know, there are other formats that are available like TIF or Bitmaps. However, these image types don't display on the web. Before you can use images in these and in other formats, you'll need to re-save them as JPG, PNG, or GIF as appropriate to the type of content in the image.
Small images don't scale well. Let's say, for example, that you have this photo that you absolutely love. Unfortunately, it's very small. If you try to blow it up and make it bigger, you'll wind up with the jaggies. When images are small, they contain less information than a large image. If you blow up a small image, you're taking the same amount of information but spreading it over a larger area. That's where the jagged edges come from.
It's a lack of information on the screen and the computer is doing its best to display the photo anyway. It's always better to go down in size from a beautiful, large photo to a smaller version of that photo. The photo will always look good at a smaller size because it never lacks for information. You can also consider cropping the photo to focus on a small part of the photo. That will keep the focus on the detail in the image, even at the smallest sizes possible.
Keep in mind that these are great tips for stunning images that will greatly enhance your Squarespace website.
- What is Squarespace?
- Planning your website
- Choosing a template
- Laying out a homepage for your website
- Adding banner photos
- Configuring the header and navigation
- Working with images in text
- Integrating email newsletter signup with MailChimp or Google Drive
- Configuring and styling an image gallery
- Launching your site
- Examining analytics