Website PPRD

I found Dreamweaver extremely difficult to learn as it was different to any other program I had used before.  The site I had designed only needed Dreamweaver in order to make it so I did not need to use Flash or Lightbox which kept things much more simple for me.  I used Photoshop initially, making use of the slice tool to keep proportions exact.

Researching into many different artists' websites and looking into what makes good web design allowed me to realise what worked well and what did not in terms of website design.

I was aware that the navigation needed to be very simple and easy to use as it could be extremely frustrating having to go through several levels to view what you wanted or to be unable to find a certain page. I overcame this problem by having my menu clearly on the left of my site.

As well as a contact page I put my e-mail address in the top right hand corner to make it easily accessible.

With the Illustration page, and Photography I had too may images to fit comfortably on one page so I made two pages and split the thumbnails between them.  This way the page does not look too cluttered.

I took a while to decide what to use as my website header as I wanted to create a brand that represented myself.  I used an image of flowers partially obscuring my name; this works well with the images on my site as they are in a similar ink and line drawn style.  The splash of yellow ink adds some colour to the otherwise grey, black and white site.  This was a conscious decision as I wanted to keep my site simple with very little colour in order to make my images stand out.

I faced problems when I had not used my CSS page effectively, so many images were duplicated on each page and my buttons often jumped around out of place.  Fortunately I became aware of this very early on so it was not a big issue to make these changes and definitely benefited the consistency of my site.

Once I had finished with the designs and using the 'Swap Image' function in Behaviours to display my images I was able to adjust certain features which could be better.  I began by changing the size of my buttons as they were slightly too big, I did not change the size drastically as I did not want too much open space but I am much happier with their size now.  I also changed my 'Contact' page, adding in a contact form which looks much more professional and is far more convenient for anyone visiting the page.  I attempted re-designing the Facebook and Twitter buttons, however their design and colour actually seemed to fit better with my page rather than making them unnecessarily different.

I am really pleased with my page and when I compare it to my initial designs it is exactly how I had planned, apart from a few changes which it became apparent needed to be made.  I also feel much more confident on Dreamweaver and would not be afraid to use it again in the future.

Website Finishing Touches

I've added a favicon to my website, so that a small flower shows when it is saved in favourites and along the web address bar.

I have also adjusted the size of the text on the navigational buttons on the site as they were too large.  They seemed like they worked on a larger screen resolution, but after looking at my site on a laptop I realsied they were slightly too big.

I have changed my contact page, so that it now has a contact form.  This protects me from receiving spam and makes it much easier for someone visiting the site to comment instantly.

I have also re-designed the 'About' page as it looked slightly out of place before.  I have got rid of the grey background and reduced the size of the text.

Website Testing

I have now had to test my website on a combination of different browsers and machines to make sure that is appears as it is meant to.  The variants that I have had to check are that the colours are correct, that all the links work, external and internal and also that the size is easily viewable.  I tested my website on different browsers using Browser Lab and did not have any issues.

However, I decided to check my website worked on different machines; it worked well on a Mac and a PC, however on a laptop and smaller screen sizes the website appeared slightly too large meaning that the user had to scroll down to view all the menu options.

I overcame these issues by moving the menu buttons closer together whilst making the text slightly smaller.  This works much better and looks much neater on a both a smaller and larger resolution.

Another issue that was brought up in the critique was that the email button located on the header was slightly to large so could be accidentally clicked on.  This was because I had made too larger slice when I moved the image from Photoshop.  I changed this by making the slice smaller and works much more efficiently now.

www.erinbuckley.co.uk

New website portfolio here.

Website Designs

I've experimented with several different website headers.  I want it to be instantly interesting and represent me and my work as this is the first thing that anyone visiting the website will see.

I have decided to use a more illustrative header sampling some of the flowers I have used elsewhere in my images.

I want to keep the website very simple and easy to navigate.  I've looked at a variety of different portfolio websites and the ones I feel work best and show the artist's work in the best light are those that are clear and simple, quick to load and do not have too much information on one page.

I have divided my work into four categories, Illustration, Photography, Design and Typography.  This splits my work into four easy groups and distributes the work evenly.  There is less work in the Design page however, hopefully I will have enough to update this soon.  I will keep no more than 14 thumbnails to a page so that the user is not overwhelmed with information. 

I will stick to a black, white and grey colour scheme, only using black to highlight which page the user is on with small splashes of yellow on the header.  This colour scheme keeps the viewer's attention on my work rather than anything else.