How to simplify your image editing in Office Live

Page Details

First published by:
Mohan Datar-msft
on 04-21-2009
Last revision by:
Monte Enbysk
on 04-21-2009
0 people found this article useful.
Bookmark and Share
Rate it:
Thanks, we’ve recorded your feedback.
By Sara Richardson-McCreery

Building an Office Live Small Business site is a fun, fast, and easy way to promote your company online. Part of owning and operating a site includes not just creation, but also maintenance and management once the site is up and running.

The Web Design Tool image uploaders in Office Live Small Business make designing and maintaining your site’s artwork a snap.

You can access the upload tools from either your Image Gallery or when you add an image to a page through the Insert an image feature. The default uploader is a nice feature if you intend to work with only a few pictures. On the other hand, if you are planning on using numerous images and will routinely edit, swap, and replace the artwork on your site, the Multiple Image Uploader is definitely the way to go.

Get started with a quick install

The Multiple Image Uploader requires installation, but don’t worry: It is simple to do. To begin, log in to your account and click Web Site, then Image Gallery. Once you are inside your gallery, click the “upload” button. The default upload tool will appear and you will see is a link that says “the Multiple Image Uploader tool” — click it! Follow the next three prompts and BING! You are ready to go.

Edit your artwork on the fly. The Multiple Image Uploader has a built-in photo editing tool so you can make instant modifications to pictures and save them to your Image Gallery automatically. With the editing tool you can:

  • Zoom in and out for precise alterations
  • Rotate left or right 90 degrees
  • Adjust the contrast to increase or decrease intensity
  • Lighten or darken by modifying the brightness levels
  • Crop, cut and trim with the click and drag arrows
  • Reset in case you want to go back to the original version

Take the two-minutes-or-less challenge

Since the editing occurs inside the uploader task space, think of your work style in terms of speed. Yes, speed. If you’re a small-business owner like me, you never have enough time, so any way you can get things done faster without compromise is a huge plus.

Out of curiosity, I timed myself with an online stopwatch to see how long it took to select five different pictures from my computer, perform a two-step edit on each and upload them all. One minute 48 seconds.... I even double-checked the work before I clicked “Upload Now.” I kid you not.

The photo editing tool is a helpful and efficient way to conduct rudimentary forms of editing, but if you are interested in more sophisticated techniques such as color correction, detail sharpening etc., I suggest using photo editing software first and then uploading them. Try the Windows Live Photo Gallery tool — it’s free, easy to install and offers a lager range of tools.

Accelerate your site with image optimization

Download time is a key factor when it comes to Web site performance. How long it takes your site to load can determine the type of experience your audience has when they visit your site. Stop and think about sites you have seen that drag and take forever to load. Did you give up and leave, or did you wait and wait and wait?

Eliminate site drag. The amount of images on a page and whether or not they have been compressed is one of the major reasons for bothersome site drag. The Multiple Image Uploader keeps your site racing like a sports car through the use of an integrated image optimizer.

The optimizer takes the guess work out of compression and ensures your site’s pictures load quickly. The built-in feature automatically converts formats to JPEG, rescales high-res imagery larger than 640 pixels (aspect ratio maintained), and compresses the file data to help minimize site load time.

Do you sacrifice speed for oomph? Sometimes compression brings out the little burrs--that’s my technical term for the day. Burrs are the blurry, grainy bits in an optimized image that can cause it to look less detailed, (depending on the amount of compression). This is where you need to make an executive decision about the amount of imagery on a page, image sizes, the benefits of optimization and the trade-offs.

However, let’s say you want an un-optimized image on a page. Keep in mind, the Multiple Image Uploader optimizing mechanism has the goal of trying to make sites drag-free. You can work around the optimizer by performing the following with photo editing software: reduce your images to a maximum of 640 pixels (height or width), save them as JPEGs and then upload them via the image uploader.

Use smart label practices to keep the Image Gallery tidy

Make your Image Gallery easier to use and more organized by utilizing labeling techniques. A few tips and best practices are:

  1. Adopt labeling prefixes for logic and order. This tip is particularly helpful because the Image Gallery auto-sorts alphabetically. Here are some prefix ideas:

    • hm-myimge.jpg “hm” references home page images
    • icon-myimage.jpg “icon” for icon elements
    • pg-myimage-sm.jpg “pg” for photo gallery images; “sm” / “lg” for small / large
  2. Compose search engine friendly labels if you want search engines to index your site’s images. Your label should be an accurate description of the image, but keep the file name brief. For example, roasted-coffee-beans.jpg has more value to search engines than ABC-1234.jpg. Be sure to use a hyphen or underscore to separate the label nomenclature.

  3. Consider compatibility with 31 characters or less when you are creating file names. Older Mac operating systems have an acceptance limit of 31 characters — anything more gets chopped off or inaccurately truncated.

Craft a labeling convention that best suits you and your Web site, but remember to make your system easy to understand for those times when you have more than one person working on your site.

Let’s see a before and after

The example below shows the original Fourth Coffee site and an enhanced version that uses a method of mixing a large photo with a group of smaller pictures in the layout. This technique helps preserve the site’s download time and adds visual interest to the page. Each of the smaller photos were modified in the Multiple Image Uploader photo editing tool, uploaded into the Image Gallery and embedded in the layout with the help of the Zone Resizing customization tool.

CS_mockup_originalv1

CS_master_v1

For more instructions on working with images in Office Live Small Business, see “Add or remove an image” in the our product Help section.

About the author Sara Richardson-McCreery is an 11-year veteran Web developer with proven expertise in custom Web site design, development, and usability for clients ranging from big brands to startup organizations. She is the creative director and founder of Spike Likes Web Design, an award-winning Web design company located in the Washington, D.C., area.

Filed under: , , , ,

Recent Comments

By: MarvinScheele Posted on 06-06-2009 8:02 PM

Still need a simple way to add alternative text to the images.  I suggest a text box in the insert image function.

By: nogarddragon Posted on 06-05-2009 4:02 PM

I found this to be a very informative, interesting and useful Article.It was focussed and extremely well written.Perhaps one day I will be able to compose something as good!

Accessibility | Legal | Privacy | Report Abuse | Code of Conduct | Site Help | Office Live Workspace Community
© 2009 Microsoft Corporation. All right reserved. This site is hosted for Microsoft by ComBlu with hardware provided by Rackspace.