CHỦ ĐỀ 9. THIẾT KẾ WEBSITE BẰNG PHẦN MỀM

(Đề thi dạng: trắc nghiệm đúng/sai)

I. Chuẩn bị xây dựng trang web

1. Cấu trúc chung của một trang web

Một trang web hoàn chỉnh thường gồm 3 phần chính:

- Phần đầu trang (Header): Chứa logo, tên trang, thanh điều hướng (menu), tiêu đề, nút tìm kiếm.

+ Lưu ý: Favicon là biểu tượng nhỏ (favorite icon) đại diện cho website, hiển thị trên tab trình duyệt (trước địa chỉ web).

- Phần thân trang (Body): Chứa nội dung chính, được chia thành các khối (blocks) hình chữ nhật.

- Phần chân trang (Footer): Chứa thông tin bản quyền, liên hệ, liên kết mạng xã hội.

2. Quy trình chuẩn bị xây dựng trang web

Gồm 3 bước lớn theo trình tự sau:

- Định hình ý tưởng: Xác định mục đích, đối tượng người dùng, yêu cầu về nội dung và hình thức.

- Thiết kế: Xây dựng dàn ý, kiến trúc nội dung, bố cục, bảng màu, phông chữ.

+ Mỹ thuật: Phông chữ không chân (Sans Serif) thường dùng cho menu/nội dung để dễ đọc; phông có chân (Serif) dùng cho tiêu đề lớn. Bảng màu cần hài hòa, tương phản vừa phải.

- Lựa chọn phần mềm và chuẩn bị tư liệu: Chọn công cụ (dùng Google Sites), chuẩn bị logo, hình ảnh, bài viết.

II. Xây dựng phần đầu trang web

1. Làm quen với Google Sites

- Google Sites là ứng dụng miễn phí giúp tạo website trực quan, lưu trữ trên Google Drive.

- Truy cập: sites.google.com/new.

2. Các thành phần phần đầu trang (Header)

Trong giao diện thiết kế, phần đầu trang bao gồm:

- Tên tệp lưu trữ: Tên file quản lý trong Google Drive.

- Tên trang web: Hiển thị trên web, kèm theo Logo và Favicon.

- Tiêu đề trang: Tên bài viết hoặc nội dung chính của trang đó.

- Hình nền & Loại tiêu đề: Có thể chọn các loại kích thước: Bìa (lớn nhất), Biểu ngữ lớn, Biểu ngữ, hoặc Chỉ có tiêu đề.

3. Thao tác chính

- Thêm Logo/Favicon: Vào cài đặt "Hình ảnh thương hiệu".

- Thay đổi hình nền: Chọn "Thay đổi hình ảnh" → Tải lên hoặc chọn từ Drive.

- Chỉnh độ sáng: Có chức năng tự động điều chỉnh độ sáng để dễ đọc chữ, có thể tắt/bật.

III. Xây dựng phần thân và chân trang web

1. Bảng chọn "Chèn" (Insert)

Đây là công cụ chính để xây dựng nội dung, gồm 3 nhóm lệnh:

- Nhóm chèn cơ bản: Hộp văn bản (Text box), Hình ảnh, Nhúng (Embed), Drive.

- Nhóm bố cục (Layouts): Các mẫu khối nội dung có sẵn (ảnh kèm văn bản).

- Nhóm đối tượng khác: Mục lục, băng chuyền hình ảnh, nút, YouTube, Lịch, Bản đồ (Map).

2. Thao tác với bản đồ (Google Maps)

- Cách chèn: Chọn "Bản đồ" trong bảng chọn Chèn → Nhập địa điểm → Chọn (Select).

- Chỉnh sửa: Có thể thay đổi kích thước, di chuyển vị trí bản đồ như một hình ảnh.

3. Tạo chân trang (Footer)

- Di chuyển xuống cuối trang → Nhấn nút "Thêm chân trang" (Add footer).

- Nội dung chân trang sẽ hiển thị giống nhau trên tất cả các trang của website.

IV. Liên kết và thanh điều hướng

1. Cấu trúc trang web (Mô hình cây)

- Website gồm một Trang chủ (Home page) và các Trang con (Sub-pages).

- Các trang con có thể chứa các trang con khác tạo thành cấu trúc phân cấp (giống cây thư mục).

2. Thao tác với trang (Pages)

- Tạo trang con: Vào bảng chọn Trang (Pages) → Nhấn dấu + hoặc dấu ba chấm cạnh trang chủ → "Thêm trang con".

- Thanh điều hướng (Navigation bar): Hệ thống tự động cập nhật tên các trang mới tạo lên thanh menu.

- Trên thiết bị di động, thanh điều hướng sẽ tự động thu gọn thành biểu tượng 3 gạch ngang (hamburger menu).

3. Tạo liên kết (Hyperlink)

- Cách làm: Bôi đen văn bản hoặc chọn ảnh → Nhấn biểu tượng Liên kết (Link) → Chọn trang đích hoặc dán địa chỉ web → Áp dụng.

V. Biểu mẫu trên trang web

1. Mục đích:

Dùng để thu thập thông tin, ý kiến phản hồi, khảo sát từ người dùng.

2. Quy trình tạo và nhúng biểu mẫu

- Bước 1: Tạo biểu mẫu bằng Google Forms (forms.google.com). Thiết lập câu hỏi (Trắc nghiệm, trả lời ngắn...).

- Bước 2: Nhúng vào Google Sites. Tại bảng chọn Chèn → Chọn Biểu mẫu (Forms) → Chọn file vừa tạo.

3. Xem kết quả

- Dữ liệu không lưu trên Google Sites mà lưu trong Google Forms (hoặc liên kết sang Google Sheets - Bảng tính).

- Có thể xem thống kê dưới dạng biểu đồ hoặc câu trả lời chi tiết.