It should be finished within a week or so, check back soon to see the result.

The (obvious) twist is that all the sites featured use jQuery in one way or another; either for tabs, DOM Manipulation, animation, ajax or for any other reason.

The site also uses a few bits of jQuery itself, just to make it a bit more of a pleasurable experience to browse, I would really be interested on people’s opinions of these.

Please visit it and browse through all the Gallery, the Plugin Directory and the Tutorials Section

Cheers

As the code used for html emails is still quite basic, so that all possible email programs can read them well, and I did not want to risk using a javascript based obfuscator I had to use the mailto syntax when usually I would use a great mac app called Enkoder (you can also use their online form).

The MailTo command can do more than enter a single e-mail address in the “Send To” field while activating your e-mail program. It can also:

Notes

“ “ (beginning and ending double quotes) are necessary if any spaces are used

Mailto parameter should be preceded by “?” for the first or only parameter and “&” for second and subsequent parameter.

Some examples, with actual HTML Code included, follow:

Simple MailTo

<a href="mailto:mailto@rathersplendid.net">Simple MailTo</a>

MailTo with Multiple Recipients

CODE:
<a href="mailto:mailto@rathersplendid.net,MAILTO@RATHERSPLENDID.NET">MailTo with Multiple Recipients</a>

MailTo with Subject

CODE:
<a href="mailto:mailto@rathersplendid.net?subject=Comments from MailTo Syntax Page">MailTo with Subject</a>

MailTo with a Copy

CODE:
<a href="mailto:mailto@rathersplendid.net?cc=MAILTO@RATHERSPLENDID.NET">MailTo with a Copy</a>

MailTo with a Blind Copy

CODE:
<a href="mailto:mailto@rathersplendid.net?bcc=MAILTO@RATHERSPLENDID.NET">MailTo with a Blind Copy</a>

MailTo with message already started in Body...

CODE:
<a href="mailto:mailto@rathersplendid.net?body=I am having trouble finding information on ">I am having trouble finding information on</a>

MailTo with multiline message in Body.

CODE:
<a href="mailto:mailto@rathersplendid.net?body=The message's first paragraph.%0A%0aSecond paragraph.%0A%0AThird Paragraph.">

NOTE: Use “%0A” for a new line, use “%0A%0A” for a new line preceded by a blank line.
Features may be used in combination

MailTo with Subject, a Recipient, a Copy and a Blind Copy

CODE:
<a href="mailto:mailto@rathersplendid.net?subject=MailTo Comments&cc=MAILTO@RATHERSPLENDID.NET&bcc=MAILTO@ratherRSPLENDID.NET">

All of the above – MailTo with Subject, CC, BCC and a few Body lines.

CODE:
<a href="mailto:mailto@rathersplendid.net?subject=MailTo Comments&cc=MAILTO@RATHERSPLENDID.NET&bcc=MAILTO@RATHERSPLENDID.NET&body=The message's first paragraph.%0A%0aSecond paragraph.%0A%0AThird Paragraph.">

Remember to use only one ? (question mark), when providing multiple entries beyond e-mail address.

Something else to remember is that you should not use any ampersands (&) in you subject or body copy as it will break the code and your code will render incomplete. Something I learnt the hard way.

Check out these links for great mac apps

The brilliant Open Source Mac

From MacTipsAndTricks.com

Top 100 Essential Mac Applications

Apps for being an efficient user

20 Essential Mac OS X Apps For Bloggers

From Maclife.com

The 30 Best Mac Apps You’ve Never Heard Of

From Mac.Appstorm.net

8 Time saving ebay apps

12 Mac Apps for Running a Freelance Business

35 Absolutely Essential Mac Apps

From ChrisPirillo.com

Top 100 Mac Apps

From Diatomic design

35+ Useful Mac Apps and Utilities

OS X I Use This

I know there are probably quite a lot of repetition within these links, but in amongst them you will definitely find some gems.

If you think I’ve missed something, please let me know by commenting and I’ll add it to the list.

I’m working for Director of Photography, Graham Smith on his new website at the moment; it features the ‘smooth-grunge’ style, which, I hope will make him stand out from the crowd. Expect it later this month.

Also, I have one or two projects up my sleeve scheduled for release during next month so watch out and wait for all the spam I’ll be sending you about them…

It is a service to convert designs (psd or html), if you’re a designer, or actual websites, if you’re an executive, into a fully functional Textpattern site.

We are a collective of freelance web designers and developers hoping to make the web a better place by providing accessible, standards compliant web sites.

Why would anyone need this?

Designers could get a lot of use out of this service if they want to provide a way to get the designs built without having to do it themselves. They may not know the code, or even, they may not know the ins and outs of how to set up a content management system and that is where txp:coder steps in.

Executives would also benefit hugely from out service; they may have a site that is currently un-editable without hiring their web designer to do make any changes. txp:coder can change this all, we can convert your existing site into a Textpattern powered site, making it incredibly easy for you to add, amend or update your current site by yourself without having to hire anyone to do it.

More info

You can read all about txp:coder on our website http://txpcoder.com, it details the entire process.

So please, if you or anyone you know, might benefit from our services, head on over to http://txpcoder.com

I did not need to do this move, but in the interest of a shorter url and a much better email address, I thought it was needed.

Why .tv?

I chose the .tv domain for two reasons; firstly, I have been designing a fair few sites for people and organisations in the film industry; and secondly, it was one of very few top level domains still available. .am was still available and I seriously considered buying it as my initials are AM. but I thought .tv was better as it was more widely known.

I’m sure my friends and family will hate the fact that I have another email address, but they’ll have to get used to it.

Head on over to martineau.tv to check out my work

Let me know what you think

I usually go one step further than the ‘vanilla’ SSB as I convert them to a MenuExtraSSB (in the File menu of your newly created SSB app) so that they appear in the menubar at the top of my screen. This means they’re always available without having to switch apps.

Why is this important? I find it particularly useful for reference sites like Sitepoint’s CSS and HTML reference or the TextBook when I’m creating a Textpattern site.

Here’s my (not exhaustive) list of the best and most useful SSB’s and their URL’s

• Web Development
  • Sitepoint HTML Reference – http://reference.sitepoint.com/html
  • Sitepoint CSS Reference – http://reference.sitepoint.com/css
  • The Textpattern TextBook – http://textbook.textpattern.net/
  • Deploy (For rapid deployment of a small site) – http://projectdeploy.org/
  • HTML Ipsum – http://html-ipsum.com/
  • Textile Reference – http://thresholdstate.com/articles/4312/the-textile-reference-manual

• General
  • BBC iPlayer (I usually listen to the radio) – http://www.bbc.co.uk/iplayer/
  • Google Reader – http://www.google.com/reader/
  • Twitter – http://www.twitter.com
  • Keyboardr – http://keyboardr.com/

As I said before, you could have Gmail and Facebook, but I do not.

I will keep updating this post when I find more

Please suggest anymore for this list

To my joy, while searching for a jquery slideshow thingy, I found that Chris Coyier of CSS Tricks had created a perfect example of what I wanted, enter the Start/Stop Slider

It all looked great until I quickly remembered that his example is built with hardcoded images and content – how would I modify it so that it pulled recent projects from my portfolio section?

Here’s How

You will first need to read Chris’ article because you will be using all his code as a base and modifying here for Textpattern. You will need his CSS and Javascript files before you start this tutorial.

Step 1

I first created a form, called ‘home_slideshow’, so that I could use an article_custom tag to call the recent projects.

The home_slideshow form’s content was this:

<div id="slide-<txp:rvm_counter />" class="slide"> <h2><txp:permlink><txp:title /></txp:permlink></h2> <p><txp:excerpt /></p> <txp:permlink><txp:zem_article_thumb limit=1/></txp:permlink> </div><!--close slide -->

and the article tag, on my home page template was:

<txp:article_custom form="home_slideshow" limit="6" pgonly="1" section="portfolio" sort="Posted desc" />

This tag is calling the last 6 articles from my portfolio section.

Let me explain what’s happening so far

In the home_slideshow form I have created a div,with an id of slide-?, you may notice that there’s proprietary plugin code in there. I needed to increment each div’s id by one, whilst always beginning at 1, so I found the rvm_counter plugin (from one of Textpattern’s core contributors, Ruud van Melick ) which, in fact needed to be modified, to enable me to create the suitable incrementing that I needed.

Step 2: Modifying the rvm_counter plugin, you need to do this

I found that, whilst this plugin worked as stated, it actually kept on incrementing on each page refresh, but I needed it to ALWAYS begin at 1. I had a quick search on the Textpattern Support Forum and quickly found out what needed to be done.

You need to install the original plugin, and then edit it in the Plugin preferences by replacing the entire code. Click here to download the replacement code at the PHP Pastebin

You may also see that I use the zem_article_thumb plugin, this is so I can limit the number of article images, to one, as I have up to 5 sometimes.

Step 3: Finito!

See, simple huh? Apart from the relative annoyance of editing the rvm_counter plugin code, I think this tutorial, along with the CSS Tricks tute is great for giving your site a fresh look.

[EDIT] I forgot to post the link to my finished version of this, head on over to my portfolio site to see it

Let me know if this helped

These are not exhaustive, but in essence there were 2 design revisions before the final design you see now.

Design 1: Let’s call it the Rainbow design

The Home Page

The Genre Page – a list of films in each genre

The Individual Film Page

Ben did not like this design, I think the Rainbow was a little too distracting and everything else, a little too busy.

Design 2: Big Buttons

The Home Page

The Genre Page – a list of films in each genre

The Individual Film Page

Again, Ben thought there was still better to be found – simplification was the key. From this design I created what you now see today, a site where the films are centre stage without distractions from the interface.

I have to say though, that my favourite was the Rainbow designs. I could have developed that into a great site – maybe I’ll resurrect it for another site…

What do you think?

Ben is a London based Director of Photography and is a showcase of all his brilliant work.

Please head on over there and check it out and let me know what you think.

Pizza Express keep emailing me with their special offers ; two-for-one and £10 set menu etc. These deals usually only let you enter your information once, unless you have more than one email address, in which case, you can have more.

This little gem only needs you to enter your email once, and when that’s done you can edit the page and print out their voucher as many times as you like.

Here’s the trick:
When you’ve arrived at the voucher page that needs to be printed, don’t close your browsers window after it done, copy and paste this code over the in place of the current url.

CODE:

javascript:document.body.contentEditable=‘true’;%20document.designMode=‘on’;%20void%200

or, EVEN BETTER, copy the bookmarklet below to your bookmarks and whenever you’re on a page that needs editing, click it and voila – instant editable pages!

BOOKMARLET => Edit Website Content Script

So, instead of this:

It should be like this:

You are now able to edit your name at the bottom of the voucher as many times as you like. But don’t close the window otherwise you’ll have to enter your email in again.

This code can be used on any web page, so if another voucher works in the same way, get stuck in and take them for all their worth! Also, let me know if this trick works elsewhere, I haven’t tested it much.

[EDIT – 5 minutes later] Of course I have now worked out how to do it. For anyone in the dark, you will need to add a ‘New place…’ and drag the pinpoint when the new, bigger map appears.

What a muppet…

My mac, an ageing Power-Mac G5 Quad 2.5, is used mostly for my work but I also use it for everything else – photos, movies and music etc.. Leopard has almost everything you could need, if you’re just doing standard stuff, but not everything, and in this post I will show you what you can get, mostly for free, for you Mac.

Apps I can’t live without:

Quicksilver

Quicksilver is quite simply the best time-saver ever.

I use it to do many things, but mainly to open programs up. Using a keyboards shortcut, I set mine to ⌘-Spacebar (the shortcut that by default calls Apple’s Spotlight, I have changed this one to Ctrl-Spacebar) I can type the name of a program and, using the keyboard, select the app that I want to open. I click enter and it opens it up. I use it so often, that I don’t hardly use the dock anymore.

I know I’m not too good at explaining, so if you want more detailed instructions for Quicksilver click here

Path Finder ($39.95)

Path Finder is a much better version of Apple’s Finder. With one windows open, you can have multiple tabs to browse your files, and in the most recent version, you can split the viewer so you can copy/move files in between folders easily. It’s features are far more extensive, they are extremely useful and would be a great asset on your system.

Video Apps:

I watch a lot of video, whether they be movies or TV shows, I often find that Quicktime simply can’t handle the wealth of video codecs that are out there.
These two will are all you need:

VLC (FREE)

VLC, in my opinion, is the best video player for the mac, it plays anything that you’ll ever come across.

Perian Quicktime Plugin (FREE)

Perian, as it says on their website, is a “swiss-army knife for Quicktime” meaning that with it installed, you should also be able to play almost any video you come across.

With these two installed you should never have any problems.

Downloading and Torrenting Apps:

Transmission (FREE)

The simplest and best torrenting app in my opinion. Make sure you check the ‘Blocklist’ tickbox in the Peers tab to ‘Prevent known bad peers from connecting’, it’ll keep you a little more secure when you’re downloading stuff.

Xtorrent

This app is similar to Frostwire in that you can search within it, but it uses torrents instead of the actual file, so if the file is big, e.g. a movie, it will download a lot faster.

Do not pay for this. Unless you really want to.
I have a workaround that bypasses the 1 hour time limit. When you have found a torrent and it has started downloading, go to the Xtorrent menu and click on ‘Quit’, a message should appear asking if you meant to quit or not, at this point do nothing, leave it.

The timer, if all goes to plan, will have paused itself, that it, until you click cancel again if you need to use the app.

Frostwire (FREE)

This is like the p2p apps of yesteryear, it’ll search for anything and you can download it, providing it’s on other people’s systems.

Random Apps:

This section covers all the miscellaneous apps that you may need, from Facebook importers to Flickr uploaders, you’ll want these apps.

AddressBookSync (FREE)

If you use facebook, and you have an iPhone, or any other phone for that matter. Open up this app, login to facebook when it asks you and it will save all your ‘Friends’ contact details, their birthdays and their current profile pic to Address Book and iCal.

Adium

The instant messaging swiss-army knife. You can use loads of different Im accounts (MSN, AOL, GTalk, even Facebook) and be logged in at the same time.

MassReplaceIt (FREE)

A small app that use regularly to find and replace very specific things in text, html, css, php, javascript or any other kind of text based file.

Skype

If you haven’t heard of it, you’ve been living in a cave. It is a great VOIP (internet telephone) and many people use it.

Browsers and their plugins:

Safari is my browser of choice on the mac, it is brilliant and more importantly, fast. Here are a few plugins that make Safari, and your experience of the internet, a lot better:

1Password ($39.95)

One of the best apps on my mac, it stores all my passwords, internet or otherwise, and can auto-fill web forms with a few clicks. Just buy it, you won’t regret it – it’ll pay for itself by being so useful. Oh, and it syncs perfectly with the iPhone using it’s own iPhone app

Glimmerblocker (FREE)

The best (that I’ve found) popup blocker for the mac. Just install it and leave it to do its thing.

Fluid

This app is great! Fluid creates site specific browsers (SSB) from any website that you want – Facebook, Gmail even BBC iplayer.

I use this to listen to internet radio while I work. I opened Fluid, typed in bbc iplayer’s url and created a SSB for the BBC iplayer. The next thing I did was to convert the newly created iplaye app to a ‘MenuExtra SSB’ which means that when it opens, it will be placed in the menubar, not the dock, for easy retrieval.

It sounds a bit complicated, but once you get the hang of it, you’ll have MenuExtra SSB’s for everything. Read the how-to on the Fluid website

Firefox (FREE)

There’s only one major contender to Safari for the mac and that’s Firefox. I have it on my system just in case a problem arises with Safari, which is pretty rare, it has been known though.

Utilities

SuperDuper! Backup App ($27.95)

I use SuperDuper! to backup my entire hard-drive (make a clone of it) everyday. I have had disasters before where I lost masses of data, photos, music and video but more importantly, work. It not free (well part of it is, you want/need the paid-for features), but it’s cheap. Buy it.

Links of interest:

Open Source Mac

There maybe a tonne that i have missed, so I will keep editing this post to add more stuff. That’s it for now though.

Does anyone have a suggestions?

Also, please checkout my website design portfolio , maybe I can help you out…

At the moment, I can’t say to much about it (you’re welcome to guess though) and when I’m ready I will open it up for private beta testing.

I hope to gain a lot of expertise in making this service, and hopefully gain some useful contacts and insights along the way.

In the end, it will be a free service and I hope it will be a popular site for people to use.

It is still evolving and the design may change, but I seriously recommend saving the bookmark or RSS feed so you can keep up on a different side of current affairs.

I’m getting married very close to Christmas and there’s loads to be done, which I, seemingly, am managing to not do much of. This is all about to change, I gotta get VISA’s for the honeymoon, organise guests, seating plans, get my suit, get my shoes, rangle the ushers, reign in the two best men (I couldn’t choose) and loads more. I wouldn’t have it any other way, and can’t wait to get married and spend the rest of my life with my beautiful fiance, Alice.

A little more about work:

Tommy needed his site in a hurry, he had a mention in British Vogue’s November Issue, in the Secret Address Book supplement and needed the site ready before November 6th. With only a couple of weeks from concept to inception it was always a tall order, but we did it, with a little jQuery trickery and some lovely photos taken by Tommy himself, the site is different, quirky and unlike the ‘standard’ chef’s website’s. The site needed to made updateable (if that’s a word) by Tommy and so was built with Textpattern.

Steve’s site began in December 2007 with the initial meeting and enthusiasm to get the site done quickly…It was only just finished last week due to Steve’s work commitments, he couldn’t supply the clips and wealth of information until quite recently.

The site is built using the awesome ExpressionEngine, a CMS that has almost unlimited possibilities and one which was perfect for Steve to edit of update if he wanted without knowing the ins and outs of html and css.

And I need some more work

It goes without saying that everyone needs more work, but I actually do. I am looking for a few projects to get my teeth stuck into before Christmas and the wedding. If you have any thoughts, maybe a friend / colleague needs a website designed or even updated, please don’t hesitate to contact me.

I just wanted to say that I have just started work on Tommy Wrey’s new site tommywrey.com

At the moment there’s just a placeholder, but in the coming weeks, all will be revealed. All I can say is that he’s a very talented chef and that you should watch out for him…

In no particular order, they are:

CSS Mania Probably the biggest and best gallery site around

Screenfluent

MostInspired

CSS Impress

If you have seen, and clicked through to, my site on one of these websites then I thank you for giving me even the tiniest amount of your time.

I hope you return here, I’m only getting better!

It features examples of his work in a simple but appealing way.

You can also check it out in my portfolio

I have now decided to focus fully on my web design business and to give up my other career as an focus puller for film and television. To that end, my site needed to be updated, restructured and re-thoughtout. I have separated my blog from my business site, rathersplendid.net is now just the blog and zandermartineau.com is for my work. They are very closely linked and share the same design, but not colour scheme (let me know what you think).

My personal sites tend to evolve, so this may not be it’s final incarnation, I normally get itchy feet and change it about once a year, so don’t get too attached.

They are small, london based, property finance advisors. They do Mortgages , Bridging Finance , Insurance and also a great Residential Mortgage calculator plus a whole lot more. Check them out if you are moving or buying soon.

Check them out at arcandco.co.uk

Play it, wait for about 1 minute, 6 seconds and listen. It’s bloody brilliant!

I found a link pointing to the Opera website where the article in question has disappeared, fortunately for us the Internet Archive comes to the rescue

This is the article in question:

Making Wii-friendly pages

By Mark ‘Tarquin’ Wilton-Jones · 30 May, 2007

Overview

Web Specifications

The Wii game console by Nintendo has a Web browser that uses the Opera 9 display engine. It supports most Web technologies supported by Opera 9 for desktop, including HTML, XHTML, XML, WML, RSS and Atom, CSS, XSLT, SVG, and JavaScript except designMode, contentEditable, and Audio. It does not support FTP, NNTP, IRC, XHTML+Voice, or widgets.

For details, see the complete list of supported specifications.

Display

Web pages are displayed using a virtual screen size that is 800 pixels wide with varying height, using tv or screen media. The display can be zoomed by the user.

Interaction

The browser uses a controller similar to a mouse. It also has an on-screen keyboard that has very limited key event detection. However, the controller offers some additional buttons to provide extra possibilities.

Read more about the Wii remote.

Windows

The browser uses a single window that cannot be resized, and allows a maximum of one additional pop-up to be open at any time.

Plug-ins

The browser supports Flash 7 as the only plug-in.

Introduction

The Wii is a game console whose defining characteristic is its motion sensitive controller; the Wii remote. The Wii also has a Web browser called the Internet Channel that the user can download, and although it looks quite different from its desktop cousin, the browser is Opera. The Wii output is displayed using a regular television screen, which would normally be a very poor device for displaying Web pages, so the browser has several features suited to displaying Web pages on a television screen. In most cases it will work with Web sites without any changes, but you may want to make various enhancements for Wii users to give them the best possible experience with your site.

The Wii browser is based on the Opera 9 display engine, so apart from some small differences relating to its interface, the browser’s HTML, CSS, and scripting capabilities (including XMLHttpRequest/AJAX) are the same as Opera 9 for desktop.

Most Web pages are designed to fit on a desktop computer screen, whose size may be 800 pixels wide by 600 pixels high, or 1024 by 768, or higher. Television screens are usually much smaller, with those used in North America being the lowest standard resolution; 720 by 486 pixels, which may be reduced to less than 550 pixels wide due to the inefficiencies of the television. With the Wii browser, however, this low resolution is generally not a problem.

How Opera displays Web pages on Wii

Instead of reformatting the page to attempt to make it fit on the screen, Opera on Wii lays the page out as if it was using a virtual screen 800 pixels wide. The height of the virtual browser window changes depending on various settings, but can be between 376 and 660 pixels high. The page is then scaled down to fit inside the display of the user’s television. If the page needs more than the size of the virtual browser window, then the user can scroll in whichever direction is needed, to see the rest of the page.

With a good quality television, most Web pages can be used and read like this (although it can be a little difficult). In some cases it may not be comfortable enough for reading, however, so the page can be zoomed to read the parts that the user is interested in. Zoom is available either as manual, where the user can zoom in or out as much as they want, or as automatic. The automatic zoom is adaptive, in that it will work out what part the user is interested in, based on where they point the controller, and it will attempt to zoom in the right amount to fit that content inside the width of the television display.

This has limits at each end of the scale: If the desired content is too wide, over 640 pixels, all of it cannot be displayed when zooming. If the desired content is too narrow, under 250 pixels, then it will not be possible to zoom in enough to make that content fit perfectly inside the display. In the first case, the browser will zoom in to a nominal value, and the user will have to scroll sideways to see the rest of the content. In the second case, some of the surrounding content will also be shown.

The Wii remote

Since the Wii has only one main controller (the secondary controller does not make much sense in a Web environment), it has to perform all the user interaction with the page using that controller. This means that the Wii remote sometimes functions as a mouse, and sometimes as a keyboard.

As long as it is pointing at the television, it is a mouse. Wherever the user points the remote, the mouse cursor will point. When the user presses the A button, it is the same as clicking the left mouse button. When the remote stops pointing at the television, it becomes a minimal keyboard. Pressing the A button then is the same as pressing the Enter/Return key on a keyboard.

Scrolling the page is normally done with the trigger button. This works as a panner, in the same way as middle-clicking the mouse would work on desktop, except that it only scrolls as long as the user holds down the button. The page will scroll in whichever direction the user points on the screen. The user can also scroll using the directional control on the controller, with the added benefit that this can also scroll within scrollable parts of the individual page. However, if possible, you should avoid using framesets, inline frames, and elements with scrolling overflow, as they require the user to use a scrollbar or directional control, instead of the normal panner mechanism.

The user can also use button combinations to perform common actions, to allow normal functionality if the toolbar is hidden. These are done by holding the B button, and pressing one of the other buttons on the Wii remote. Key combinations are available for the +, -, up, down, left, and right keys, performing the functions Forward, Back, Reload, Open Favorites, Search, and Web Address respectively.

The virtual browser window

The Wii can be used in normal (4:3) or widescreen (16:9) mode, if the television supports widescreen. The browser toolbar can be set to always display, to automatically hide, or to toggle when the user presses a button. The user can also change the width of the display, to compensate for the inefficiencies of their particular television.

Depending on the display width the user has set, the widescreen settings, and whether or not the toolbar is set to hide, the visible area of the page can be anywhere between 376 pixels and 660 pixels high. Specifically, the following ranges of heights indicate whether the toolbar is set to always display, and whether widescreen mode is being used:

The following JavaScript automates detection of these settings; note that the settings can be changed after the page has loaded:

var toolbar, widescreen, tempheight = window.innerHeight; if( tempheight >= 376 && tempheight <= 420 ) { toolbar = true; widescreen = true; } else if( tempheight >= 452 && tempheight <= 496 ) { toolbar = false; widescreen = true; } else if( tempheight >= 500 && tempheight <= 560 ) { toolbar = true; widescreen = false; } else if( tempheight >= 600 && tempheight <= 660 ) { toolbar = false; widescreen = false; }

Also note that properties such as screen.height should be avoided as they relate to a virtual screen size, not the actual size of the screen, or the space used by the virtual browser window.

Page addresses and forms

As the Wii is not designed to be a desktop computer, it does not use a traditional keyboard. Instead, it uses an on-screen keyboard that is displayed in place of the Web page. The on-screen keyboard offers a fairly complete set of keys, but it is nowhere near as fast to type with as a regular keyboard. The user needs to point the Wii remote at the letter and press a button. There is a word completion option that the user can enable, but it can only complete words in the user’s chosen language, as well as some common top level domain names. It cannot show a list of previously visited addresses, so it is not possible to modify these.

Writing uppercase characters requires an extra button press to enable uppercase mode. Some characters, such as those with accents, require searching through an extra set of available characters. Some characters cannot be typed at all, such as the Welsh w-with-circumflex character, Polish L-with-stroke character, Arabic characters, and so on. There is also no copy/paste functionality, so writing the characters near the input to allow the user to copy them into it is not an option.

Long page addresses take long to type. Addresses that mix uppercase and lowercase characters require additional key presses to enable or disable uppercase. Addresses that use accented characters are particularly laborious. As an example, the following page address is very awkward to type:

www.example.com/2007/20/01/{Touche}?id=17+om

The following page address is much more convenient: example.com/touche

This extends to forms as well. When filling in a form, it helps if the form can provide as much of the information as possible. For example, if a certain form field is always expected to begin with “http://”, then it will help to have this as the default value of the input. Do not force the user to type if they do not have to. In some cases, pages demand that the user fill in a form field even if that form field is not really essential. This means the user has to put the effort into typing when they should not have to, and it may be enough to put Wii users off filling in the form at all.

Some input types can be used in place of simple text inputs. If an input expects one of a certain selection of values, you could use a SELECT input. In addition, like Opera 9 on desktop, Opera on Wii supports Web Forms 2.0. This means that in many cases, the amount of typing required can be reduced by using a native input. Take, for example, a form field that represents a date. Traditionally, a normal text input would be used:

<input type="text" name="somedate">

However, you could also use the date input type for this, and Opera will then present the user with a calendar where the date can quickly be selected:

Browsers that do not understand Web Forms 2.0 will display a normal text input instead, meaning users do not see any difference between the two inputs, while Opera users will be given a convenient date control. See the demonstration.

Note that forms have two further limitations. Firstly, the file input type is not available, and will always be disabled. This means that it is not possible to upload files. Secondly, the way the keyboard works means that it is not possible to submit a form by pressing the return key. If the form is designed to be submitted, you should always provide a submit button or image input, and not rely on the user being able to press their return key to submit the form.

Browsing history

In order to minimize resource usage, Opera on Wii is limited to a maximum of six history entries for the main window, and six for any pop-up. This means that in the browser window, the user can use the back button a maximum of five times to see previous pages in their browsing history.

If a visitor is likely to follow links more than that depth into your site, and they want to return to the main index page of your site, they will have to find a link to it, or type it in again. It is not possible for them to see or modify a list of their visited history, and they also cannot modify the address of the displayed page in order to minimize typing. Typing is, of course, unwelcome, so it is best to ensure that each page they might visit has an obvious link back to the index page, or at least to a section index which in turn links back to the main index.

Special CSS considerations

Opera on Wii is a television browser, and by default, it will use tv media. However, since the majority of sites do not cater for tv media, it will revert to using screen media if no stylesheets specifically for tv exist. Since it is designed to behave like a desktop browser, this allows it to work well with the majority of sites, but allows you to give it specific styles as a television browser if you think that it needs them. Note that the tv media support is based on continuous media only, and it is not possible to use paged media features.

In accordance with the CSS specification, when Opera is applying tv media, it will use only that one media type, and will not combine tv and screen media at the same time. If you intend to style a page using tv media, you cannot use screen media for the main styling and then override just a few styles in tv media, because Opera will just use the tv media content, ignoring the screen media content. Instead, you should either style the page for Opera on Wii completely in tv media, or make sure the main parts of your stylesheet apply to all media types, then apply overrides using a specific tv media section.

The user can optionally enable Opera’s Small Screen Rendering, but unlike Opera Mobile, it will act on screen media, and will ignore handheld.

Usefully, Opera on Wii also supports CSS 3 media queries, allowing you to adapt your site’s layout to suit the display resolution that Opera uses. The media queries will work with the virtual browser window size used by Opera, so width is 800, and height is whatever the current virtual browser window heigh is.

If your page’s design is unusable when the browser window is resized to 800 by 376, it will not work on Opera on Wii (hint; use Opera on desktop and set the preference Tools > Preferences > Advanced > Browsing > Show Web page dimensions in title bar). However, assuming that you use CSS to define your layout, you can use media queries to define a different layout for different sized browser windows. For example, if your design cannot be used when the browser window is 900 pixels wide or less, you can define different styles for smaller spaces like this:

#nav { float: left; } ... @media all and (max-width: 900px) { #nav { float: none; } }

If you organize the layout of your page into columns, it can help to make sure that each column is less than 640 pixels wide. This will ensure that the automatic zoom can perform optimally, to allow the user to read the content without having to repeatedly scroll sideways.

There are also some other considerations that need to be made for television screens. In general, they do not cope well with high contrast, which can cause the colors to shimmer badly and bleed into each other, and the rest of the screen display to become washed out. In general, it is best to try to avoid high contrast on television displays, but in particular, avoid large areas of bright red. This means, for example, that a bright red block should not be put next to a white block.

See the color bleeding demonstration (warning; demonstration can be uncomfortable to look at on some displays).

Note that since Opera on Wii uses tv media if it is provided, you can use that media type to give it a different style sheet.

Fonts

Only two fonts are available on Wii; a generic sans-serif font called “Wii NTLG PGothic” and a monospace font called “Wii NTLG Gothic”. These are visually almost identical, but the monospace version has the letter spacing adjusted slightly to maintain the same width for each letter. As a result, it generally does not matter what font your page attempts to use, because Opera on Wii will always end up using the same sans-serif font, and will look the same as if you attempt to use any other font. The fonts can be displayed in normal, bold, small-caps, and at different sizes, but not italic.

The fonts contain all characters from the ASCII character set, basic accented Latin characters, basic Greek characters, most Japanese characters, most Simplified Chinese characters, a large number of Traditional Chinese characters, common Cyrillic characters, and some of the more popular symbols. Characters from most other scripts are not available, such as Devanagari, Arabic, and Hangul. Some of the less common characters from available character sets are also not provided, such as those used by Hungarian or Welsh. If characters are not available in the font, a placeholder square will be displayed where that character would have appeared.

Special JavaScript considerations

JavaScript is perhaps the part that exposes the most differences between Opera on desktop and Opera on Wii.

As with CSS, JavaScript will see the virtual browser window size, not the actual television resolution: window.innerWidth, and similar properties, such as document.body.clientWidth, will all be 800. window.innerHeight and similar properties, such as document.body.clientHeight will all give the height of the virtual browser window. Properties such as screen.height cannot be used.

However, it is in the interaction with the interface that most of the differences lie. Since the browser remains always full-screen, windows cannot be resized. Pop-ups are supported, but replace the opening page, are displayed maximized, and cannot be resized. The opening page is hidden behind the pop-up, and the user can return to it by using the Back button. It is not possible to open more than one pop-up at a time, so if one pop-up opens another pop-up, it will replace the first pop-up.

Advertisements are particularly bad for this, so the pop-up blocker is used, and set to block unwanted pop-up windows. If your site makes use of pop-ups, you should make sure that they are only opened on request (such as when the user clicks a link), never open more than one at once, and make sure that the pop-ups do not open at the same time a new page is loaded in the opening window.

The screen size can also produce some limitations. In particular, DHTML menus can be a problem if they contain too many items. They can be unreadable if text is small, and when the user zooms in to see better, they may extend beyond the screen size. Because the scrolling also requires the same controller, the menu items can become very difficult to access, as they may close when the user tries to scroll to see the bottom.

Because of the limitations of the keyboard interaction, Opera on Wii cannot support designMode or contentEditable, used for creating rich text editing controls. Most scripts that provide these controls will detect if the browser supports them, and can show a normal textarea instead. Support for rich text editing can be detected using this code:

if( typeof(document.designMode) != 'undefined' || typeof(document.body.contentEditable) != 'undefined' )

Event detection

When the Wii remote is being used as a mouse, it fires the same events as a normal mouse would do, such as mouseover, mousemove, and mousedown, with the exception that it cannot fire the dblclick event. There is no equivalent to the right mouse button, so custom context menus cannot be used.

Many pages, and in particular games, make use of key detection. They check when the user presses a key, and run some script when that happens. Most of these pages will also work with a mouse, but some pages may still need keyboard interaction. It is not possible to use the on-screen keyboard except within a text input. The on-screen keyboard cannot pass any key events back to the page. This also means that it is not possible for the user to use modifier keys such as Shift, Ctrl, or Alt while clicking on the page.

The only key events that can be detected are those that are sent by the Wii remote buttons. Some of these perform functions that cannot be detected, but most can be detected and used by scripts. The keyCode properties of the events are not the same as the equivalent keys used by desktop, where available, because they perform the functions of desktop key combinations, not single keys. The keyCode property for these keys are as follows:

Directional control up/down/left/right
175/176/178/177 – normal keyboard uses 38/40/37/39 for arrow keys
Button A (normal select button)
13 – only functions as a key while the mouse cursor is not being used, otherwise it is left mouse button
Button B (trigger, used for panning)
171
+ and – (zoom in and out)
174 and 170
Button 1 (toggle display of toolbar)
172
Button 2 (toggle small screen rendering)
173

If the user uses a key combination, such as B+Up, these will be seen as two separate key events, but the sequence of keydown and keyup should show that a combination was used. Note that this pattern will only work if the associated keypress events are cancelled.

The keypress event can and should be cancelled if you wish to use key events to override the normal behavior of the buttons. For example, if you wish to use the directional control to provide directional response in a game, you can detect the key presses of those buttons, and use them instead of normal arrow keys. However, those buttons will attempt to scroll around the page. Either return false from the keypress event handler function, or use the preventDefault method of the event object, to prevent the scrolling. Of course, it is important to make sure that the scrolling is not actually needed by the user before you prevent it.

document.onkeypress = function (e) {<br> if( e.keyCode 175 || e.keyCode 38 ) {<br> moveup(); return false; } else if( e.keyCode 176 || e.keyCode 40 ) { movedown(); return false; } else if( e.keyCode 178 || e.keyCode 37 ) { moveleft(); return false; } else if( e.keyCode 177 || e.keyCode 39 ) { moveright(); return false; } //allow other keys to work return true; };

Note that button 1 can be detected, but its keypress event cannot be cancelled.

Images and plug-ins

Opera on Wii has the same image capabilities as Opera on desktop. This includes JPEG, GIF, PNG (with alpha transparency), BMP, ICO, SVG 1.1 basic, and scripted canvas. If your images display correctly in Opera 9 on desktop, then they should also work on Wii. With plug-ins, however, there are some significant limitations. Only one plug-in is currently available for Wii, and that is the Adobe Flash Player 7 plug-in. Opera on Wii does not have any download capability, so the user cannot download extra plug-ins on request. The wmode=“transparent” attribute is not supported, so plug-in content that is supposed to be transparent should not be made to overlap other content, as it will obscure it.

The Wii has a processor with performance that is less than half that of most desktop machines, and with about one tenth of the available RAM. As a result, it can have trouble with Web pages that attempt to display hundreds of images, or large Flash movies. In particular, streaming video players written for Flash can have problems with buffering, as they quickly use up the available memory.

Most Flash games, however, work well enough, as they are not so demanding on memory. However, it is important to note that the same restrictions apply to keyboard interaction as for JavaScript. This means that games that need the user to be able to press the space key, for example, will not work. Flash also has very limited Wii remote button detection. It can only see the mouse pointer and left mouse button click.

It is possible to detect the Wii remote buttons using JavaScript, but since communicating between JavaScript and plug-ins normally needs Java for LiveConnect, and Java is not available on Wii, this means that JavaScript cannot directly communicate the button presses to the Flash movie.

There you go, it was a lot I know, but pretty useful I think for the minority that actually use this browser regularly.

As I said before, I did not write this article, I am merely reproducing it for reference, it was originally published on the Opera Dev website

Go on the website and you can be Sweded as well. I know it’s stupid and I look like a tool, but what the heck..

Mail is great, it’s simple for what I need and does it all well, except for a few minor things and these can be rectified or enhanced by the use of a plugin. There are a ton of these and they’re all Leopard compatible, unless otherwise stated.

My favourites:

1. SpamSieve – Spam filter (Commerical) In my opinion, it’s the best out there.
2. Related Mail – Displays related messages to viewed email (beta)
3. Attachment scanner – Avoid the embarrassment of missing attachments
4. Mail Unread Menu – Menubar app that notifies you of any new mail
5. Mail Followup – Allows you to compose (and then send) a quoted version of the original message to all of the original recipients, keeping the To, Cc and Bcc addresses exactly as they appeared in the original message.
6. Letterbox – It rearranges the interface into three vertical columns.

And the rest:

1. OMiC – If you deal with a lot of Microsoft Outlook winmail.dat files, this is for you (Commercial)
2. Mailboxer – Automatically makes Smart Mailboxes for your address book contacts
3. Event Maker”:http://www.mamooba.com/EventMaker – Event Maker allows you to create normal and all-day events and To Dos from a selected message in Mail.app or from scratch using quick launch scripts
4. HTTPmail – Hotmail and MSN access for Apple Mail
5. MailTags – Tag you messages with keywords
6. Mail Attachments Iconizer 2.0 – Toggle icon view for image attachments
7. Growl Mail – Mail plug-in for growl notification system
8. WideMail – Provides wide-format view option
9. MiniMail – Process mail from a tiny window (commercial)
10. Eudora Mailbox Cleaner – Eudora to Apple Mail migration tool
11. EagleFiler – File your mail and other things (commerical)
12. MailAppetizer – Email notification (beta)
13. MailTemplate – Templates system for emails
14. DockStar – Lets you keep track of email in various accounts and folders, RSS feeds, Notes, and To Do items with customizable badges in the Mail icon, menu bar, Dashboard, and even in a Screen Saver.

If you want to find more tips and tricks, head on over to http://www.hawkwings.net/ it is a blog all about Mail

What do you think?

Let’s hope there’s lots more to come.

Here are the results:

My beautiful fiance, Alice in our hallway

Smooth criminal Morgan

Alice being naughty

An experiment with the red flash, Morgs with a shaved head…

I also thought I’d edit one a bit, what do yo think Thrift?

Have you ever needed to find a website/company/band name and had the idea of what you wanted, but just couldn’t find the perfect word(s)? I know I have, and, recently while doing just such a search I stumbled upon a great dictionary website, the Onelook Reverse Dictionary . Please head on over there and check it out, it’s darn useful.
P.S. it does come up with some rather interesting (read crazy) results!

Need gig tickets in the UK, check out Gigs and Tours

Have you had enough with ebay? Why not try Telebid . Its a new style of bidding website; one where as the auction time decreases, you bid using your credit, and each time you bid, the price of the item goes up along with the time. The auctions are won by the person who was last to bid before the timer runs out, and of course the auctions tend to go on for bloody ages! Try it

MacLorem generates that great placeholder copy that we all love to use. It is freely available from the developer’s website

Erat, illum feugait, amet lobortis vulputate ex enim delenit molestie dignissim praesent blandit ea, exerci dolore blandit lorem, vel praesent quis sit eum esse eros crisare. Molestie vel augue autem quis ut facilisis dolore duis autem, veniam dolore qui. Tation nisl vero vel, odio vel elit quis amet aliquip dolore ullamcorper, blandit et iusto, ut nisl. Qui nisl tincidunt vulputate blandit vel ut in facilisi elit facilisi ad in praesent. Aliquip eum vel quis augue iusto velit nonummy nibh nonummy, te dolore facilisis laoreet crisare duis molestie ex erat velit. Euismod autem tation augue eu nostrud illum nostrud.

At the moment it only has VERY basic functionality because I have only spent a few hours on it. When I get more time, I will completely redo the site to become a premier food resource with a twist.

Watch this space at Nibbl’d.com

There are four executions. This one in reference to 9/11, another (beautifully shot) for Hiroshima 1945, the JFK assassination and the ’76 Soweto riots.

Using iconic events from history, the campaign highlights the fact that world-changing events often can’t be predicted and that the course of history can, quite literally, change in a day.

Love the art direction and the hard-hitting message of these ads. Stunningly arresting.

Agency: Lowe Bull Cape Town
Creative Director: Kirk Gainsford
Head of Copy: Alistair Morgan
Art Director: Brian Bainbridge
Copywriter: Simon Lotze
Account Manager: Lindsay Keen

These stills are all taken with my Nikon D70 with either my 18-70mm or my 70-300mm lens, they are a few of the literally tens that I took and the only ones worth showing off. Let me know what you think..

Ski Holiday: £200 ish
Aviators: £80
Old 80’s Ski Jacket: £12
Receiving absolutely no weird looks for this brilliant get-up: Priceless!

Me & the Scenes Of A Sexual Nature Crew with Ewan McGregor and Douglas Hodge, originally uploaded by ambhoare

Just in case you wanted to know, I’m the tall guy in the stripy shirt on the left.

Check out the site at bauercount.com

Here’s a video of the same thing recorded on my crappy stills camera…

And here are a few shots from the concerts…

During Fix You:

And during “In My Place”…i think!

Red Fort Guard, originally uploaded by ambhoare

While doing a recce for a shoot in India, we walked around the Red Fort in Old Delhi and upon this guard, he was not posing for a photo, although you think he was, but doing his job and making sure everything was ok. I love the symmetry of the pillars making the subject appear very grand, I also made the image black and white, added a bit of grain to give the image an aged look.

What do you reckon?

There’s a great album showing Blighty circa 1890

There’s another album called Defining Moments

Check out the site and delve into the cornucopia of old images

The Holga in all it’s plastic glory!

The kind of images these cameras create – not one of mine..

Expect to see loads of my experiments on the site…

Unfortunately, after hours of hunting, this is the best copy of the print that I been able to find

Grayson also has other prints that can be viewed by clicking here

The Turner prize winning pottery I spoke of earlier:

Village of Penians, 2001

Check them out!

This is me boarding over Flaine

My mate James skiing, behind me, I might add!

Clouds rolling over the peaks

Moi again…

Looking up the lift

Ski Tracks

A random, lonely boarder

Ski Tracks Deux

Or you can check it out here

Suffice to say, on Wednesday morning I woke up far too early with a bout of The Delhi Belly!!! I was unable to do any filming and was bedridden for the next few days, while receiving some medical help, I was almost fine by our return flight on the Friday…

Lucky me I know!

Colourised nuts!

This is where we were:

View Larger Map