ICT Blogs

Unit 9: Project Planning

Previously, I contacted my client about the new designs for the new pages: "Profiles", "Discograhy & Multimedia" and "Fan-mail"; my client said she likes the designs and that it is fine for me to create the web pages according to the design. The creating of new web pages will be done once the "Background Information" page has been complete.

Unit 14: Developing and creating websites

Today I will start to create the background information page, where according to the Gantt Chart I am on track with my schedule.

I inserted the template of the web page; where I had to insert all of the navigation buttons via using the "Insert Rollover Image" option. I didn't follow any tutorials to create these rollover buttons; as I found this option whilst I was experimenting the program before I started to create the website. The rollover buttons were the navigation buttons that I created in Adobe Photoshop CS2 whilst I was creating all my graphics.

When using the "Rollover Image" option, I had to select the first set of the button (Original image) and then I had to select the second set of the button (Rollover image); the original image was the buttons that had the grey font colour and the rollover image was the button that had the blue font colour. I had to do this for all of the buttons where they were to be inserted into the first editable region of the template; however I had to make sure the "Background Information" button had the navigation button that did not change colour, and just stayed with the blue font colour as this is part of the design; therefore when I had to do the rollover image option, the original image and the rollover image was the same as each other.

According to the design of the "Background Information" page, there will be a scrollbar textbox featured on this page, therefore I researched into the type of html I will need to insert into the code window of Macromedia Dreamweaver. I found a website: http://www.wowwebdesigns.com/wowbb/forum1/350.html ; where they provide the codes I need to insert into the code window in order for my scrollbar textbox to be displayed on the web page.

The codes I have inserted are: (1st code: is for the div in the body, 2nd code: is for the css in the head)

In order to change the font and font size in the div box on the background information page, I had to use the html codes for font face and font size. I found that there was a problem in the div box, this was that when I typed the information I wanted into the div box code and wanted create a new paragraph, they wouldn't allow me to just press the enter button to create space, but I had to use the code "p" code.

In the print screen below, it shows the information I have typed into the div box and also the codes needed for the div box to work as well as the fonts I have chosen. The blue text in the codes window shows the codes I have used, these include the font size, font face and paragraph codes.

I had to insert the image that my client wanted to be placed in the "Background Information" page, which was the black and white image of Dong Bang Shin Ki; this was just by inserting the image from the library of the website.

I have finished creating the background information page, where I have also given it a title in Macromedia Dreamweaver when the page opens. For example, when the user clicks onto the background information button on the home page, the title of the page which will load is "Dong Bang Shin Ki Online: Background Information". There isn't any music at present on the page, as I will be creating the music options at the end once all the pages have been created.

posted by Selina @ Wednesday, March 07, 2007