Be smart with on­line pics

The dos and don’ts of im­ages for your web­site

Mac Format - - CONTENTS -

The in­ter­net may have started its life as a text-only medium, but to­day it’s ca­pa­ble of all kinds of won­ders - and that means you aren’t lim­ited to mere words

to get your mes­sage across. You can add pho­tos or videos, mu­sic or maps – the range of avail­able con­tent to make your site sing is truly mas­sive. Last is­sue you dis­cov­ered how to make words that work for your web­site. This time you’ll find out how to sup­ple­ment those words to make your site a mul­ti­me­dia marvel.

We’ll look at two kinds of con­tent. The first is con­tent you pro­vide, such as the im­ages you use to il­lus­trate your site’s pages. The sec­ond is con­tent you em­bed from another site. Here, we use a map from Google Maps, yet you can em­bed all kinds of things: Twit­ter feeds, Face­book videos, YouTube clips, SoundCloud and Band­camp mu­sic, and much more.

The big ad­van­tage of em­bed­ding con­tent is that you don’t need to rein­vent the wheel. We’re sure you’re per­fectly ca­pa­ble of mak­ing a won­der­ful map, but why bother when Google has al­ready done the work for you, and when it can also of­fer your visi­tors live traf­fic info, satel­lite views, driv­ing direc­tions and lo­ca­tions of nearby points of in­ter­est?

Scratch my back…

Em­bed­ding con­tent is par­tic­u­larly use­ful when some­body else owns the copy­right. Upload an Adele video to your site and you’ll re­ceive a nasty­gram from her record com­pany for copy­right in­fringe­ment. Em­bed the of­fi­cial clip from YouTube or Vevo and the com­pany will be de­lighted; you get the video and it gets de­tails of the num­ber of views, what plat­forms were used to ac­cess the video, and so on. It’s a win-win sit­u­a­tion, with free con­tent for your site and use­ful data for the com­pany.

Another kind of embed­ded con­tent is that which you’ve up­loaded some­where else. It may sound daft to record a video on your iPhone, upload it to YouTube and em­bed the YouTube ver­sion on your own site, but it’s ac­tu­ally a very good idea. It means your video can be dis­cov­ered, shared and com­mented on by

YouTube’s many mil­lions of users, and if your video be­comes a huge suc­cess you won’t need to worry about pay­ing the bills for all that data trans­fer. That’s YouTube’s prob­lem, not yours.

Em­bed­ding is usu­ally set up by the third­party web­site that pro­vides the con­tent, but there’s another way to use con­tent from others: link­ing di­rectly to files on servers. That’s okay if you’re link­ing to some­thing like a PDF file on a big com­pany’s web­site, but it’s a bad idea for con­tent such as im­ages; do­ing so with­out the owner’s per­mis­sion is called hotlink­ing, and it’s a no-no for sev­eral rea­sons. It’s usu­ally copy­right in­fringe­ment; you’re ex­pect­ing the owner to cover band­width costs of serv­ing the im­age to your visi­tors. Also, it’s eas­ily de­feated by them re­plac­ing the im­age. As many un­scrupu­lous hotlink­ers have found, that some­thing else can be the kind of im­age you re­ally don’t want to ap­pear on your site.

When us­ing other peo­ple’s con­tent on your site, stick to a sim­ple phi­los­o­phy: if there’s a big “Add this to your site!” or em­bed­ding op­tion, go ahead and use it; if there isn’t, don’t.

Of­ten, the best place to get pic­tures is your own photo li­brary. The in­ter­net’s also great, of course, but don’t just grab what­ever you fancy from Google Im­age Search. There’s an at­ti­tude that if some­thing’s on­line, you can use it for free. That isn’t true, and ev­ery im­age re­mains the prop­erty of its copy­right holder – usu­ally the im­age creator or pho­tog­ra­pher, or the com­pany for which they made it.

You can get free im­ages on­line, though. Google Im­age Search can fil­ter its re­sults by us­age rights to only see what you can re­use. There are en­tire sites of free pics, such as un­ and; at the top left of Flickr’s search re­sults, click Any Li­cense: ‘Com­mer­cial use al­lowed’, ‘Mod­i­fi­ca­tions al­lowed’ and ‘No known copy­right re­stric­tions’ are the cat­e­gories to browse.

On­line im­age dos and don’ts

It’s tempt­ing to throw a bunch of im­ages on to your pages and hope for the best, but a few sim­ple steps can make your life a lot eas­ier in the long run. A sen­si­ble nam­ing con­ven­tion is good for or­gan­i­sa­tion and be­ing Google­friendly – ‘Bath Cathe­dral front.jpg’ is more help­ful than ‘IMG003129.jpg’ – and it’s wise to fill in alt(er­na­tive) text for im­por­tant im­ages in your site (do so by dou­ble-click­ing the im­age in RapidWeaver) to show visi­tors alt text if the im­age isn’t shown, to as­sist peo­ple with vi­sion im­pair­ments, and au­to­mated sys­tems such as Google’s web­site in­dex­ers. You needn’t use alt text for purely dec­o­ra­tive im­ages, and you shouldn’t stuff it with key­words you hope will raise your site in Google’s re­sults. They won’t.

Oth­er­wise, add alt text and de­scrip­tive cap­tions. For our ear­lier ex­am­ple, a file named ‘Bath Cathe­dral front.jpg’ with alt text ‘Pic­ture of Bath cathe­dral in day­light’ and a sim­i­larly de­scrip­tive cap­tion is use­ful and Google­friendly; ‘IMG003129.jpg’ with­out alt text isn’t. What­ever you do, don’t make im­por­tant text part of an im­age with­out also adding it to a page’s body copy, or it might go un­seen by those with sight is­sues or poor con­nec­tions. Left to your own de­vices It’s also im­por­tant to con­sider mo­bile de­vices. They’re in­creas­ingly used, rather than Macs or PCs, as peo­ple’s main web browser, of­ten on mo­bile net­works with lim­ited data us­age. Op­ti­mise your im­ages to make them as small as pos­si­ble with­out be­com­ing un­recog­nis­able. As well as re­duc­ing visi­tors’ data us­age, it also makes your pages load more quickly. You can re­size im­ages in Pre­view: open them all, select them all and pick Tools > Ad­just Size. There are batch im­age ed­i­tors in the Mac App Store, should you need more ad­vanced tools.

The trick to choos­ing on­line im­ages or any other kind of me­dia is to keep it fo­cussed, rel­e­vant and ap­pro­pri­ate. One well-cho­sen im­age or use­ful bit of embed­ded me­dia can be more ef­fec­tive than a page plas­tered with all kinds of things. Al­ways ask your­self: does this make my site bet­ter for visi­tors? If the an­swer is no, it’s got to go. Gary Mar­shall

Newspapers in English

Newspapers from Australia

© PressReader. All rights reserved.