If you managed to catch my recent blog post on what place Flash has in web design today, you will know about Apple  going against using Flash in their iPad and  iPhone devices. This is because many Apple computer users are all too used to Flash crashing on their machines, so much so that Apple have looked to alternative ways to deliver video and other dynamic content. HTML5 might be the answer to Apple’s problem…

HTML5 is currently being developed by the Web Hypertext Application Technology Working Group (WHATWG) for the W3C who recommend the standards for web browsers.   Although the latest versions of Firefox, Safari, Chrome and Opera have started supporting certain elements of the BETA HTML5, it won’t be until 2012 when they have something ready for the W3C to consider for candidate recommendation.

It is also predicted that we will have to wait until 2022 at the earliest until everyone will be using HTML5 as standard. 2022 is long way off! China will have taken over the world by then, Pandas will be extinct,  Venice will be flooded and I will be the ripe old age of 35! Plenty of time for Flash to get it’s act together.

So, how will HTML5 improve the way we view websites? The primary reason for it’s creation is to remove the need for people to constantly have to update plugins like  Adobe Flash, Microsoft Silverlight, and Sun JavaFX. The new <video> and <audio> tags will allow content to be inserted without all the extra laborious code that is required in XHTML to pull outside sources.

This will mean that sites should load faster which will benefit users, and of course is likely to be looked on favourably by search engines.

The aim of HTML5 is to standardise how websites are rendered across all browsers – at the moment without careful testing sites often look vastly different even in the popular browsers.

As a web designer, I am delighted to know that HTML5 is on it’s way – even if it may be quite some time before it’s launched.  I certainly won’t miss the trials and tribulations of getting websites to work in all browsers!

Image credit: Justin Insomnia

There was a time on this earth, not that long ago, when you actually had time to make a cup of tea and drink it whilst waiting for a website to load. It would likely have meant that a gung-ho web designer had decided to create a dial-up choking intro animation that required the use of a seemingly infinite loading screen. We live in an age of minimalism now; an age of clean, understated websites that deliver a simple message as effectively as possible. Just look at Google and Facebook.

Flash was released in 1996 by Macromedia as an animation tool for the web and was later bought out by Adobe. It was rebranded as an Adobe product in the CS3 generation of software updates. It retains the timeline structure of an animation program, but still uses its own programming language, Actionscript, to power dynamic and interactive content.

Traditional Flash animation sites like Weebls-Stuff.com use vectors which for a long time were the best way you could stream animation to people. That all changed when Adobe introduced the FLV video format. You could then stream high-quality video over the internet much faster that any vector based animation could. Flash FLV powers YouTube and almost every video sharing site on the internet.

Not everyone, however, is a fan of using Flash; even here at Gravytrain we are divided.  Apple has taken the bold move to deny users of any iPad or iPhone the use of Flash. Although iPhone and iPad users can’t see Flash; the devices still allow users to view YouTube videos using the YouTube app.

The main problem with Flash is; even though some of the text in .swf files can be indexed by search engines, not all of it is. Google indexes flash text, but gives preference to text that can be read without the use of Flash.

Most people who use Flash use it to display video, animate a button or show an image gallery.  Apart from video, there are javascript and ajax alternatives that will do those jobs just as well, and make the web page easier to view more in most browsers. Sites like Miniclip.com allow users to play games that are rich, interactive Flash-based experiences; that can’t be replicated any other way.

I personally love the range of rich interactive experiences that you can create in Flash; such as the growing genre of interactive film.  Survive the Outbreak is a typical example of how Flash can be used to give users an experience that they have control over. You watch a film from the perspective of the protagonist, and at the end of each scene you choose the direction the film takes. Through your choices the narrative takes different turns; leading many potential endings. This is a very engaging experience in comparison to the passive experience of watching a film.

I wholeheartedly suggest you consider looking for an alternative every-time you want to use Flash on a webpage. Can you use a gif animation instead of Flash? Can Java be used to make that image gallery? But, if there is an instance where Flash would give you the best choice; such as a killer opening animation, go ahead and use it!

It’s that time again; the unveiling of all the new software generation used by almost every graphic and web designer in the world . Here is a look at the improvements to Adobe’s main packages used by web designers.

Photoshop CS5: This is the undisputed Daddy of image manipulation, there is no other comparable piece of software that even comes close to it’s functionality. The only area where Photoshop gets competition is via paint effects, where historically, software such as Corel Paintshop have had the edge.  To try and monopolise this area; Adobe have drafted in John Derry – pioneer of digital painting and one of the original authors of Corel Paintshop to develop further Paintshop-like features into Photoshop. The most stand out new addition being; a much more comprehensive list of  brush types.

Another big improvement over CS4 is vastly improved edge detection; allowing for quick and easier masking of complicated images like animal fur.

A feature debuted in the animation package After Effects CS3 that allows you to pin point joints on a flat image, that then can act as pivot points on a character’s movable limbs, has been brought forward into Photoshop CS5.

Two other new features include the ability to auto-fill an area of generic texture, and a feature that helps you manipulate a building structure easier.

Flash CS5: The biggest gripe with the iPhone was it’s lack of support for Flash. The newest version of Flash will allow developers to create Apps for the iPhone by automatically generating the code that the iPhone can recognise. Flash CS5 will also let those who are not completely actionscript savvy to develop with Flash Catalyst in a Photoshop like design interface.

Dreamweaver CS5: Formally created by Macromedia; a company brought out by Adobe a few years ago. Dreamweaver bridges the gap between designer and developer by allowing you to see what the page looks like visually simultaneously as you edit the code view. With CS4; this is not a perfect feature as you can’t see how a PHP or database driven website would look like until you made it live on the internet. No matter what a developer says; they will never get a site looking as good as it possibly could if you can’t see what you are working on looks like. You wouldn’t commission a blind folded artist to paint your portrait.

Dreamweaver CS5 integrates with Adobe BrowserLab, one of Adobe’s Live online services. BrowserLab lets you preview the website that you are working on locally to see how it will look in different browsers.

Illustrator CS5: The biggest new gimmick they are pedalling is the option to draw shapes and scenes in accurate 1-,2-, or 3-point linear perspective to create the look of realistic depth and distance. Knowing that Illustrator is a 2D drawing tool Adobe have always been trying to bridge the gap between 2D and 3D. 3D has been about the only computer design area that Adobe has left untouched and by allowing users to replicate 3D look. The big boys of the 3D industry like CAD and Autodesk won’t be kept up at night as Adobe are yet to let users design truly accurate complicated 3D designs.

Other features include the ability to let you edit the individual pixels of vectors, new manipulable bristle effects on brushes and greater integration with other CS5 software packages.

Overall: Adobe never disappoints us with each new software update and I can safely say I am looking forward to procuring CS5. The greater integration between software packages and quicker rendering of large files will allow me to increase my work flow speed ten-fold.

I just hope Apple will hurry up and announce a newer version of their Mac so I can use all of these great new software packages to their fullest.

When we are developing websites for our clients we are not just creating a site that looks and feels great. There is a lot of behind the scenes work to make sure the site can be viewed no matter if it’s Internet Explorer, Safari, Google Chrome, Firefox or Opera. Here are 3 helpful steps to take to make sure your site will work in all browsers.

1. Validate the Page

The first thing you should always do when you create a new site is put in the DOCTYPE validator into the top of any page. What this does is tells the browser what kind of markup to render the page in. Most newer browsers can guess how to show the site if the Doctype validator is mistyped or non-existent. Although,  those browsers on devices with limited memory like phones  will not display as well without a correct validator.

To get a list of different DOCTYPE validators go to www.w3.org. If you are developing the website in Dreamweaver it will insert the following code automatically every time you start a new blank HTML page.

2. Test it in all Browsers

I make sure to test the site in all the most popular browsers before I make the site go live – just to make sure it displays correctly. Every browser has it’s nuances with how it formats different code types. With all these different browsers come different versions, and the headaches begin! There are many sites like Browsercam.com; that allow you see how your site will look in different browsers on different operating systems.

It’s also useful to know which browser versions people are using. To find the most up to date statistics on browser usage see: www.w3schools.com.

Don’t forget about Flash! When I am creating a new Flash Video FLV file it gives me the option to select which versions of Flash I want the FLV to work in. Having it compatible for older versions of Flash will allow more people to see it but will limit the functions that newer versions can format. For example to make the FLV viewable in full screen mode needs at least version 9.0 to work. Those without that version or newer will not allow that video to be viewed in that mode.

3. Make the corrections

Once you find an offending piece of code you will want to search the Internet for tutorials and forums that will help you solve your problems. You can find useful help on common problems with cross browser compatibility at westciv.com.

I confess to being a late convert to WP Plugins. For those who do not know what a plugin is… it is an ‘add-on’ that is used to add functionality to a WordPress blog or site.

In the past when I have wanted to add something to a blog, I would commence battle and try to hard code the elements into it. That was until I tried to put a form into a post. I stubbornly tried and tried to find a way of doing it, before deciding to take a look at some forums. I then conceded to go the plugin route and have since been a little addicted to them.

It was a bit like discovering Aladdin’s Cave, all these add-ons that people had sweat, bled and cried over when building, available to simply browse and install at will. There are plugins for all sorts, from funky image galleries to e-commerce solutions. You have to be prepared to sieve through a fair amount of results and sometimes the plugins won’t have the desired outcome but you have to remember, you are getting cool functionality for free and ultimately less work than building it yourself!

There are quite a few sites that offer WP Plugins, I find the best way is to go to WordPress’ own plugin directory http://wordpress.org/extend/plugins/ . There are over 6000 plugins to search through and each display information like how many downloads it’s had, version compatibility, screenshots and a star rating system.

Implementing WP Plugins is relatively easy. The traditional way of doing it is to download it and then upload it to the plugins folder (wp-content/plugins).  You can then activate them in your admin area. However WordPress have made it even easier to install plugins if you have or have updated to one of the later versions (2.8.2 onwards). You can now search install and activate plugins all from your admin area (you will need your ftp details to complete the installation).

Plugin Menu in the WP Admin

Just before you go down the rabbit hole and into the wonderful world of plugins;  as with everything good there are always some downsides and here are some that I have noted.

1. Some plugins are only compatible with certain versions of WordPress. So you could update your wordpress only discover it has broken one of your plugins. Remember to check version compatibility before installing a new plugin.

2. It can take a lot searching and trial and error to get a plugin working how you want it to. Try and consult the installation instructions.

3. Because they are free some plugins might not have as much support and guidance as you may like.

4. Whilst plugins appear to provide general solutions for most things. They might not provide the exact solution you are looking for and you may find you have to compromise or end up trying to customise it yourself.

That’s about it I reckon; now go get stuck into some plugins!

Image credit Whatleydude