Your website - now be honest, is it rubbish?

Your website is not a toy or a novelty. It is a viable aspect of your business. Large plc's use it to reduce customer service calls, rock stars use it to sell gig tickets, and the best retail outlets know that they can shift just as much product, and more variety, to more people through mail order of their online stores.
So if you are in business it is no longer a question of "Shall we build a web site?" or even "When are we getting out web site up?", it is actually:-

"Why isn't my website helping my business?"

Your disorganised intranet will eat up your employees time while they try to look for things, and a disorganised company website will prevent your customers from buying what they want.

But you already know that.

Just how expensive is it?

• Appearing amateurish, so making people not trust you, so they don't spend.
• Annoying customers, when they can't find things, pushing them away to your competitors.
• When potential customers can't find you in the first place.
  

Well designed Information Architecture will improve:-

• Findability - Giving customers easy access to the things they are looking for.
• Usability - Give your customers the easy way to accomplish what they want, whether it be getting your address or buying from you.

And this is all about:-

• Understandability - Good Information Architecture will provide the infrastructure needed to help people turn Information they find into Knowledge.

Unless something is done about it now, the people you want to influence the most will get lost in a sea of information that it getting deeper and wider every day.
Stand out, and make what they want easy to acheive.

Why blogger?

It's easy and it's free!!!

Advantages of using google blogger.

1. Really easy for amatuers to add content. As easy as writing an email.
2. It's a google product, google likes it, makes the main website rank highly in searches
3. Unlimited storage. You add as many pictures, videos, text to the blog as you like and it's free and it will archive it for years to come.
4. You can set different levels of permission so that one person could write, or 5 people or anyone can update the content.

There are other sorts of CMS, content management systems out there and they are fantastic for commercial organisations that can afford a web developers time on the original set up but for low cost you can't beat google's blogger.

Amatuer Clubs Websites

Many amateur share the problem of needing a website that:

· Keep up with what's happening.
· Reports on the latest event, photos, etc
· Telling new members where they are, how much things cost and when events are happening etc.

However, many clubs do not have the money to keep paying a web developer to make the changes.

A solution to this is:
Set up a simple website has:
1. Fixed or permanent information e.g. location, costs, contact info.
2. A blog that can be updated by the club secretary to add information, news and pictures, match results etc..
3. The web developer then builds a "site feed" which drags the information from the blog so it appears, is if by magic on the club's website.

This gives the best of both worlds – a website that is low cost to set up and lets the club regularly update the website without having to pay for a web developer or have training in web programming.

Updating a blog is as easy as writing an email.


To give an idea of cost –
1. You need a “domain name” – this is what you type into the internet to get to your website e.g. “www.my_club.com - costs around £20 per year - depending on if you want a “.com” or a ".co.uk”.
2. Then the website has to sit on a “server” which is connected to the internet
– this is called “hosting”. The cost of hosting a small website approximately £5 per month.
3. Some money for the designing and production of the simple website. 2-3 hours work.

What about twitter?
A twitter feed could also be included on the website, and this is a good idea for short news items like "the game has been cancelled!". This can be updated by phone and followed by members by phone too.

Standards & Accessibility - a quick guide

Standards exist so that there is an agreement between different browsers on how documents should be presented/rendered.
Looking forward to the future there is always a new next generation browser and adhering to standards ensures that the web pages keep their original look.
Part of that standard is writing clean mark-up and separating presentation from the content. This gives the user the control over how they want access the content.
This also makes it easier for redesigning a website and providing different versions, including a text only version in high contrasting colours.

I design websites that validate using the W3C validation tool for XHTML and CSS. This means that complying with accessibility requirements is easier and and I always try to make considerable progress to comply with the WCA Guidelines. There are fourteen guidelines but only a few are relevant for most websites. The guidelines have been assigned checkpoints and that allow the web designer to check whether or not the web site conforms to the guidelines. Each checkpoint has been assigned a priority level or 1, 2, or 3. The priority level tells the web designer how important the checkpoint is.
The Priority 1 checkpoints identify the basic steps that should be taken to ensure that most people can access the website.
I have summarised the relevant and commonly applied WCA guidelines
1. Provide text equivalents for pictures i.e. meaningful alt tags.
2. Don’t rely on colour alone
3. Use mark up and style sheets
6. Ensure pages featuring new technologies transform gracefully

Guidelines 1, 2 and 3 I will always include, but sometimes it can be difficult to implement guidline 6, but don't forget the website will still validate XHTML and CSS.
Dreamweaver has tools to check validation for XHTML, which seemed very accurate although I usually use the W3C’s validation tool alongside. I used the tool to check for browser compatibility and at it will highlight if there are any issues in for example Internet Explorer 6. Usually I have no presentation issues in Firefox 3.0 or Internet Explorer 7/8, which are the browsers I consistently check the pages in.
I always check each page for accessibility using Dreamweaver’s tool which picks ups, non obvious things like not providing meta data for all pages, needing to provide some title’s to links on some pages and sometimes things like needing to provide a text alternative to the JavaScript rollovers. The rollovers could actually be done using CSS and in the future I will do that instead.

cheers

martin

further reading can be found at
http://www.w3.org/TR/WCAG10/

Keywords - explained

Keywords are a type of meta data which describe content. Appropriate keywords for a site are words taken from the text of the pages, as anything else can be penalised (Get Into Bed with Google by Jon Smith 2008) and result in a lower ranking. Other keywords I could include in the meta data are misspelled versions, plurals, and abbreviations.

The relevance of keywords is not as important as it once was. Google no longer takes any notice of them according to searchenginewatch.com. What Google looks at is key. Nielsen online has publicised the search engine share rating January 08 for each of the major search engines.
Google Search captures 62.8% of all searches, followed by Yahoo at 16.2% and MSN at 11.2%.
The highest of the others is no higher than 4% and most are below 1%.
Google places more focus on titles, headers, alt tags and main text, i.e. the content so always when writing code I ensure that it can be easily read by Google and the other search engines.

How does a website happen? A short guide.

The basics of how it happens.
1. Talk to the client
2. Register a domain name and arrange hosting
3. Resource Preparation - images, text
4. Plan page layouts, navigation structure.
5. Decide on how much usability, standards and accessibility I need to build in.
6. Start coding in HTML and CSS, building SEO in to the content.
7 .FTP - Upload the code to the server
8. Test in different browsers
9. User testing
10. Editing and agree future maintenance.

HTML, hyperlinks and images - the basics.

When working in HTML for the first time the very first principle that was is the one of "containment" which means that content must have a tag in front and a tag and the end.

With this blog I have used examples of html code but left off the <> brackets that usually surround the code so that the code is not recognised by the blog text editor.

The next is what links the internet together which is the hyperlinks and these can be a "relative address" where you use the Anchor hyperlink reference or "a href" to go to a local directory and "absolute address" where you use the full hyper text transfer protocol (HTTP) address that you see entered in browsers.

Something that is in the book Heads first HTML & CSS was the terms "Parent" or "grandparent" folders when referring to relative linking.
If the parent folder is the folder that all the code and images are held then any page linking to another page within the parent folder does not need the full HTTP address in it's link.
For example A page would use the tag a href="bpage.html" (inside of <>) then the words describing the link such as "link to B page" then the closing tag /a inside <> brackets.
The full address of "B page" could be placed there after the ahref= but it is not necessary.

If there is another level folder the parent folder, can become the grandparent folder.
If you want to link a page that is held within the lowest level of folder (which you can call the parent folder) and you want to link to a page or image in a higher level folder (which you could call the grandparent folder) then you use the tag
a href="../apage.html" then the description, and then the closing tag.
And this is still addressing the file or page locally.

Useful for long scrolling text is the relative links that are links that point to the Anchor point that is at the top of the page.
You may have seen this this before where sometimes you see a "back to top" link. Of course you get this the other way with the Anchor points throughout the long page with the links to them at the top commonly used in FAQ pages.

Absolute addressing then is only necessary when you want to link to websites outside of the one you are currently looking at.
And so the full HTTP address is used but sometimes you don't want to have the reader/user leaving your website and just simply open a new window with the original window still open then you use:-

a target="_blank" href=http://www.etc etc etc.....

Without the attribute "target=_blank" the reader may leave your website and never come back!!

The next important principle while working on a web page is how your working environment should "mirror" whats on your public or server file.


And lastly a quick word on images.

1. that you should use the "alt" and dimension attributes because they are required for validation.
2. that you can dither a GIF so that you can give the appearance of a graduated colour without going to the generally large file sizes of JPEGS. Which could be handy for a vector diagram such as a company logo with a graduated tine or it could be used for a button or tab like the tab on the browser window a few inches about this text if you are using IE 7. But this is of limited use and JPEGs are still better for photo's.
3. Interlacing where the image appears out of focus and then gradually comes into focus as the page loads fully.

Anyway that's the basics.

Broadcast Quality Video Sequence on the Web.

What are the technical considerations and typical workflow process involved in capturing, editing and exporting a broadcast-quality video sequence using a video editing software application like Adobe Premier Pro?

This sequence could equally apply to Final Cut Pro (Mac) or Pinnacle which are both excellent for editing video.
Having prepared a resource folder ready take in items for your project, the sort of raw files you may start with are:-
Video Clips - Flash SWF, AVI, MPEG 1&2, Quicktime, Windows Media WMV files.
Sound Clips - Audio AVI, MP3, Quicktime Audio, Windows Media WMA files.
Still Images - JPEG, TIFF, GIF, PSD, and even flm files.

You will also need a PC or mac with a fast processor, and large amount of hard drive space. Video projects are large while you are working on them, before they are finally compressed ready for broadcast on the web. Two monitors make thinks easier too. One with your resources and one with your constructed sequence.
Now launch Premier Pro, open a project folder and choose what sort of output format you will need for broadcasting. For example for television, (not HD) you will need to choose to output at 31Megabytes (MB) per second. Now you can see why you need the high end processing power!!
Next choosing the depending on the country of broadcast you may choose Phase Alternating Line (PAL) or National Television System Commitee (NTSC) which for colour TV is 720 x 576 pixels and 720 x 480 pixels. The 31MB per second comes from multiplying the number of pixels by the frame rate (frames per second - fps).

PAL = 720 x 576 x 3 (RGB) x 25 fps = 31MB/s
NTSC = 720 x 480 x 3 (RGB) x 30 fps = 31MB/s

Where RGB stands for Red, Green, and Blue, one pixel for each colour.

This may seem overkill to talk about TV broadcast quality but broadband speeds are getting faster all the time plus it is better to have a really qood quality version of your finished sequence that can always be compressed to match the broadcast medium later.

Now at this point you can click OK and start your project proper.

Bring in any resource files to the project folder which is on the far left of the Premier Pro inferface. You can then preview any of these files by dragging and dropping them into the source screen.
Using the scrub wheel you can easily find the points you need to mark. Marking the start and finish of the segment you want with "outpoint" which look like curly brackets. Then simply drag and drop the segment to the timeline which appears at the bottom of the Premier Pro application.
Repeat this adding the segments to the timeline while previewing what is on the timeline in the sequence screen.
You can also do more accurate editing using the timeline.
Audio is added to it's own timeline and can be edited in Adobe Soundbooth.
Premier Pro has a long list of transitions and effects that can be added to your sequence. For titles, and credits etc it is best to switch over to Adobe After Effects. This is done seemlessly from Premier Pro.
And finally when finished the sequence can be compressed or flattened ready for broadcast. At no point were the original resource files edited or erased.