To create the website, I designed the website on Photoshop with all its different interactive components and then sliced all the different parts that would be interactive which would then be put onto dreamweaver when saved as a HTML File.
I created a hyperlink by creating a map around the area I would want to make the hyperlink on which I then copied and pasted my Instagram link at the bottom left to the mapping area. In addition, by choosing the Target “_black”, the hyperlink would open up on a new tab which would be more convenient for the user as they wouldn’t have to constantly go back.
I linked buttons to different pages by selecting the button and clicking on the “target” sign on the bottom left and dragging it onto the “About Me” page as shown on the right of the screenshot.
An rollover was created by selecting the button and editing it individually with Photoshop. The edited image was then saved into the same folder which could then be inserted into the roll over section when the original button was deleted off the website. The screenshot above shows the final step of how the rollover was inserted into the website.
This is another example of a rollover image where the second image was edited so that the outer line turned from white to black with the image inside lowering in opacity.
I inserted a Youtube video onto my website by getting the embedded code from Youtube but edit it so that the length and width was edited to fit into the section that I made for each Youtube video.
I created the Audio Page in a similar way by getting the actual size of the audio section and getting embedded code from SoundCloud and editing it so the width and height matched the area which I created inside my website.
I created the two HTML bullet points by inserting a table below the website, as shown above and adding in the text that links to the image.