creacog

Product Owner/Manager; Digital Project Manager, ex-Developer Available for Product Owner roles
Product Owner/Manager; Digital Project Manager, ex-Developer Available for Product Owner roles
21
Aug
2006

Mac OS X batch xhtml validation

While many development tools include report generators capable of testing the validity of your xhtml site wide, they can only act on the code they are aware of. Where pages are dynamically generated using server-side scripting such as ASP / PHP etc, the only real way of testing the resulting xhtml is to test the content at run-time. The w3c validator is a handy tool for doing this, but it can become tedious to use interactively across a large number of files or test-cases. Additionally, if the site files are part of an extranet, or carry confidential information, you won’t want to be pushing the content out to a public service for validation.

An approach I use from time to time is to batch test site files on an internal network. To do this I use the following tools…

  • w3c validator
  • wget
  • awk (this is already on your system)

There is a small amount of work to do in setting up your system for this approach.

1. Install the w3c valdidator locally

Apple have produced and maintained an excellent article on how to install the validator onto your Mac OS X system. However I found a few areas which at time of writing were not accurately described…

  1. The Base code and the DTD Library downloads are gz files not tar files. This means the 2nd and 3rd lines of the instructions will not work as written. If of-course you double-click the downloaded files on the desktop, they will first expand to the tar file, then expand to a folder on the desktop. At which point will now have the following files and folders on your Desktop:
    1. sgml-lib.tar
    2. sgml-lib.tar.gz
    3. validator.tar
    4. validator.tar.gz
    5. validator-0.7.2 (folder)
    6. validator-0.7.2 2 (folder)
  2. validator-0.7.2 2 actually contains the expanded content of the sgml-lib.tar.gz file and contains a htdocs folder itself containing a sgml-lib folder.
  3. The instructions also seem to fail to inform you where to place the sgml-lib folder. It is apparent from the validator.conf sample file, that the sgml-lib folder should sit inside htdocs. So before going further. just through the finder I copied the sgml-lib folder from validator-0.2.2 2 to validator-0.7.2/htdocs/
  4. We can now pick up the instructions on the 4th line which reads “cd /Library/WebServer/Documents”. The remainder of the instructions worked fine for me on Mac OS X 10.4.7
  5. To test your completed install, paste visit: http://localhost/validator/htdocs/

2. Install Fink Commander

As part of the process of installing the validator, you have installed Fink. Fink commander provides a GUI interface to Fink, I suggest you install it as the next step.

3. Install wget

Using Fink Commander, download and install wget. This is a command-line utility that we will use to automate the downloading of files.

4. Create a ‘batch’ file

OK, strictly speaking not a batch file, but a text file of urls for wget to request. We must first take our list of files and process the text for form suitable urls. For this I suggest the following steps…

In the terminal window, use the following commands…

Using the terminal window, navigate to your local webroot folder.To generate a single column list of all the files within webroot we can use the command…

ls -1

We can send the output of one command directly to the next command using the pipe symbol “|”. Ultimately we wish to create a file containing full urls to the files we want to process. So the next stage is to prefix the filenames with the start of the url. We can do this by ‘piping’ the results from ls into awk. Then finally directing the output to file sourceURLs.txt which will be created up one level so as not to infect the webroot. So on one line…

ls -1 *.asp |
awk '{printf"http://localhost/validator/htdocs/check?
uri=http://www.yourdomain.com/%s\\\n",$1}'
 > ../sourceURLs.txt

Note: Currently I don’t have style sheet control on this blog. The above 4 lines should be typed into your terminal as a single line.

5. Process the urls

  1. move up one level so your working directory contains both sourceURLs.txt and the webroot folder…
    cd ..
  2. create a new folder to contain the validation reports…
    mkdir validationReports
  3. change to that directory
    cd validationReports
  4. execute wget using sourceURLs.txt to create validation reports of each page
    wget -Ei ../sourceURLs.txt
  5. The current folder now contains one html file per validated file. Open them in your browser to check the results.
Posted by creacog in Mac OS, XHTML/CSS, 2 comments
24
Jul
2006

reading list

Commenced creation of my reading list of books and online references I have found useful. Initially concentrating on the Flash and ActionScript books I used to get involved in this technology.

Posted by creacog in ActionScript, Flash Platform, User Groups, 0 comments
08
Jul
2006

mac flash switch

I recently had the need to be able to switch player versions on the mac, and was very grateful to have found Mike Chambers‘ “Flash Player Switching on Mac” entry. Following the instructions in that entry may well be all you need. Be sure to read comments IV and V – they are important!

In my own set up I made a couple minor alterations to ease things in my own mind (to be read in conjunction with Mike’s article)…

  1. With respect to setting up the ‘soft-link’ or alias to “Internet Plug-Ins” I find an alias name of “InternetPlug-Ins” less likely to cause confusion than the more generic “plugins”. (Norton utils for example creates a “Plug-ins” folder within /Library)
  2. Similarly to avoid any confusion within the InternetPlug-Ins folder which in my case contains loads of files, I created a sub-folder “flashplayers” into which I placed the version folders.

So my resulting folder/file structure is as follows…

/Library/InternetPlug-Ins/
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/7
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/8
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt
/Library/InternetPlug-Ins/flashplayers/9
  Flash Player Enabler.plugin
  Flash Player.plugin
  flashplayer.xpt

The idea being that the three files currently in /Library/InternetPlug-Ins represent the currently active version of the player.

As my folder structure is different to that of Mike’s, my script is slightly modified…

#!/bin/bash
#
# Script to change the flash player
#
if [ $# != 1 ]; then
  echo "Usage: $0 name-of-player-version-dir"
  exit
else
  plugin_dir='/Library/InternetPlug-Ins'
  np_dir="$plugin_dir/flashplayers/$1"
  if [ ! -d $np_dir ]; then
    echo "$np_dir does not exist."
    exit
  fi
  cp -rv $np_dir/* $plugin_dir/
fi

Finally if you are not familiar with writing and running scripts via the terminal, two things to bear in mind…

  1. Placing your script file in a folder picked up by the path, will ensure it is available to you whatever is your current working directory. In my case I use the default tcsh shell and cfp is placed in my /Users/username/bin directory. This is added to the path in my via my .tcshrc file with the line 
    setenv PATH "$PATH":bin
  2. Make sure you set the executable flag on the script file: 
    chmod +x cfp
Posted by creacog in Flash Platform, Mac OS, 2 comments
08
Jul
2006

round the corner

After years of dreading having to implement in xhtml/css, a designer’s efforts laced with rounded corners, I recently went and proposed a design of my own requiring them. (Doh!)

Over the last few years a number of tried tested techniques have been established…

I’ve never really been a fan of bitmap corners typically using variants of the long-standing “sliding doors” technique. However if there is a 3d aspect to the design this would probably be the best way.

In my case I just wanted a neat rounded corner between a foreground and background. I found that Nifty Corner Cube was just the job! Released March 2006 under GNU GPL License, the third evolution of Nifty Corners, these are really easy to implement in JavaScript and degrade gracefully. We are not limited two colours as a ‘transparent’ mode allows background gradients through. My only (limited) disappointment was the loss of the rounded border of previous version. However my final design can and will live without borders.

Posted by creacog in Javascript, XHTML/CSS, 0 comments
06
Jul
2006

embedding flash in html page – best practice? (SWFObject)

For a long time I simply used the html published from the Flash IDE to embed a SWF. Expecting that to be the ‘best practice’ approach. Like others I was concerned at the impact of Microsoft’s upcoming changes to IE in response to EOLAS patent issues. I was dreading either having to write my own JavaSript or research countless approaches.

With SWFObject the problem is solved. It has been around for a long time (formerly known as FlashObject) and appears to be well tried and tested. I was really pleased with how simple it is to use, how it degrades gracefully. I’ve used this on a number of projects and now consider it to be best practice. In future I’d need a very good reason not to use it.

Update (14/03/2008): SWFObject 2 released

Posted by creacog in Flash Platform, Javascript, XHTML/CSS, 2 comments
05
Jul
2006

make my h1 look nice

I’ve recently been distracted from my flash ambitions back to the world xhtm/css design. One of the issue with the organisation concerned is that in print media they use what I think is a really nice font: ITC Century Light. Ideally this is what should be used for all h1 headers through this site. Obviously not many users are likely to have this font installed. The substitute font is Times New Roman which is not nearly as neat, or distinctive.

In the bad-old days we would have created GIFs for each heading and used them instead. The height of bad-practice in this new world of standards compliance and accessibility.

Prior to doing any research, I had expected use of Flash would fall foul of similar problems. Then I found sIFR. A combination of JavaScript, CSS and Flash, which at run-time replaces designated tags with a SWF containing the text rendered in your font of choice to the same dimensions. What’s better it ticks most of the accessibility boxes. I’m really pleased with how easy this was to set up, and how it gracefully degrades.

Ok I came to this late. But the current version (2.02 at time of writing) has been recently updated with bug fixes and changes relating to ELOAS. And there is a version 3 in development.

This is a good piece of work by the developers, who are looking for funding. Certainly if my client goes with this recommendation, I’ll be sending a donation.

Posted by creacog in Accessibility, Flash Platform, Javascript, XHTML/CSS, 0 comments
22
Jun
2006

attending user groups

Over the past few months I’ve been heading along to meetings of the London MultiMedia User Group. Working usually alone, or at least the lone technical ‘expert’ on most of my projects, it has been really good to see and hear what other similar types are up-to. Great for self-assessing my own approach against contemporaries.

With London MMUG in recess until September 2006 Tink has established the London Flash Platform User Group, the first meeting of which was this evening. Two impressive speakers: Stefan Richter and Stuart Eccles.

One of the things Stefan sparked an idea as to why I’ve been struggling to get one of the simplest Flash Media Server tasks to work – including one of the tutorials from Adobe. More on this soon.

Having never even looked at Ruby on the Rails, Stuart’s presentation was extremely interesting and illuminating. I’ll defiantly be looking into using RoR on future projects. That seemed to be the consensus of the audience too.

I am sorry I had to leave a little early. Thanks to Tink and both speakers for putting in the time to make this happen

Posted by creacog in Flash Platform, User Groups, 0 comments
13
Jun
2006

About time

It’s about time! My first blog.

Expect to find here occasional postings prompted by problems and hopefully solutions in my work with the flash platform and ActionScript in particular.

ActionScript 2 and Flash 8 are my starting spec as far as contributions to this blog are concerned. Looking forward to involvement in Flex 2, ActionScript 3, Flash Media Server and beyond. Also taking a keen interest in OpenSource developments around Flash.

My corporate site (creative-cognition ltd) currently shows minimal flash and demonstrates my background in server-side coding, XHTML, CSS standards compliance and accessibility. Looking forward to being able to add more Rich Media projects without losing touch with accessibility issues.

Posted by creacog in Personal, 0 comments