- It Knowledge
- This website as an example
- Firefox Friendly
- Image creation and manipulation
- Flash - my splash page
<it knowledge>
- Professional knowledge and skills required to work in an Internet technology-enabled environment
- Knowledge of Internet technologies such as Web browsers, FTP, email, Web page authoring using HTML & basic infrastructure networking
- Demonstrates a sound knowledge of Information Technology
- Understands the fundamentals of programming, database and network operating systems
- Understands the history and components of the internet and the World Wide Web
Operating Systems: Windows 95/98, Windows 2000, Windows XP, Apple Macintosh
Languages: HTML, XHTML, XML, CSS, JavaScript, DHTML
Software Packages: Microsoft Office, QuarkXPress, Multi-Ad Creator, Adobe Photoshop, Dreamweaver, Fireworks, Flash, FrontPage
<this website as an example>
This website serves as the best example of my IT Skills. This site was created using Dreamweaver and written in XHTML Transitional. The code is valid with the exception of the navigation bar found in the Internet Explorer version. The Javascript code for the Navigation bar came from a free online resource. I decided to keep this navigation bar in my website because I had converted the design to include a dot which serves as a hyperlink which changes colour to show visitors that they have viewed that particular page. It is a little touch which I was unable to include in the Firefox navigation bar (see Firefox Friendly).
If you take a look at the code for this web page (click here for instructions for how to view code) you will see it is clean and clear, organised and includes comments to divide each section of the page. You may also view the CSS (Cascading Style Script) file which defines the style of the text by clicking here portfolio_styles.css. You may also view the Javascript file which defines the navigation bar by clicking here menubar.js. I would like to make it clear that I did not write this complex piece of Javascript code myself but the other simple Javascript functions on this website are my own work. Examples include the Alert message above for instructions on how to view page source and the browser detection script on the home page which redirects Firefox and Opera users to the Firefox friendly version of the site.
<firefox friendly>
The Navigation bar I first created for my website did not work in Firefox or Netscape browsers so I needed to find an alternative. I wanted to create something which appeared and functioned as closely as possible to my original. Using Fireworks I was able to create a functional navigation bar which does exactly that. This has the added benefit of being valid XHTML which the original version was unable to be. The only drawback to the design is that all of the component images for the navigation bar had to be in the same folder as the web pages themselves so therefore I could not implement a folder structure which allows the URL to show a visitor's position within the website's hierarchy.
Please click here to visit the Firefox Friendly version of my Online Profile/Portfolio. This will work in Internet Explorer too although there are some small differences with the spacing and layout. However if you are using Firefox/Netscape/Opera or any browser other than Internet Explorer then you will be unable to view the original navigation bar used in the IE version.
<image creation and manipulation>
The photograph in the page header and the splash page was taken while I was on holiday in Wales in 2006. I used Fireworks to create the page header incorporating the same background style for the yellow text which can be seen in the navigation bar and secondary navigation panel as well. Instead of using a plain white background I created a subtle pale blue patterned image which has been tiled to fill the entire background of the page. Once again this was created using Fireworks.
<flash - my splash page>
Originally I had the six bullet points which comprise my strongest Skills and Qualities as the first thing a visitor would see on my home page. I felt this made the page too cluttered and did not fully make sense so I decided to create a Flash animation which could be displayed as an introduction splash page. The background image was photographed by myself while on holiday in Wales in 2006. Using Flash I created simple fade in text transitions. It may be a simple effect but I think it has an effective elegance which I really like.
To complete the design I created an audio track of a series of waves breaking on a beach. I found a short 8 second MP3 track on sounddogs.com which was ideal. I used Nero WAV Editor to construct a series of looping waves which were precisely timed to coincide with the text transitions. This kind of audio manipulation is something I have done previously for my X-Phil's orienteering adventure for the Boys Brigade. The finished audio track was saved in WAV format and inserted into the 32 second Flash animation.
You can take another look at the splash page by clicking here.