Portfolio

I will be creating a portfolio on Dreamweaver to be able to sell myself as a designer. To do this i will use all the skills that i have learned through out my coarse. I will be putting up all the work i have done on this portfolio and i will be linking up social media links to it so people will be able to get to know who i am as a person not just a designer.

The programmes i will be using to create my website are Dreamweaver, Illustrator and Photoshop. First thing i need to do is add a table into Dreamweaver. This would then allow me to place images inside it to have a steady structure to my site. The width of my table would be 960 pixels as thats the width that i would like my website to be in a browser. The next step of creating my portfolio was applying the background which i made in photo shop.

Once i had my background it it gave me the chance to create the images to fit in the table on my site. To do shit i was taking screen shots of the size of the boxes in the tables. this then allowed me to get the perfect size for my images. The main images i was going to put on my portfolio are 4 links to social media websites, the logo that i have created for myself as a designer and a banner at the top of my portfolio. I created/ edited these images in photoshop by using various tools.

Once i had the graphics that i needed for my site i then put them all in the correct spots in the table. Some of the images (the social media link) were roll over images. This mean i had to have two images for the links. One for the original image, and a second for the roll over image. Creating the images took a little bit of time but wasn't to time consuming.

As you can see in the screen shot below i have started placing the images into my table on dreamweaver by going to insert, then image. The image in the centre of the screen is a PNG which means it has a transparent background.

Once i had created all my images all that was left to do was place them in my table on my site, and link my roll over images to my social networking web sites. By adding roll overs it makes my website more user friendly. Here is an example of one of my roll over images for my Facebook social network link.

The links that i have put on my website don't link strait to the social networking sites. It opens a new link to a new browser window. This means that you won't have to go back and forth on webpages since you can just look through then close the new window and carry on looking at my portfolio. To make the links link to a separate browser you have to click on the images that you want to add the link to then add a new behaviour. The behaviour i need to add was "Open Browser Window". Once i click on that another window popped up as you can see in the screen shot below. This window allowed me to put the webpage i wanted to link to form the button, The width of the new browser it would open and the height of the new browser.

After getting all of my images into my site I then added information about me and what I do as a designer. I also added my twitter feed in my portfolio so that people would be able to see what I've been up to, If I've posted anything new such as images of new work etc. To add my twitter feed i used the website http://twitter.com/about/resources/widgets which allows you to put your twitter feed on a widget and then change the size and colour scheme to match your website. Below is a screen shot of me creating my widget. As you can see there are a lot of options to change the colours of my widget to which ever colour i wanted it to be.

Once i had all my images onto my site it was almost finished. I just had to finish the links and insert some content into the centre of my table. To do this I created an editable region which means I can edit the text in the area which has a editable region. This is what my website looks like now that i have finished the design work for it.