Rationale.....

At the beginning, when i was trying to come up with an idea for my web page, I wanted to incorporate some of the tools that I use when designing. I was sat at my desk and right beside me was a cutting mat along with a scalpel and pen, I thought this would be a relatively good idea as the mat already had perfect squares on, which I then planned to place the links + portfolio pictures on the page. On the contact page/about page I removed a few lines off the cutting mat to allow the text to be read more easily, although I feel the text becomes a little unclear as the colour of the font is abit to light, but it was meant to follow the theme of the cutting mat. The text is read pretty clearly in Illustrator but when it is imported into Fireworks it's reduced down to 72resolution. I've placed roll overs on the portfolio pages to allow my work to be view better. I found this part quite time consuming as I had to firstly re-size all my images, then copy and paste the background of the mat where the picture was going to be place, into Photoshop, then save each photo seperatly on top of the image and upload it in to Dreamweaver. I also had one other problem where one image wouldn't load up, which was later found to be the name in which it had been saved as, just the puntuation error, apparently it messes with codes. I feel that I now know the basics of Dreamweaver and Fireworks and if I was to re-make my web site I would like to have a go at using a little animation or roll overs on the text. I would aslo like to use the lightbox on the portfolio pages, I feel this would make it look a neater way to view the images. I would change my design to a simplier form, white background and thin black lines to underline and seperate the links from the images, this will make the site easy to use and navagate as i found the simplier sites have been the most effective.

Image Erorr

All but one image has been able to use the scroll over behavior, and after a long time playing around with the program tring to find out why this ONE image won't link up and swap with the middle image, it turns out it was the name that i'd saved it as that was the problem...just a simple (') apparently it messes with the code...so the moral is DON'T USE SPACES OR PUNCTUATION WHEN SAVING!!.  

Adjustments

Started again with the Contact and About page, realized they hadn't the wooden background on, while i was doing this i thought i'd may as well start right back at the beginning, so i imported them back into Photoshop and deleted the lines so the text was viewable a lot better and made a few other adjustment as shown above.... 

Example

This is what happened when i added a div or wrote on top of the image - it was really annoying how it just wouldn't line up! - probably a good thing though as now i've managed to change the text colour to fit in with the cutting matt!

Writing problem with About and Contact page....

With me have the cutting mat image in the background of each webpage, i had a slight problem writing the text on the Contact and the About page. Firstly I tried using Div layers which caused the text to go off line and double space. I then tried to copy the sliced image, delete and paste into the background, this just like the Div, didn't work right and seemed to have a mind of its own as it wouldn't stay on the correct line and no matter how hard i tried it just wouldn't line up with the text to the side........So back to Fireworks i went.

Now in Fireworks i realized i had lorem ipsen text fixed to the image!! so i uploaded the file back in to Illustrator, canceled the text and replaced with the contact details and also the about me information, i also changed the colour to the light blue to fit in with the cutting mat theme! Then from there it was simple, I imported back into Fireworks, sliced the page up and exported it into Dreamweaver again and PROBLEM SOLVED!!.

Working Process -

Toolshed -The easy way to get things sorted!

This was a project for Mike in the first, we had to come up with our own company, and then create the corporate identity, interior for the store etc.... I created a hardware store, selling anything from tools-garden sheds, These are two examples of the promotional ads that I designed.