Bài tập Thiết kế Web

PHẦN 1: BÀI TẬP MỞ ĐẦU

Bài tập 1: Tạo trang giới thiệu cá nhân. Phiếu hướng dẫn

Yêu cầu:

  1. Tạo một trang HTML với nội dung giới thiệu bản thân.
  2. Trang phải có:
    • Tiêu đề (sử dụng thẻ <h1>).
    • Đoạn văn ngắn giới thiệu (sử dụng thẻ <p>).
    • Một danh sách không thứ tự (unordered list) về sở thích cá nhân (sử dụng <ul><li>).
    • Một danh sách có thứ tự (ordered list) về các công việc hàng ngày của bạn (sử dụng <ol><li>).
    • Thêm một hình ảnh minh họa (sử dụng thẻ <img>).
  3. Trang cần có một đường dẫn liên kết đến một website yêu thích của bạn (sử dụng thẻ <a>).

Bài tập 2: Thiết kế menu nhà hàng đơn giản. Phiếu hướng dẫn

Yêu cầu:

  1. Tạo một trang HTML để giới thiệu menu của một nhà hàng.
  2. Trang phải có:
    • Tiêu đề trang là “Menu Nhà Hàng” (sử dụng thẻ <title>).
    • Một tiêu đề lớn giới thiệu tên nhà hàng (sử dụng <h1>).
    • Một đoạn văn mô tả ngắn về nhà hàng (sử dụng <p>).
    • Một danh sách các món ăn trong menu (sử dụng <ul><li>).
    • Định nghĩa một danh sách từ vựng (definition list) để giải thích nghĩa của một số thuật ngữ đặc biệt trong thực đơn (sử dụng <dl>, <dt>, <dd>).

Bài tập 3: Tạo đoạn văn bản định dạng cơ bản. Phiếu hướng dẫn

Yêu cầu:

  1. Tạo một file HTML với nội dung là một đoạn văn bản.
  2. Sử dụng các thẻ HTML để định dạng đoạn văn bản:
    • Thẻ <b> hoặc <strong> để làm chữ đậm.
    • Thẻ <i> hoặc <em> để làm chữ nghiêng.
    • Thẻ <u> để gạch dưới văn bản.
    • Sử dụng <small> để làm chữ nhỏ.
    • Sử dụng <mark> để làm nổi bật một phần văn bản.

Bài tập 4: Tạo danh sách định dạng. Phiếu hướng dẫn

Yêu cầu:

  1. Tạo một danh sách không thứ tự sử dụng <ul>:
    • Các mục danh sách cần có ít nhất một từ làm đậm và một từ làm nghiêng.
  2. Tạo một danh sách có thứ tự sử dụng <ol>:

Bài tập 5: Thiết kế đoạn văn bản phức tạp. Phiếu hướng dẫn

Yêu cầu:

  1. Tạo một đoạn văn bản dài gồm 3 đoạn nhỏ.
  2. Áp dụng các thẻ định dạng sau cho từng đoạn:
    • Đoạn 1: Sử dụng <b>, <i>, <u>, <mark>.
    • Đoạn 2: Sử dụng <sup>, <sub>, <small>, <del>, <ins>.
    • Đoạn 3: Sử dụng kết hợp các thẻ để tạo định dạng phù hợp.

Bài tập 6: Thiết kế TRANG WEB giới thiệu về cửa hàng Máy tính.

  • Giới thiệu về cửa hàng
  • Danh sách các mặt hàng
  • Giá các mặt hàng

 

KIỂM TRA HỆ SỐ 2_4

Thời gian 120 phút

  1. Hãy cài đặt phần mềm quay màn hình. Sau đó khởi động phần mềm đó, quay lại các thao tác các câu sau đây.
  2. Tạo trang web theo chủ đề đã đăng ký
  3. Sau khi làm xong, nộp 2 file lên DriveGoogle cá nhân:Video và html.
  4. Vấn đáp : Mỗi bài được vấn đáp 3 câu, nội dung là giải thích câu lệnh có trong bài, nếu không hoàn thiện câu vấn đáp, bài sẽ không đạt yêu cầu.
  5. Hãy giải thích các lệnh có trong bài làm. Lệnh nào trùng sẽ không được lặp lại.

Yêu cầu chung

  1. Có tối thiểu 4 trang, bao gồm 1 trang index (trang chủ).
  2. Trang chủ phải có menu điều hướng cho các trang khác.
  3. Trong từng trang phải định dạng 
  • Giao diện thân thiện: Bố cục rõ ràng, màu sắc hài hòa, dễ sử dụng và phù hợp với thương hiệu.

  • Font chữ chuẩn: Sử dụng font Unicode như Arial, Verdana, Tahoma để đảm bảo hiển thị đúng trên mọi máy

  • Nội dung rõ ràng, hấp dẫn: Cung cấp thông tin hữu ích, dễ hiểu, phù hợp với đối tượng mục tiêu.

  • Tính năng phù hợp: Ví dụ như giỏ hàng, thanh toán online, form liên hệ, quản lý đơn hàng… tùy theo mục tiêu website. 

Thêm một đoạn văn bản ở đây. Nhấp vào ô văn bản để tùy chỉnh nội dung, phong cách phông chữ và màu sắc của đoạn văn của bạn.