INTERACTIVE DESIGN / EXERCISE 02

CHIAH CAI JUN 0365352

Bachelor of Interactive Spatial Design / Taylor's University

Interactive Design / Sept 2025

Week 03 - Week 04

---------------------------------------------------------------------------------------------------------------------------

EXERCISE 02: HTML EXERCISE (SIMPLE PERSONAL PROFILE PAGE)

Instructions
In this exercise, we are required to create a single HTML file that serves as a basic "About Me" or personal profile page. This exercise is designed to test our understanding of core HTML document structure and fundamental elements. Our index.html file must include the following elements:
  • Basic Document Structure: Correctly use the <!DOCTYPE html>, <html>, <head>, and <body> tags.
  • Page Title: Add a descriptive title inside the <head> using the <title> tag (e.g., "My Awesome Profile").
  • Main Heading: Use an <h1> tag for your name or the page's main topic.
  • Sub-Heading: Use an <h2> tag to create a section heading (e.g., "My Hobbies" or "Favourites").
  • Paragraph Text: Write at least two descriptive paragraphs using the <p> tag.
  • Ordered List: Create a numbered list (using <ol> and <li>) with at least three items (e.g., your top 3 favourite books, movies, or foods).
  • Unordered List: Create a bulleted list (using <ul> and <li>) with at least three items (e.g., your skills, goals, or contact methods)

Exploration Stage
When Mr Shamsul introduced us to this exercise brief, I began planning the sections and topics that relate to my background. As sir mentioned, he hopes that we can create this profile with creativity. I decided to add cute emojis to my content to make it more visually engaging, as the emojis also represented part of the details that I wanted to convey.

Besides, I think that explaining the reasons why I chose to study Interactive Spatial Design at Taylor's University was quite important when it came to mind. There are some fun facts and stories behind this decision, which have become the starting point of my design journey!

Here is the details summary that I have included in my personal profile page:
  • Title: Cai Jun's Profile (My First Webpage)
  • Heading 1: Welcome To Cai Jun's Page
  • Heading 2: A topic title that briefly introduces my profile
    • Paragraph: Some basic information about me
  • Heading 2: Fun facts of choosing BISD
    • Paragraph: Explaining how the fun facts inspired me
  • Heading 2: About TDS
    • Paragraph: My personal thoughts on TDS
  • Heading 2: The modules I enrolled on this semester
    • Unordered list: Bullet points stating the five modules I will study this semester
  • Horizontal line: Separate between two sections
  • Heading 1: About Me
  • Heading 2: My Favourites
    • Ordered List 1: Food
      • Ordered List 1.1: Favourite Food Ranking
    • Ordered List 2: Movies
      • Ordered List 2.1: Favourite Movie Ranking
    • Ordered List 3: Person
      • Ordered List 3.1: Favourite Person Ranking
    • Ordered List 4: Hobbies
      • Ordered List 4.1: Favourite Hobby Ranking
  • Heading 2: My Personal Development
    • Unordered List 1: Hard Skills
      • Unordered List 1.1: Three of my Hard Skills
    • Unordered List 2: Soft Skills
      • Unordered List 2.1: Three of my Soft Skills
    • Unordered List 3: Goals
      • Unordered List 3.1: Three of my goals to be done in Uni
My HTML Profile Link
https://id-exercise02-chiahcaijun-0365352.netlify.app/

Comments