Evaluation

EVALUATION

This module was a continuation from an earlier module in which I had to create a three page website using 'photoshop'.

During this project, I have been instructed to create a four page website in 'Dreamweaver' which will be using the same website which I had created earlier, but in this instance, the new one had to be fully working. This meant that the viewers could view the website by using their Internet browser and navigating around the website by clicking onto the buttons. Initially, my first task was to go onto 'photoshop' and create a fourth page as I only had the three from the previous module.

Then I watched a video about 'google' and it's creation. It showed how they made money from it and basically, all the information behind what is involved in running a website. For me, this was very interesting and instructed me on how to maintain a website and how to make it profitable. This was then followed by a group discussion which gave me an insight on how advertising could work on my website.

Then, I created a blogger account which contained all my work throughout the whole unit. Then I was instructed to research other website on their overall appearance, layout, colour, etc! Which was also included onto the blogger account. Throughout all the lessons, I screenshot all the processes of transforming the website from Photoshop into Dreamweaver and all the difficulties I had encountered along the way.

In conclusion, I have really enjoyed this module as it has given me a comprehensive knowledge about website creation and maintenance. I have come to realise that my personal enjoyment lies within website creation and this is certainly an area that I would like to explore further.

My Website Part 2

My Website Part 2

On the website, I had to position both the jump-menu and the buttons out of place so when they were exported as a html, they would all line up and slot back into place.

Inside the jump-menu, I chose to name a title 'choose song---'. This will not be a sound or will not go to any further link but, will allow the user to then be able to click onto the other sounds in the list which all would then be a song. (the first is a blank option)

Inside the jump-menu, I chose to name a title 'song 1', but this time, I browsed and found a mp3 sound, which using the jump-menu, will allow the viewer to click onto the song of his/her choice, and it would then subsequently play the song in the window.

This is my final design for the jump-menu.

When the user has selected the song, it will open up in the window and be displayed as this above image.

I had to split up the buttons as a weird glitch kept on occurring. This was the link from the first button (home) would always be the same for the button next to it even when I changed the link and saved it, it would still revert back. So I had to put the home button on it's own layer, and the remaining three buttons, were placed on another layer.

I am now creating the 'search bar' which will be located on three out of the four pages.

I clicked onto the 'forms' tab' and then opened up the 'text field'.

This the the final appearance of the 'search bar'.

My Website Part 1

My Website Part 1

In 'Image-Ready' I opened up the 'pdf' file and selected the slice tool from the left hand side tool bar. This enabled me to slice numerous segments from my website, in fact, I made 13 seperate slices. Once completed, I clicked on 'file—save optimised as' which brought me to a saving screen option. I changed the file format to 'html with images' then saved the work. I used 'image ready' as it enabled me to quickly crop the whole website in one single movement instead of cropping and slicing each individual segment. This saved me a lot of time and then made me progress with the unit quicker.

I opened the html file in 'Dreamweaver' which was created using Image-Ready. It is apparent that all the slices automatically slot back into place without me having to create a layout in which they would have been placed. As a result, I did not have to fiddle trying to place them all up.

I created a new layer on top of my original website, which allowed me to place images and icons on top of my initial website design without it interfering with what was underneath. On this new layer, I clicked the sub-section, marked 'forms', and I found the button marked 'jump menu' and this enabled me to create a drop-down menu for this website. Using this jump-menu values, I could set it to an audio file so this could act as my media player on the website.

This is my 'jump-menu' with the values displayed.

I then highlighted the whole website and, using the properties, I positioned the website in the centre.

This is my website final position.

On the top tool bar, I clicked on 'modify' and it allowed me to open up the page properties (ctrl j). I then changed the title from untitled website to “RealBase.com”, which shows the viewer the name's logo on the top of the website's bar.

Additionally, I browse through the background images on this window and I found an appropriate 10 x 10 pixel block of colour which matched the colours already used in my website. Finally, all this was confirmed by clicking OK.

MySpace

Myspace Good And Bad

Initially, I found the colours very lucid and distracting. There is an old saying, blue and green should never be seen, and in this case, I have to agree. The repetitive imagery is annoying and makes it look tacky because instead of using the power of a single image, by using a multiplication of it, it lessens the impact. Additionally, the contrast between the text, both black and green, is also hard upon the eyes, and the script font is sometimes hard to read.

At first impressions, this website does not look too bad. The background image is pleasant but I found the colours used are very sicky. The positioning of the text boxes are well placed and easy to see and access due to their font colour and style. Overall, the whole website looks more classy which has been partly as a result of them simplifying the images used.

Again, I am initially distracted with the onslaught of visual imagery with this website's use of multiple and repetitive pictures. These clearly distract the viewer's vision from the displayed information contained within it's pages. The only positive I can see from this website, is that they used a clear and easy to read font.

This website appears simplistic in creation, but in reality, the images are quite complex but very pleasing to the eye. They have used a simple colour scheme, that being monotone (black, white and greys) which does not distract the viewer away from the information. Also the colours are visually strong which allows the images to speak for themselves. They have also used the vividness of a white font which makes it stand out and is easy to see.

This is a cool 60's retro inspired myspace which uses 'vector images' and geometric designs. Initially, these are quite dark in colour, however, due to the background being just a pure block of colour, this does not give the impression of darkness or gloom. In fact, the whole page is quite vivid and bright. In contrast to the other sites, this displays it's information in separately coloured boxes that lie in front of the background design. The orange font which I would have thought would be hard to read, is cleverly implimented as I can see it and read it easily.

After Easter Lesson

After Easter Lesson

In the previous lesson i mounted my website which i created for the Site In Space unit for Kamal, so i then opened Photoshop and cropped pieces out of the website so it will fit together in Dreamweaver like a jig saw puzzle then when i went to save the pieces i used the Save For Web feature within Photoshop to resized my file type by changing the settings of the images.

Dreamweaver 2

Part 2 Of Dreamweaver


With a new document i clicked on the layout tab and then changed the mode from standard to layout if i do this i can use a new type of tables.


Then when i clicked on tables i get 2 new icons i clicked on the create table and it turns out alot different from the standard version. Clicking on the 2nd icon i can create tables in to other tables.

Dreamweaver

Dreamweaver

We learnt on how to create a web page with several links. We created a main page which we called Index then we also created a second page and then used the frames to put in the text to link the index to page 2 and vise versa.

To get to the frames option i clicked Window -- Others -- Frames


I clicked on the table tab then created a new table with the properties of 3 x 3. at the bottom of the document there is a button so i clicked that so i could edit the table. Then using the insert menu i pressed the merge button which will merge all 3 cells into 1.