Friday, 21 December 2007

Pick up the batphone

We have an incoming line to our team in the office for any customers having trouble logging into their online account/profile e.t.c. It's known as the batphone.

I found this very amusing, but it's not original; corporate batphones appeared on Wikipedia twelve months ago. Nevertheless 'batphone' is now up there with 'spam' in my favourite web buzzwords.

Why do IT people use comic book words for everything?
In my last job whenever someone from the IT department logged in as administrator to install a programme or release the child lock the password they used was one of or a combination of the following: be0wulf, sp1derman, wolver1ine, sup3rman.

Now surely this must stop in the interests of corporate security. If someone like Stan Lee decided to become a hacker he'd have access to half of the capitalist world in less than a month.

Thursday, 13 December 2007

Is interlinking sites on the same server bad?

Many companies own many different websites. For example a publishing company may own 20 different sites for its 20 magazines. Now what's to stop them putting a link to each site in the footer of each site?

What's the effect on SEO of doing this?

I’ve looked into this linking issue and there are hundreds of conflicting views about the effects of it. I can’t find anything that says it’s either bad or good.

This forum covers both interlinking sides of the argument and leads me to the following conclusions:

  • Google will treat links between sites from the same server like internal links – some weight, not much.
  • From a usability perspective it would NOT make sense to include links to your unrelated sites in the footer.
  • From a usability perspective it WOULD make sense to include links to your related sites in the footer.
  • Spamdexing (linking lots of sites purely for SEO) is punished.
  • If you design for the user you won’t be punished.

If a publishing company has a site for accountants it would make no sense whatsoever from the user's point of view to link in the footer to their site aimed at 10 year olds.

However if they were to link to a site for human resource professionals in the footer of the accountancy site it may make more sense.

If you think about this subject from Google's point of view why would they want to punish someone who's genuinely trying to give the user a good web experience and also encourage visits between related sites?

Link your relevant sites together, it will help your SEO as much as internal linking will (ignore internal linking at your peril), however don't do anything EVER that will not benefit your users, confuse them or send them to places they don't want to go.

Remember all those passwords and user names

So many websites, so many passwords, how do you remember them? Regularly clicking the 'forgot your password' link is my favourite.

I have to have a log in name and passwords for well over 20 sites such as email, social networking, ebanking, travelcard, supermarket loyalty cards, eshopping, YouTube, Wikipedia, the list goes on.

I regularly forget on logging in what password I've used or what user name i was forced to call myself as a result of all the obvious ones being used up when i registered.

The extent of this problem is highlighted by the fact that i can point you to an article on this subject from no less than 8 years ago. This article ends with the conclusion that we're stuck with remembering multiple user names and passwords until finger scanners are routine on computers.

Finger scanners! I admit i have seen laptops with these gadgets but it's still going to be 2050, flying cars and robots before every computer has finger scanners.

Add to this that web professionals 'recommend' using different passwords for different accounts as well as non-word passwords including symbols and numbers to avoid hacking.

So what to do? Well I've had a little look and come up with some options, listed in order of best to worst.

  1. Remember them! - This is what i do. Admittedly i forget my passwords as often as I drink tea but then every site has a 'forgot your password' link.
    Disadvantages: You might have the memory of a goldfish
  2. Write relevant passwords - For each site you use create a password formula. For example, the site name backwards followed by your dog's date of birth and all o's and i's replaced with 0's and 1's. ie. Facebook - k00becaf0308 There are far cleverer formulas out there.
    Disadvantages: Break the formula and someone has access to all your sites. Your formula is so clever you confuse yourself.
  3. Use cookies - Both Firefox and IE will store your passwords as cookies so that when you revisit a site you're automatically logged in.
    Disadvantages: Because you end up having to go through the log in process less, when the time comes when you have to log in (such as when on a different computer) you've completely forgotten your user name and password.
  4. Password managers - I don't like the idea of storing passwords as you just need someone to hack the password manager and 'bang' you've lost everything but according to this Simple Website Guide article there are some safe options.
    Disadvantages: Lose all your passwords at once.
  5. Use your browser's in-built password manager - A bit more advanced than cookies, Firefox will keep your passwords in its own password manager. IE probably does this too.
    Disadvantages: Same as cookies and password manager.
  6. Write them down - The most foolish of options but according to 'Orlick', apparently they'll be fine if you lock the paper away in a safe.
    Disadvantages: Anyone finding the piece of paper has access. For example someone breaks into your house steals the safe and can assume your online identity immediately.
  7. Create a new identity - Change your name, home address, date of birth and all personal details to create a new online persona. Use 'password' for all your passwords and when someone steals your identity, who cares? It's not yours anyway.
    Disadvantages: None, it's foolproof.

From this point on i will be known only as Miss Penelope Smallbone.

Update, 8th Feb 2008: Tech giants Microsoft, IBM, Google and Yahoo have joined the board of the Open ID Foundation which aims to streamline login systems across the web.

Saturday, 8 December 2007

7 top tips to avoid email spam, phishing and fraud

As the web gets more sophisticated so does phishing (fraudsters trying to gain your personal information through masquerading as a trusted source).

One of my colleagues recently received the below spam/phishing email:
Date: Thu, 6 Dec 2007 19:18:58 +0800
Subject: Domain names of Shedshow (to CEO)

Dear CEO,

We are the domain name registration organization in China, which mainly deal with international company's in china. We have something important need to confirm with your company.

On the Dec5, 2007, we received an application formally. One company named "Jufeng Holdings Limited" wanted to register following

Domain names:

Internet brand keyword:


through our body.

After our initial examination, we found that the keywords and domain names applied for registration are as same as your company's name and trademark. These days we are dealing with it. If you do not know this company, we doubt that they have other aims to buy these domain names. Now we have not finished the registration of Jufeng company yet, in order to deal with this issue better, Please contact us by telephone or email as soon as possible.

Best Regards,

Mars zhou

China Net Technology Limited

A quick web search on some of the sentences within this email revealed other people who'd received this and replied, in many cases with quite shocking results (read the article comments). This forum also linked to in the above article features more people who've encountered this particular scam.

But what if you don't realise it's spam? In fact before this email was brought to my attention one of my colleagues had replied (any further emails i receive from these scammers i will be ignoring and deleting).

It's very easy to get duped. So, 7 top tips to avoid being scammed:
  1. Do you know the company / person emailing you?
    • If you answer 'no' to this question then this is where you should question the email's credibility.
  2. Do some research - the first hit i found on Google for "China Net Technology Limited scam" was somebody who'd received the same email.
  3. Does the email ask you to take action / spend money? - if 'yes', beware
  4. Can all the information they've included in the email be gained without knowing you? - if 'yes', beware
  5. Speak to people you know - if the email talks about domain names then contact your domain provider. If they ask for bank details contact your bank (using the number you know, not the number that may be in the scam email). If they ask to confirm your Paypal details contact Paypal (again not from links in the spam email but via the Paypal website).
  6. Beware lookalikes - It's very easy to make something look genuine online, for example a scammer could buy (as opposed to the real to pretend to be your bank.
  7. Calm down - it may seem obvious but a genuine bank request or a genuine domain enquiry won't ask for immediate response and won't do so buy email, more likely than not they'll go through more official channels and post a letter to your home address or alert you when you log in to your ebanking or domain account (again using the URL you know NOT one in an email).
Related posts
Spammers target web nerds with Homer's email address

Monday, 3 December 2007

Can social networking sites afford to bank on future success?

Facebook is playing a dangerous game holding off going public for a 'couple of years'.

The speed with which Facebook quickly became part of our lives (I knew nothing of Facebook this time last year) surely is a good indication of how the same thing can happen, and i'm pretty sure WILL happen when the next big thing comes along.

And it's a brave man at Microsoft who paid £117m for just a 1.6% stake in Facebook. Remember Friends Reunited? One of the biggest sites in social networking, it's now being forgotten and finding it's methods old fashioned less than two years after it was bought (entirely) for 120m. If something bigger and better does come along then Facebook may start wishing they went public at the height of their powers and before that valuation of £7.3bn starts looking steep.

There's nothing to currently suggest Facebook is waning in popularity (although I check my Facebook profile a lot less than i did 6 months ago) but if i had £117m to spend on social networking i'd be looking at the future of social networking, and i don't think that's going to be Facebook.

The internet is becoming more and more personalised, iGoogle gives you your own search home page, MySpace show no signs of being a flash in the pan with it's own brand of 'let the user decide what's best' social networking, social bookmarking / RSS / news aggregators and blogging lets users pick and choose their own news and opinion. Marketing emails are addressed to your name, and offer you products that they know you have an interest in, if they don't you hit delete. Even the spam i get now is personalised, "Dear Ed, would you like a 9 inch...".

Unless facebook starts to provide more flexibility to users on everything from what their home page looks like to who and what can sign up they are going to start leaking users to sites such as

Ning is a 'network of networks', allowing users to create their own social network and surpassed the 100,000 social networks figure a couple of months back. I'd put good money on Ning receiving a large amount of investment soon and i wouldn't be surprised if that company's name began with 'Goo' and ended with 'gle'.

Now this is just one vision of the future, there are plenty more ideas in the ether, most probably on the desktops of university students with an interest in open source.

Just don't spend your £117m of investment without doing a bit of research.

TIP for CEOs with wads of cash: What social networking tools are your children using?

(Update: I've just read this business article online which sounds exactly like my article! It's either great minds thinking alike or plagiarism of the highest order.)

Related posts
Stop poking me, I'm bored of Facebook
Everyone's bored of social networking
YouTube, Facebook, BBC and Reuters discuss social media

Wednesday, 28 November 2007

Don't just have alt tags on images, include height and width too

A fact i hope everyone making websites knows - include an alt tag with all your images.

Doing so will ensure that your website meets accessibility requirements but more importantly it lets everyone use your website including those with screen readers.

Now something i hadn't bothered with until recently was the height and width attributes. If you make your image the right size and don't include the height and width attributes then the image will be displayed the size it is. 'Why bother with height and width attributes?' I thought to myself.

WRONG! By including height and width attributes you will be improving your web page, making it load faster and making a better experience for your users.

While images are still being downloaded your web page will appear correctly because all the spaces where images should be are the right height and width.

Have you ever been onto a site and found that as the images load up, the text and copy and design all start pinging all over the place? Well that's because they haven't included height and width attributes.

It also means that if an image fails to load completely your page will still look the same, and if you've put in a useful alt tag the impact on your web page design is minimal. More info on height and width tags here.

For example, see my fictional code for a pretend image of a certain rock god in a tourist hotspot
including height, width and alt:

<img src="" alt="Robert Smith standing in front of the Taj Mahal" width="75" height="100" />

Related posts
Search images by the colours within them (Feb 2009)
Give images rounded edges using Photoshop (Nov 2007)

Tuesday, 27 November 2007

Make a favicon - the little icons in the browser address bar

Favicons are the little icons that appear to the left of the url in your browser address bar. They also appear next to the site name in your 'Favorites'. See below, i've subtly circled the favicons in red.

screenshot of Internet Explorer's address bar with the favicon (little icon) circled

How to create a favicon
Your favicon needs to be 16 x 16 pixels so open up Photoshop (or a graphics programme, even 'Paint' will do) and make yourself a nice little icon that's 16 x 16 then save it as a gif or a bmp. Because this size is so tiny you may find that just reducing your logo to 16 x 16 will make it look a bit sh*t so have a play and keep it nice and simple.

How to get it into the right format
Favicons need to be .ico files. Now there is an open source plugin from telegraphics that you can get for Photoshop that will allow you to save the file as an .ico.

However i've just created a favicon using an online converter that's really easy to use:

  • Upload your gif (or whatever) file (you can even enter your twitter username and just use your profile pic)
  • Click 'Generate FavIcon.ico'
  • Bob's your uncle, you're given a nice little zip file containing the precious .ico file.

How to add it onto your website
Upload the favicon.ico file to your website folders. It needs to be put into the same folder as your home page, make sure it's not in an images folder but just sitting there on its own.

Then add the following HTML tag to your web page after the <head> tag and before the </head> tag:

<link rel="Shortcut Icon" href="/favicon.ico">

You'll have to put this in the html for every page you want the favicon to appear on, or if you are using CSS (which you should!) then it just needs to be in there. [update: see the comments, you can't add a favicon to CSS]

If you still can't see it make sure you are using Firefox to browse the web as Internet Explorer creates problems just to entertain itself.

Collecting favicons
While surfing the web for the information in this post i also discovered a private society of individuals (well one guy) who collects favicons. An interesting hobby i'm sure you'll agree but i can't imagine that they have the resale value of stamps, china dolls or antique pepper pots.

Tuesday, 20 November 2007

Applying the Facebook metaphor

I was in a meeting today and somebody was asked, "What's the difference between a conference and an exhibition?"

The reply was, "well, for example i see an exhibition as all your Facebook friends, however a conference is better described as a Facebook group, because it's more specific, it's about a particular interest group."

I really like this metaphor and think it sums up the difference well. Social networking is 'social' networking because it puts already existing social concepts into another place that's easily accessible, online.

This transfer of an existing interaction onto the internet perhaps goes part way to explaining the huge popularity of social networking at the moment. Nothing much had to change in people's thinking.

The less somebody has to think the better something works, and i mean that for anything! Websites, instructions, social networking sites, online networking...

Monday, 19 November 2007

20 email marketing tips

Over the past couple of years I've been told loads of things to get the 'perfect' email. I came across a list of the most obvious marketing tips via Peter Stringfellow lookalike Andy Owen who I saw at an internet conference. (his original list, PDF, 308KB)

However since then some things have changed (the popularity of Blackberries (-ys?!) for one), so below is my plagiarised, borrowed, chopped, cut and changed, top 20 tips.

Vital assumption before sending email: "Nobody is interested in your company, your brand or your product".

  1. Prepare, prepare, prepare – think before you write.

  2. Address the following four reasons why the customer wants to delete your email:
    - I don't believe you
    - I don't need it
    - I don't have enough time
    - I don't have enough money.

  3. Subject line – must be less than 50 characters, less than 40 is even better if you can get the point across clearly.
    - Have a BENEFIT laden headline ie. 'Speak to architects at our building exhibition' / 'Coca-Cola is more refreshing than Pepsi AND cheaper'.
    - The subject line is probably the most important part of the email, and there's lots more to think about too. Read 15 more rules JUST about subject lines!

  4. Use system fonts - use arial, verdana, times new roman - any font you can be sure appears on your recipient's computer/blackberry.

  5. Connect with your customer in 3.7 seconds – establish trust. I've no idea why it's 3.7 seconds, probably a fake statistic but it seems as good a figure as any. The important point is to connect QUICKLY!

  6. Formulaic – don't try to be too clever, stick to standard information – prices, ISBNs, ways to contact you, dates.

  7. First paragraph – this has the UTMOST importance. Get this wrong, they stop reading. Consider this next time you read a boring email.

  8. Use simple words – people don't like reading off screens, especially if you start using complicated, convoluted, labyrinthine and problematical words. ; )

  9. Describe BENEFITS (what it does) rather than FEATURES (what it is) - this is one of the golden rules of marketing i learnt on my Marketing degree and it applies just as strongly to email copy.

  10. The copy must believe in itself – if you think it's rubbish, it is.

  11. Good layout – make it look good by;
    - keeping short sentences - have you ever been on the BBC website, there's a reason why they only have one sentence per paragraph, it's easier to read off screen
    - spacing things out - learn to love white space
    - using pictures

  12. Good copy;
    - Good spelling and grammar - Get it proofed by someone who can spell, not the office boy who can't distinguish between your and you're - remember that Friends episode?
    - Use magical words - If you can get an exciting word in there, use it! Think of your text in terms of style and panache, if your email is fun to read then it can only add to its effectiveness. For example:
    'Buy our books they're the best'
    'Buy our fantastic books, not only are they leather bound but we've also got Harry Potter.'

  13. Be specific – 71.8% of customers said this, not 70% of customers said this. (which do you think looks better?)

  14. Testimonials – if you can find one use it. There's nothing better than getting someone else's opinion.

  15. Guarantees – if you can think of any, reassure people.

  16. A unique offer - If there's no unique offer there will be no sale. What's the selling point? People don't want simple news or being told something they already know.

  17. Call to action - Tell them what to do;
    - click here for more information
    - buy online now
    - ring Jane Smith immediately etc.
    If there is no call to action / no reason to click through / no phone number to call you then you won't get a response, funnily enough.

  18. Test it – send it to yourself and 5 other people. Send it to someone not within your company. Send it to Hotmail / Gmail.

  19. Plain text - Make sure your email is sent in HTML and plain text. Then make sure that the plain text looks as good as you can make it - a large percentage of your customers (those on Lotus Notes, Blackberries e.t.c) can probably only receive plain text so don't ignore them.

    You can make plain text look better with spacing, ----hyphens----, ***stars***, good copy and more.

  20. 'From:' address - Have something meaningful, a name is best. Then when your email lands in someone's inbox they will see
    'From: Simon Templar' 'Subject: I speak lots of rubbish'
    as opposed to
    'From:' 'Subject: I speak lots of rubbish'

There are hundreds of blog and web articles like this one, just search for yourself (Comprehensive best practice resource from EmailLabs). However don't get bogged down reading every rule as you'll never actually send the damn thing. Commit yourself to just checking 3 of 4 new hints/tips/rules in each email you send. Within a very short period of time you'll start creating your own rules, or redo mine!

Related sites
Email standards project - providing standards for HTML email design. Make sure your email template designer has read this!

Related posts
Check the readability of your copy (Mar 2009)

Thursday, 15 November 2007

Stop pop-ups popping up, online advertising needs to evolve

The best advertising is stuff that's relevant to people and makes the best use of the format it's on.

(I know that some intensely annoying adverts do sometimes work, such as the Michael Winner Esure 'don't panic dear, it's just a commercial', which force the name into the forefront of your mind due to it p*ssing you off. However i'm going to gloss over these as it's not an avenue of marketing i ever intend to get involved with. There's something intensely crass about starting a relationship with your customers by being obnoxious.)

Best TV ads? - Well the ones that use the fact that you can produce film quality video, that people appreciate humour, that people want to be emotionally involved and that people channel hop. I'm thinking the Honda cog advert, most of the Guiness adverts, iconic adverts like Hovis and Flake.

Best radio ads? - Ones that punch through the airwaves, good examples are anything with clever humour. It's so easy to ignore a radio ad so they need to pull you in.

Magazine, cinema, billboards? - I'm sure you can think of your own.

The above i hope shows the importance of adapting to the medium.

Web? Well this is where it get's fun.

Starting off with 'traditional' online advertising. A banner ad that is static is essentialy what every ad in a newspaper is, it doesn't move, it's an image, you look at it or more likely ignore it. Online ads are evolving now, a good example are expandable ads (please leave a comment if this link is dead and i'll find another example). Now these sit like a banner till you put your mouse over them. In theory they let the user choose to interact. Other types of web advertising such as pop ups, floating ads, takeovers are the web equivalent of Michael Winner. Even expandable ads can be annoying when you accidentally hover your mouse over them.

The future? - Well despite this banners ads are here to stay. For the same reason that there are still rubbish sofa ads on TV, boring adverts on the radio and invisible adverts in magazines, somebody (sharp suit, pink shirt, drinks Stella, you know the type) somewhere will always be using the previously mentioned web ad options.

Clickthrough rates are on average 0.4% these days and this falls to 0.04% on Facebook (social networking ad tips article). Unless you're getting monumental site traffic, clever web advertisers (jeans, t-shirt, converse trainers, drinks tea) need to ditch banners and start getting innovative.

There are ways; some are downright scary visions of privacy invasion, others are mild and welcoming, like a bowl of tomato soup.

  1. Targeted advertising - We know so much about people that they can be targeted on their likes and dislikes. For example, my facebook profile contains my favourite films. An example targeted ad campaign would be Amazon displaying an advert on my home page, specifically targeted at me, selling the latest special edition DVD releases of these films i've added to my profile. This i believe is one of those scary invasions of privacy, but it's already happening so be wary, advertisers should atleast give people the choice (Google take notice!)

  2. Contextual advertising - You write a blog article or review about a certain book, Amazon then places an advert on your page offering that book (here's one i made earlier). Similarly, some websites use advertisers that highlight certain words on their page.

    For example the sentence:
    "And JK Rowling earned 3 squillion pounds from Harry Potter"
    would become
    "And JK Rowling earned 3 squillion pounds from Harry Potter".

    Go look at an article on the BBC, how many words in that article could potentially link to an advertising opportunity? Again, this isn't a fave option of mine as it's too invasive

  3. Part one. Engaging with the user - Ah, my favourite, 'tomato soup' option. Sites such as facebook invite advertisers to engage users by doing things such as creating applications. You can play the Red Bull Roshambull 'scissors, paper, stones' game on Facebook - Here Red Bull get some advertising, you've chosen to engage with them and everyone is happy.

    This is the way advertising should be in the future, brands work with you, and NOT just by sponsoring something - that's the lazy way. That means less advertising, but better advertising. More performance per ad pound spent for less ads and more engagement.

  4. Part two. Provide something for the user - The same as above really, let the users come to you by not annoying them and being engaging. A good example is the recent Cadbury TV ad, they added it to YouTube, people created spoofs, the brand lives on. Same thing with the Dove advert. I know this is more viral marketing than online advertising but the boundaries between the two need to be blurred.

Enough of taking offline principles and applying them online, let the web revolution begin!

Related posts
YouTube, Facebook, BBC and Reuters discuss social media (Feb 09)
Monitor the online buzz around your brand (May 09)
What is the average click through rate for online banner ads? (Jul 09)

Wednesday, 14 November 2007

Aren't Google Alerts clever?

I've just discovered Google Alerts. For those who like me before yesterday, are unaware of the usefulness of this cunning little gadget let me tell you using my two days of experience.

You type in a search term, for example one of mine is "web marketing", and then every day (or however often you specify), Google sends you a lovely little email containing recent blog posts and news regarding this subject.

Previous to this breakthrough i used to keep up to date through a selection of RSS feeds on my iGoogle page, by having a quick dabble on search engines once every couple of weeks, maybe receive some useful emails from friends, read a bit here and there in magazines not targeted at web (such as Marketing and Marketing Week) e.t.c.

Now i get some nice summaries every day, inevitably i click through to two or three and then due to the nature of blogs i also end up wandering through some other posts linked from these.

I'm now far more in the loop than i was before as most mornings I do 15 minutes of really relevant surfing, not to mention still doing everything that i did before on an ad hoc basis.

Related posts
Monitor the online buzz around your brand (May 09)

Monday, 12 November 2007

Give images rounded edges using Photoshop

photo without rounded edges

photo with rounded edges



Use photoshop to give your images nice, friendly curvy corners like I've just done above using these easy to follow instructions.

(If you're Portuguese i apologise at how rude the above sentence may sound when read out loud)

Related posts
Search images by the colours within them (Feb 2009)
Make a favicon - the little icons in the browser address bar (Nov 2007)

Friday, 9 November 2007

Make some money with adverts on your website

Unless you get tons of traffic (and if you do then this post isn't for you), putting advertising on your personal website or blog isn't going to make you a millionaire, or even give you enough for a pint for that matter. That's why the people who make money from putting ads on their personal sites design the sites around the advertising, essentially they make their website a billboard, don't get me wrong a clever billboard, but a billboard nevertheless.

The old faithful ad supplier is of course,

Google Adsense - This displays Google Adwords on your page - you can see them below each of my posts (UPDATE: I've taken them off, they look cr*p). With the exception of when they are moulded cleverly into your web design, Adwords generally stick out like that annoying bit of wallpaper in your bedroom that's starting to peel away from the wall. Google Ads on websites remind me of Windows Clip Art in PowerPoint presentations, it just looks amateur in most cases. I'm still to be convinced...
Earnings - A 'portion' of what the advertiser pays.

I've recently discovered an ad supplier that enhances your site with less effort than it would take to make Adsense earn you money

Amazon Associates - Once set up this lets you display Amazon products on your website. There are a variety of widgets and different ways you can do this. One way is a simple image like on the right of this post. Now in this example The Crow is not in anyway relevant but if you're talking about a book or a subject area on your blog you can add something that complements your post. Such as what i did on my 'Don't make me think post'.

You can even set up your own Amazon store, make your own categories, add your own books and then have as a standalone page or even build it into your website using frames.

Earnings - 10% of whatever the person you referred spends. I think it also saves a cookie on that person's computer and you get a reduced percentage of subsequent sales but i'm not too sure about that, would have to check.

There aren't many corporate sites that include Google Adwords on their pages, probably for the reasons i mentioned above, however i'm constantly coming across what i'd call corporate websites that do use Amazon Associates. You can earn more, they're more relevant and at the very least you're adding lots of pretty pictures to your website or blog.

Lots more bits and pieces about Amazon Associates here. Also maybe i'm speaking out of my proverbial because i've just found someone who's made very little.

Well I like the pictures it adds to my blog, it's worth it for that. Now where's that Pammy calendar?

Thursday, 8 November 2007

A good use of flash

Flash is cool, flash is funky, however it just annoys me. It provides barriers to entering websites, navigation menus fly back and forwards under your mouse. Have you ever used a particularly sensitive flash website when your mouse is on the blink? It's like trying to disarm a bomb with a shaky hand.

Anyway i've found an example of good use of flash. This interactive graphic on the FT website explains the credit squeeze and why Northern Rock subsequently went down the pan. This subject is extremely dry and I didn't understand it in any way. After using this graphic i still don't understand the subject completely but I could probably blag my way through a conversation.

My only complaint about this graphic would be that it is dependant on sound - annoying when you work in an office and don't have your headphones. Perhaps some sort of text based explanation to go with the graphic would have helped.

Now to clarify, flash doesn't annoy me all the time i'm mainly talking about flash use as integral parts of websites (grr!) and as a substitute for something far simpler like an animated gif or just well written text (aaah) - Flash hinders accessibility in these cases. However, I would never diss the use of flash for amusing and silly animations, badger badger badger.

Related posts
Flashy things in flash (Aug 07)

Wednesday, 7 November 2007

Squashed images really hack me off

You go onto a website, usually a personal website about somebody's dog, and you see a picture of beloved Gromit but he's got a face as long as a horse because some muppet has reduced the width of the image without proportionally reducing the height. "Aaaaargh!", you scream.

Well this must not go on, the squished image STOPS HERE! My idiot's guide to squashing and squeezing begins below.

Firstly squashing. You want the height of the following squash racket reduced, however by just reducing the height the following happens:

Squash racquet and ball

Squash racquet and ball horizontally compressed

Normal squash racket

Squashed squash racket

What you should have done was, reduce the height and the width together OR crop the image to the right height OR (if you're really clever and get far too excited when playing with photoshop - not me honest!) do a bit of both.

Reduced width and height image of squash racquet and ball

Cropped to a reduced height image of squash racquet and ball

Proportionally reduced
squash racket

Cut squash racket

Secondly squeezing. You want the width of the following limousine reduced, however just by
reducing the width you get a hatchback:


Limousine image vertically compressed

Normal limo

Hatchback limo

What you should have done was, reduce the width and the height together OR crop the image to the right width OR a bit of both.

Reduced width and height image of limousineCropped to a reduced width image of limousine

reduced limo

Cut limo

Multi angled squishing can occur for a number of reasons, I state the most obvious here and how to avoid.

  1. You change the height attribute in the html for the image - by doing this but NOT changing the width attribute your image gets squashed. The BEST way to avoid this is by making the image the correct size in the first place in Photoshop or whatever and then not including a height or width attribute. Internet Explorer or whatever browser will display the image at it's original size and proportions.
  2. You resize the image in some WYSIWYG editor, Word, Quark or whatever by pulling the handles on the edge - this will result in squishing. Only ever use the handles at the corner of the image and hold down SHIFT and keep it held down while you resize the image with your mouse. This will reduce the image proportionally. See my awesome diagram below:

diagram showing that you should move the corner handles of an image

So with this in mind let me never see a squashed, squished or squeezed image ever again. I need some fresh orange juice now.

Tuesday, 6 November 2007

When to use jpgs and when to use gifs

Firstly if you want to read a comprehensive article about jpgs and gifs then go to Wikipedia. That's what i've read to understand why the two formats exist, actually the gif article is great but you'll need a maths degree to decifer the jpg article.

To summarize, they both take an image and compress it / make the file size smaller. To compress an image in this way something has to be thrown away. In jpgs this is picture information, in gifs this is colours.

I've found no simple article explaining what a jpg does to compress, probably because it's hugely complicated. So in my (idiot's) terms, 'A jpg will throw away information by grouping together pixels. This is what gives you that blurry edge on a heavily compressed jpg image. However because it can contain millions of colours, photos are still as vivid after compression.

A gif can only use 256 colours, therefore if you have turn a photo into a gif then it becomes grainy as some of the colour information has to be thrown away. However because gifs don't throw picture information away all sharp edges stay sharp.

Used in the right way you can have images online that are compressed but don't LOOK compressed. The following articles from the grammatically incorrect Web Developers Notes (Web Developer's Notes or even Web Developers' Notes!) contain good images of how the compression works and why some images need to be gif and some jpgs (the pages are fit to burst with annoying advertising but then i'm not suggesting this site is accessible).

When to use gifs - "Use gifs for line art, cartoons and images that contain text because they preserve the sharp lines of shapes and text in the graphic" ...and also animated images (as you can't animate jpgs).
When to use jpgs - "Use jpgs for photographs or other high colour images because they preserve gradients and subtle colours."

I've just found a minutely less complicated article about how a jpg compresses things, i got to the second paragraph, can you beat me?

Friday, 2 November 2007

Download YouTube clips and a bit about flv files

My friend gZa emailed me this link to KeepVid, you can use it to download clips off YouTube (film trailers being one of my faves) then do what you want with them ie. burn them to DVD and play them on a proper TV / bigger screen.

I can see this being useful for work and play...

Also as a handy bonus the site will also convert .flv files to something you can actually watch via your desktop. I encountered .flv (Flash Video) files for the first time last week and spent half an hour trying to figure out how to watch them before i realised they couldn't be played through Macromedia Flash or WMV. In then end i uploaded the files to YouTube to watch them. The reason is that Flash Video is designed for streaming rather than watching like a WMV or MPEG file (correct me if i'm wrong).

However if you don't want to upload to YouTube or use KeepVid to convert them you can view .flv files using a number of standalone players. There's one on the KeepVid site and also the following player from Martijn de Visser (thanks for the link gZa).

Related posts
Convert video files online (July 2008)

Thursday, 25 October 2007

I'm being stalked by CRM systems

I've just moved jobs and had to phone up our email marketing supplier to book into a training course.

I couldn't get through so i left my name and was told someone would ring me back.

Half an hour later somebody phoned me. The first thing they said was, "Your name is Ed Sexton? Did you work at Reed before working on i-think?".

I was slightly freaked out, replied in the affirmative and the man i was speaking to then explained to me: "I thought so, I looked up your name on our CRM system before i rang you. You were on the system after you contacted us in 2006 to test our system out for your last company. We're now following your career!"

I laughed and laughed till my head exploded after this comment. I really have travelled to 1984.

Incidentally I didn't actually use them after testing their system for my previous company. How these things come round.

Linking to PDFs and still being accessible

I'm just about to link to a PDF and want to make sure that the link abides by accessibility guidelines for the benefit of my web users.

Now I know from Steve Krug's book and other accessibility nuggets that there are some basic rules for ALL links and also some specific PDF relevant things (as you can see, the following is just an index of Jakob Nielsen's website!).

  • Only use PDFs if you have to. Presenting in HTML format is often a lot more user friendly.
  • The link design should be obvious (Jakob Nielson has a whole article on this) - personally i think a different colour and underlined is the most accessible (i bet you just tried to click that!). However links can still suit design, check out the BBC website, it's really obvious what's a link and what's not.
  • Create gateway pages for each PDF file so users can see what they are about to get (Jakob on gateways)
  • If you are linking to a PDF on someone else's website don't do so directly. Link to their gateway page, there are a number of reasons why, again Jakob sums it up best.
  • Ensure the PDF opens in a new browser window (Jakob on opening files from a web page).
  • Tell users that it's a PDF and what file size it is.
  • Explain to users what a PDF is and give them a link to the Adobe website to download Adobe Reader.

Now it's this last point that i've been stuck on. I'm just linking to a tube map and i don't want a whole gateway page (maybe i really should) with introduction etc. The BBC go all the way and are comprehensive with their PDF links (their annual reports [was] a good example [the page has now been changed]), hence the advantage of creating gateway pages - you have space to explain PDF files.

So against my own advice i'm going to compromise and use a table to format the following side by side (these are pretend links for the purposes of this post...).

Download tube directions (PDF, 300 KB)More information on
PDF files

  1. So STOP!
  2. Do you need to have a pdf?
  3. If you do make sure you give it a gateway page.
  4. Explain about PDFs to your users.

UPDATE (2/11): After all that i revisited my pdf of tube directions this week and decided to put it on my site in a downloads section (in other words a gateway page) as it's so much tidier. Should have listened to my own advice ;)

Wednesday, 24 October 2007

Adding a tag cloud to blogger

UPDATE: Google now offer this as an option on the label gadget saving you the coding hassle.

Ever since i was asked if i'd heard of a 'tag cloud' in a recent job interview i keep hearing this phrase all the time. I love them far too much for their simple way of presenting information, it's what web 2.0 is all about for me - making information clearer.

Anyway I've just added a tag cloud to this blog, it's all very exciting.

Go to phydeaux3's blog to learn how.

Monday, 22 October 2007

Inputting HTML examples without it being coded

How do you put html coding in a post - such as <strong> - without blogger or whatever WYSIWYG editor actually interpreting it as real code rather than a sample you are trying to display

Possibly the most boring post of all time but my excuse is somebody asked me how i did it. Why my kind friend told me verbally as opposed to leaving a comment on the relevant post is beyond me and totally against the principle of Web 2.0. I've told you before, I'm writing a blog, you can't speak to me in real life!

Anyway all you have to do is put in the appropriate html code for each symbol as opposed to the symbol itself. So if you want '<strong>' then you need to actually put into your post &#60;strong&#62;. This is because < is &#60; in html coding. The code for the symbols is standardised by ISO-8859-1 and click on the following for the full list of all the symbols or the 'HTML Coded Character Set' as it's called.


Friday, 19 October 2007

Teach yourself HTML

Everyone working online should have an understanding of HTML. Mainly because it's so easy to understand the basics.

I've learnt all my HTML knowledge online, search on Google, there's hundreds of pages devoted to teaching you HTML and ironing out problems. But the one site that i've got in my favourites (or 'favorites' as it says on my screen despite the fact English(UK) is my preferred language) and I use ALL the time is (drum roll):

The link above in particular (as opposed to the home page) i find most useful. Bookmark it now! All the links on that page open up another window that allows you to change html and see the result.

Steve McLaren should write Alf Ramsay's biography

OK, this is nothing to do with Web 2.0 but it is pertinent to my life and i've nowhere else to write it and it needs to written!

England lost to Russia on Wednesday night in the Euro qualifiers severly denting their chances of qualification into Euro 2008. The papers are calling for Steve McLaren's head if England don't qualify and many factors are being blamed for England poor qualifying campaign.

However it seems clear to me that within any team the manager gets better with time. Look at Ferguson for Man Utd and Wenger at Arsenal, both been there for years and their teams perform well season upon season. And don't forget that Ferguson was appalling in his first season at Man Utd. I think McLaren is getting better with each game and now a year in, he's starting to get the team working.

So my solution:
  • No manager can be sacked for two years unless he fails a number of criteria (such as not winning against Macedonia - joke)
  • Every new England manager is tasked with writing the biography of a previous England manager's time in charge of the country.

They've got loads of spare time so it's not as if they can't fit it in and by doing so they'll learn some of the mistakes previous managers make. The general public will also get an insightful biography and the FA can make a bit of cash (like they need it). Everyone wins!

So i eagerly wait for McLaren's first installment, of "Alf Ramsey, the man who won"...

Saturday, 13 October 2007

Putting social networking bookmarks on blogger posts

UPDATE: I can't guarantee this still works. I've since ditched it now that blogger provides share buttons as an option (it only took 3 years...).

OK, about 2 hours ago I thought, 'Those bookmark links at the end of BBC articles look really cool and encourage traffic, how would i do something like that?' Scroll down for the answer, read on for my wibbling.

Simple I thought, someone else must have figured it out, i'll just search Google Groups and the answer will appear.

Well lots of answers did appear but not quite the right ones. I want
  • Bookmarks appearing at the end of my post
  • With little logos for each
  • And with nice accessibility touches such as "Bookmark with" and "What are these?" written at the end plus alt text coming up when you hover over the links.
Well as you can see I figured it out eventually (except the "What are these?" bit but I'll update this post when I figure that out) and the steps are described below. First off I'll acknowledge the people who helped me on the way.

I first considered the add this option which is really easy but clicking on it does take you to the 'add this' page before the relevant bookmark page which i didn't want. I'd recommend this though if you want a really simple option.

I then thought, well i'll try and figure it out myself! So i copied the source html from the BBC page but that just broke my template funnily enough.

I then found most of the answer on tips for new bloggers (the reason why i'm not just redirecting you there is because they don't add the little accessibility things that i wanted!). I've had a play in photoshop to get the little images looking right and hosted them on my Google Page Creator site (don't use these images on your own blog as i can't guarantee i won't move them at some point, get your own, it's FREE!). Also i needed a Facebook image as the facebook site doesn't have a nice one so I used the png file on this facebook icon request forum. I figured out the alt text using the source i'd viewed on the BBC site.

Also I've written basic html before but as you'll see, this code doesn't look like normal html. For example you use expr:href as opposed to href and instead of "quotes" either side of text you put 'apostrophes'. Well this is because it's in the blogger code as i was told by this new blogger blog site, I'm sure you'll find it thrilling...

Enough of how i've wasted the last two hours, here's what i did:
  1. Go into 'Template' > 'Edit HTML'. Save your current template somewhere so if you balls it up you can revert to the old one.
  2. Tick the check box 'Expand Widget Templates'.
  3. Find (ctrl + F) the bit of code that says <div class="'post-footer'"> and immediately after this put the following code: (change the red text for wherever you host the images)
    <!-- Start of social bookmarks. --><br/>
    Bookmark with:
    <a expr:href='"" + data:post.url + "&title=" + data:post.title' target='_blank' title='Post this story to Digg'><img alt='Digg' src=''/></a>
    <a expr:href='"" + data:post.url' target='_blank' title='Post this story to Technorati'><img alt='Technorati' src=''/></a>
    <a expr:href='"" + data:post.url + "&title=" + data:post.title' target='_blank' title='Post this story to Delicious'><img alt='' src=''/></a>
    <a expr:href='"" + data:post.url + "&title=" + data:post.title' target='_blank' title='Post this story to StumbleUpon'><img alt='Stumbleupon' src=''/></a>
    <a expr:href='"" + data:post.url + "&title=" + data:post.title' target='_blank' title='Post this story to reddit'><img alt='Reddit' src=''/></a>
    <a expr:href='"" + data:post.url + "&Title=" + data:post.title' target='_blank' title='Post this story to Facebook'><img alt='Facebook' src=''/></a>
    <!-- End of social bookmarks -->
  4. Save template
  5. Admire your handiwork
It's 7.29 on Saturday 13th October and England are about to play France in the World Cup so i'm not staying around here any longer, there's beer to drink!

Friday, 12 October 2007

Don't make me think

If you haven't read "Don't make me think" by Steve Krug and you work with websites please do and then return once you have!

The amount of websites that have no relation to the purpose they are trying to achieve is just ridiculous.

The sad thing is that you don't need any special equipment, skills or time really to improve a lot of these sites. Yes sometimes you can be restricted by dodgy CMS (Content Management Systems) or the page is built without CSS (Cascading Style Sheets) but for sites like the New Zealand one mentioned above all you have to do is rearrange the information better. It's that simple! Honest! I've tried it (and I'm a donut).

I finish with some wisdom from Krug's book:

"When a cat is dropped, it always lands on its feet, and when toast is dropped, it always lands with the buttered side facing down. I propose to strap buttered toast to the back of a cat; the two will hover, spinning, inches above the ground. With a giant buttered cat array, a high-speed monorail could easily link New York with Chicago." - John Frazee

I've just searched for this quote on Google and found a whole world of buttered cat paradox sites, scary...

Tuesday, 21 August 2007

Flashy things in flash

A friend sent me a link to the World Clock - fascinating stuff.

The World Clock is made by a company called Poodwaddle who offer a load of these flash gimmicks for free. I can't see anything that I'll be adding to any websites i look after but it really shows the potential of simple applications through flash.

I still haven't fallen in love with the use of flash on websites. The Poodwaddle applications i like but when I'm just wanting to access information then what's wrong with html? An example that's annoyed me recently was the revamp of the Honda F1 website [update: this website is now dead] with Flash. As an F1 fan I just want to see the pictures and read the race reports from the Honda's team perspective not have to have a new browser window open up, lose my toolbars and wait for loading, at least they've got the HTML option.

It's probably something to do with the fact that I'm one of the geeky minority who customise their computers, use FireFox, see websites on my terms, with my toolbars, love the user led revolution of the net, are amused by the supposed dumbing down caused by the web (see the article Is Internet Killing Our Culture?). Before i fly off on a completely different tangent I'll save that discussion for another day.

In the mean time, just think, in the time it's taken for me to make this post, 1 species is now extinct, 43 people have been injured in traffic accidents (surely that must be higher?) and nobody has contracted leprosy.

Related posts
A good use of flash (Nov 07)

Thursday, 2 August 2007

Stop poking me, I'm bored of Facebook

Well i can't have a blog on Web 2.0 without mentioning Facebook. But who doesn't know anything about Facebook? Well my uncle actually, to whom i spent 5 minutes last weekend explaining what it is, I promptly gave up when i realised he didn't use the internet.

From my experience of it, Facebook seems to be the new mobile phone. If you don't have one you miss out. Depite that Facebook is losing it's appeal for me. Yes it's nice to be able to be in a network with friends, tag pictures and not since FriendsReunited first started have I been in touch with so many people i'd lost contact with but i can replicate all the uses of Facebook far better in other ways:
  • Tagging photos of friends - Get a flickr account. You can tag, you can have albums, you can organise, you can link to friends and best of all it keeps the full size image!
  • Messaging - Use email of course! The advantages being blatantly obvious, such as anyone can email you not just facebook members, you have an email address, and you can access it easier (for those people who have facebook banned at work). And anyway, Facebook emails you when you get a message, so just cut out the middle man!
  • Hearing from old friends - Keep in better contact with people by phoning them up or even... meeting up in real life with them. Most of the time if i've lost contact with someone, there's a bloody good reason.
  • Gifts - How about physical gifts? A real bunch of flowers.
  • Applications - Buy a Wii. Or Scrabble.
  • The Wall - a. Use email, cc everyone in, reply all. b. buy a cork board and some drawing pins.
  • Get spyed on by your boss - Regularly email him/her pictures of yourself in compromising situations. Give him/her access to your outlook calendar, and the cork board.
  • Poking - ...
Related posts
Everyone's bored of social networking (Jan 08)

Thursday, 5 July 2007

Does Web 2.0 really have a soul?!

"In the future... the Web will grant us not only the vision of gods but also their power."

I've just read the above in an article about the 'amorality of Web 2.0'.

OK, i was only joking when i named my blog "I've sold my soul to Web 2.0". But what's that they say about the truth being spoken in jest...

Update: I've renamed my blog from "I've sold my soul to Web 2.0" to "The meaning of web" so losing the meaning of some of this post. However considering it wasn't that good to begin with i feel i haven't done much damage.

A diagram of Web 2.0 words

There's a really good image on Wikipedia about the history of web 2.0 and its associated words. As you can see "Web 2.0" is 2004/2005 but most of the words it embodies are way before then.

Diagram showing in what year certain web 2.0 words entered usageImage and author details can be found on Wikipedia.

Finding keywords for Google Adwords

I've been using Google Adwords for a couple of years now and find it so much easier to use than Yahoo's version. Like everything Google you can adapt it to how you want it, everything's quick and automatic and it's really easy to use.

Did you know you can't stop Yahoo ads appearing on certain sites even if you want to? That means if a site is spamdexing by filling itself with adverts and no other content you can't remove yourself from it, that's up to Yahoo, in the meantime irrelevant visitors cost you money. OK you could stop your ads, refine them, adjust keywords, but wouldn't eliminating bad sites from your campaign be easier?!

However the one area with Google that's lacking is finding keywords.

Google keyword tool is handy and what i've been using for most ads but that was until i found something that was far more fun! - Quintura. OK it may be doing the same thing but with all the floating, moving words it gives you so many more ideas. So for a list of similar words then keyword tool is fine but for inspiration use Quintura. Then when you're bored of that just start typing in random words - I was amused to find that "Crystal Palace" also brings up "knitting needles".

Quintura also seems better for finding negative keywords - words to eliminate from your campaign that you don't need.

Related posts
Growing strange cacti (Feb 2009)
Is the Google Keyword Tool any use for SEO? (Nov 2010)

Tuesday, 3 July 2007

How we use and peruse the web

I've just read an article about web usage that a friend kindly sent me.

Putting links 'below the fold' (ie. off the page so you have to scroll down to see it) has always worried me, based on this report it doesn't seem to have too much of an adverse effect.

"User rarely scroll horizontally (total of 0.4%), but over 23% of all links followed were "below the fold." This is surprising considering the short mean stay time on pages."

The article also mentions the 'Golden Triangle' - users tend to look at the top left of a search results page - I must have been living under a rock because I've never heard of it until now.

Yet more ammunition to support the argument that high Google listing is important. I still believe in SEO through content rather than spamdexing though.


The more I look into this the more I realise how much stuff is Web 2.0 and also how much of that stuff has been around since the early nineties. Web 2.0 is a bit of a rubbish word for all this web technology really! Anyway a nice list of Web 2.0 applications.

Amongst those I found loads of stuff I'm already well acquainted with. Wikipedia being the main one. Pretty much everyone who's ever surfed the net must have surely visited Wikipedia at some point. If you haven't edited anything, then try it now, find an article (your home town is always a good place to start) and correct it, there's bound to be typos or inaccuracies. Two areas that inevitably lead to criticism of Wikipedia.

OK, a lot of the criticisms are valid, particularly accuracy and lack of depth but if you look at the quantity of featured articles and their quality, these articles surely must be atleast an alternative to the Encyclopedia Britannica if not a replacement. However its still nice to have around even if it is just use for answering pub quiz questions.

I now get annoyed that I can't press edit when reading a book to correct grammar! Although that's probably also an after effect of reading "Eats, shoots and leaves".

The first day of Web 2.0

I've been trying to improve my company's website listing so i started a few months ago by redesigning. I got some accessibility experts at Clearleft in funky Brighton to tidy up the design and i've now started adding decent content - the best way to increase SEO.

Search Engine Optimisation was scaring me till i read this website helpers site. I've got friends who work for SEO agencies who bang on about how they have 100 sites that can link to my site immediately if i use them, I will now start ignoring them!

There are loads of really informative blogs out there about Web 2.0, just search Technorati. I'm only writing this one so i can get the hang of this blogging lark and can explain it to my colleagues with some degree of clarity! Will add a blog roll and other elements of Web 2.0 as i look at them.

Anywhere you can point me much appreciated...!