INTERACTIVE DESIGN - Final Project
INTERACTIVE DESIGN - Final Project
22.10.2023 - 28.11.2023 / Week 8 - Week 14
Xing Yu / 0361463 / BA of Design (HONS) in Creative Media
Video and Sound Production
Final Project
INSTRCTION
Final Project - Creating a Single-Page Website for An Artist
In this web design project, we will focus on our favorite artists. The program is designed to develop our web design and development skills while demonstrating our passion for our chosen artists.
Project requirements:
Pick your favorite artist for the theme of your website, be it a musician, painter, actor, or any other creative individual or group. Make sure you have a genuine interest in the artist you choose, as this will help you create a more engaging website.
Content:
Your one-page website should include the following sections:
Title: Contains the artist's name and a short tagline.
Synopsis: An overview of the artist's background and why you admire them.
Gallery: Showcasing the artist's work.
Biography: Includes a brief biography or description of the artist's life, as well as his artistic career.
Contact information: If applicable, provide contact details or a link to the artist's social media profile.
1. Reference materials
Visual reference
Visual reference
HTML Structure: I started to create the basic structure of HTML documents, including < ! doctype html> Statement, < html> Root element, < head> Head and < body> Main body.
Character encoding and Title: In the header, I set the document's character encoding to UTF-8, ensuring support for multilingual characters. Then set the title of the page to "Jay Chou".
Style sheet: Using < in the header; style> Tags are embedded in an internal style sheet. I defined several classes, such as. box1, main2, and so on, to control the style of the individual sections.
Text and images: I added text content to each section, used title tags like <h1>, <h3>, <h4>, and the <image> tag inserted two images called "2.png" and "3.jpg".
Color and background: To add visual appeal to the page, I used background colors in some sections by setting the background property to a specific color value.
Social media links: In the last section, main7, I added information about Jay's social media, including Instagram and Twitter accounts.
Finished: Finally, I finished the HTML structure at the end of the document. The whole process involves the use of HTML tags, the definition of CSS styles, and the layout and arrangement of different elements.
Reflection
This project has made me more confident in using HTML and CSS to create simple but attractive web pages. Through continuous practice and learning, I believe I will be able to continuously improve my web design skills.
评论
发表评论