CompuSkills Blog

As mentioned previously on this blog and elsewhere, we have currently been undergoing a site overhaul on the main Compuskills website.

This has now been (successfully) completed and the site has gone live a few hours ahead of schedule. This also means that the testbed site is no longer functional.

Thank you for your patience.

Technorati Tags: Compuskills, Web Design, PHP, UK Company, Site Makeover

What is usability? Everyone agrees that web pages should be easy to use. However, defining usability is something of a battleground. There seem to be as many definitions as there are usability gurus. Some generally useful ideas from the mass of usability material include: Don’t make users scroll sideways to get crucial information. Don’t put information more than thee clicks away. Don’t use mystery navigation, such as navigation that relies on icons. Test your pages to death on a range of people who don’t know what to expect.

Wherever possible avoid features that don’t work in all browsers. (This is a lot harder than you might think, given the wide array of browers out there now and how each of them has an almost random interpretation of the “standards.)

Technorati Tags: standards web design Compuskills web standards usability

As mentioned last week, the Compuskills site has undergone a bit of a makeover, with considerable changes to the backend (the server side PHP) which should make it easier for future maintenance to take place.

Everything has progressed well, (you can see the development in progress on the testbed site) and it looks like the deadline will be met.

Tags: Compuskills, Web Design, PHP, UK Company, Site Makeover

What is Javascript? Firstly, Javascript has little in common with Java, which is a full-scale programming language. Javascript is a scripting language, mainly used to add functionality to web pages, through actions performed on the user’s computer (client-side) Javascript can carry out actions that aren’t possible using standard HTML. These actions include opening pop-up windows, setting cookies and validating user input on forms before they are submitted.

Technorati Tags:Javascript AJAX Web 2.0 Accessibility Client Side Scripts Client Side Scripting

If you are interested you can see the development of the new Compuskills home page taking place over on the web design testbed.

The estimated “Go Live” date for this new overhaul is 00:01hrs 17 Feb 07. Most of the changes have taken place at the back end, with more and more the content being CMS generated through PHP. The general look and feel of the site has only undergone minor, cosmetic, changes.

As this is a PHP heavy site, we were (unfortunately) unable to use it to test Expression Web design, but will keep working with the package on other sites and report our progress (if any) in due course. At the moment, we are not really sold on this software. Pretty much all the work on this makeover has been done in Dreamweaver or notepad.

Tags: Expression Web, Dreamweaver, Compuskills, Web Design, PHP, UK Company, Site Makeover

We have been fortunate enough to have been given a copy of MS Expression Web design software for a trial basis. The intention is to create some of our personal sites using this tool and see how it compares against the likes of Dreamweaver, NVU (which has been blogged about by staff in the past) and the truly wonderful Bluefish editor (again, discussed elsewhere).

Before we begin though, there is the need to “declare” a couple issues which point to a definite bias.

First off, our preferred OS is Linux although we do have Windows machines to use (and regularly use them). Also, nearly all the website construction tasks we perform are on Dreamweaver and Bluefish - which we love.

Also, critically, nearly all the sites we develop use PHP as the server side language and Expression Web does not support this. To make the testing “fair” we will endevour to create ASP, ASP.NET and plain HTML sites and we will be as objective as possible with our conclusions.

That said, unless MS does something significant to change the way Expression works it is very unlikely we will adopt it to develop CompuSkills websites (as almost 95% are PHP driven).

Tags: Expression Web, Dreamweaver, Microsoft, NVU, Bluefish, Software, Web Design Software, PHP, ASP, ASP.NET

The Extended Live Archive is an excellent wordpress plugin that lets you automatically create an AJAX powered archive page for your WordPress blogs. We have currently set it up on a blog for you to see it at work here.

It does suffer from one massive problem though. It wont work in anything except IE 7.

This is a shame, the plugin from Sons of Skadi, is excellent. When it does work (for example, in IE7) it works well. The problem is when it doesn’t work there is very little in the way of place holder content to tell the user what they are missing out on. The Support Forum for the plugin is almost useless for this (despite the number of times it tells you to go there for advice) so it seems that this is either a unique problem to the way it has been installed this time, or a bug which will remain for quite a while.

Now, IE is IE so in time the entire world will be using it but currently there is not a high enough percentage of users to make this sort of plugin sensible on anything other than a personal page. Remember more half the people out there, browsing, are not using IE7!

There are, as you can imagine with such a complicated plug in, several pitfalls on the installation but the 24FightingChickens site has some excellent advice to work through these. Shame about the Opera / FireFox / IE < 7 problems though.

Tags: Word Press Plugin Software Blog Usability Cross Platform Cross Browser AJAX Web 2.0 Client Side Scripting FireFox Opera

Previously this blog, and the others managed by Compuskills web design service, has suffered from massive deluges of comment spam. This has resulted in the institution of practices such as the Captcha which was frowned up on for its lack of accessibility.

Since upgrading a multitude of sites to WordPress 2.1, the level of comment spam has dropped considerably and as a result we have changed the way comments are moderated on this blog.

I hope everyone finds it a bit better now.

Technorati Tags: WordPress Blog Software DDA Disability Discrimination Act Accessibility standards web design Compuskills web standards usability

Smashing Magazine provides a helpful page of tips on how to use CSS to do things that would be difficult to use otherwise.

At first, it looks like a pretty useless list of CSS tricks. I was thinking “Well, they look like CSS things but they don’t tell you where to fiind the code. It’s just a scam”

However, doing the sensible thing and clicking on the html link for each example and choosing “view source” lets you see the css techniques that were used, so you can adapt them. In the expectation that we’ll be trying out some of these techniques here at Compuskills, I am thanking Smashing magazine in advance.

In the late 1990s, planning the appearance of a web page was hard work. If you wanted to have any control over how the page would be displayed in the user’s browser, you had to apply a range of formats to every piece of text. A font tag that specified the colour, size and font-face would have to applied and then completed every time you wanted to change the text. It was often difficult to separate page content from layout instructions so writing and debugging pages was very time-consuming.. Table layouts allowed precise specification of the placement of objects on the page. However, if you wanted a page layout that didn’t look like a spreadsheet, it was something of a nightmare keeping the correct levels of table nesting in the correct columns. One extra cell tag, that couldn’t be seen because of the profusion of tags could throw out your whole page

The first version of Dreamweaver was unbelievably popular, although it’s hard to see why. It eased the process of creating table layouts but created them in such an odd way that perfect looking pages could fall to bits on a monitor of the same size and resolution using a different operating system. Dreamweaver popularised div tags in its next incarnation. That program could change table tags to div tags. However, to use the program effectively, it was necessary to know html well enough to write the pages in Notepad anyway. (Hand coding using a text editor could achieve the same effects five times as quickly and with code that was much less wasteful of bandwidth .) As these became more widely used, largely thanks to the (then) incomprehensible popularity of Dreamweaver, web designers started to move towards the concept of applying a format to a tag, giving the format a name which could be called up when that format was needed. This was the first step towards keeping the layout instructions separate from the content, which was the major purpose of CSS.

CSS is an brilliant idea. It can easily produce consistent formats across a whole website. It takes much less effort for the designer than the traditional ways of shaping the look of a website The look of a site can be transformed in a moment by replacing one stylesheet with another.

Like everything to do with IT, once a thing became possible, clever and creative people pushed it to its limits. As shown by the examples in the Smashing Magazine page, you can now use CSS to achieve effects (such as drop down menus) that would have previously involved ugly and cumbersome JavaScripting. CSS let you apply specific styles in different circumstances - you can create a choice of styles that direct how you display the same html page on a mobile phone, a printer, a PDA and a traditional PC.

However, also like everything in IT, nothing is as easy or straightforward as you’d like it to be. Once a technique exists, a new one is developed that makes it obsolete before all the bugs have been ironed out. CSS can also be very frustrating to use.

The worst problem is caused by browser inconsistencies. These are the most damaging at the most fundamental level - the location of objects on the page. The old-fashioned table layouts would always give you what you expected, as long as you took reasonable steps to adjust for screen resolutions and sizes. With CSS, it may be genuinely impossible to achieve a page layout in FireFox that looks even similar to the same page you see in Internet Explorer. On the same PC.

This is not an argument against CSS. You need to learn a wide range of workaround techniques to make full use of CSS or to get advice from web designers with experience of setting up pages.

Technorati Tags: CSS Design Web Design Style Sheets Compuskills

What are the advantages of using AJAX techniques? The combination of Javascript, XML, css, HTTPRequest / i-frame can add a degree of interactivity that greatly enriches the user’s experience. At the same time, less bandwidth is used when server requests are limited to be sent only on-demand.

Technorati Tags: AJAX Java Script XML Scripting Client Side FAQ Frequently Asked Questions Compuskills Asynchronous