Năng lực học tập, tự học: HS biết tự tìm kiếm, chuẩn bị và lựa chọn tài liệu, phương tiện học tập trước giờ học, quá trình tự giác tham gia các và thực hiện các hoạt động học tập cá nhân trong giờ học ở trên lớp,…
Năng lực giao tiếp và hợp tác: Khả năng phân công và phối hợp thực hiện nhiệm vụ học tập.
Năng lực giải quyết vấn đề sáng tạo: HS đưa ra các phương án trả lời cho câu hỏi, bài tập xử lý tình huống, vận dụng kiến thức, kĩ năng của bài học để giải quyết vấn đề thường gặp.

Năng lực Tin học:

Vận dụng tổng hợp các kiến thức đã học về các thẻ HTML và định dạng văn bản với CSS để xây dựng và hoàn thiện một trang web.

3. Phẩm chất

Tích cực tìm tòi và sáng tạo trong học tập.
Hợp tác khi làm việc nhóm.
Tổ chức, sắp xếp công việc một cách khoa học.

II. THIẾT BỊ DẠY HỌC VÀ HỌC LIỆU

GV: SGK, SBT Tin học 12 – Định hướng Khoa học máy tính – Kết nối tri thức, bài trình chiếu (Slide), máy chiếu, phòng máy tính có kết nối Internet, một số gợi ý bố cục, nội dung trang web.
HS: SGK, SBT Tin học 12 – Định hướng Khoa học máy tính – Kết nối tri thức, vở ghi.

III. TIẾN TRÌNH DẠY HỌC

A. HOẠT ĐỘNG KHỞI ĐỘNG

a) Mục tiêu: Giúp HS ôn lại cách sử dụng định dạng CSS để định dạng cho nhiều phần tử và định hướng mục tiêu bài học.

b) Nội dung: HS thảo luận nhóm trả lời câu hỏi.

c) Sản phẩm: Từ yêu cầu, HS vận dụng sự hiểu biết để trả lời câu hỏi GV đưa ra.

d) Tổ chức thực hiện:

Bước 1: GV chuyển giao nhiệm vụ:

- GV chia lớp thành các nhóm 3 – 4 HS, sau đó nêu câu hỏi Khởi động SGK trang 102 cho các nhóm thảo luận:

Giả sử website của em có nhiều tệp HTML. Có thể hay không chỉ dùng một tệp CSS duy nhất để định dạng cho toàn bộ các trang web? Nếu có thể hãy nêu các bước cần thực hiện.

Bước 2: HS thực hiện nhiệm vụ học tập:

- Các nhóm HS thảo luận và trả lời câu hỏi.

- GV quan sát quá trình các nhóm thảo luận, giải đáp thắc mắc nếu HS chưa rõ.

Bước 3: Báo cáo kết quả hoạt động, thảo luận:

- GV mời một số nhóm báo cáo kết quả thảo luận.

Gợi ý trả lời:

Có thể chỉ dùng một tệp CSS duy nhất để định dạng cho toàn bộ các trang web theo các bước sau:

+ Bước 1: Xác định bố cục và viết các đoạn mã CSS cho từng loại đối tượng và lưu trong một tệp style.css.

+ Bước 2: Trong cặp thẻ <head>…</head> của mỗi tệp HTML trong website, ta thêm một dòng mã trỏ tới tệp style.css đã viết ở trên:

- Các nhóm khác lắng nghe và góp ý.

Bước 4: Đánh giá kết quả thực hiện:

GV đánh giá kết quả của HS, dẫn dắt HS vào bài học mới: Ở những bài học trước, các em đã biết cách thiết lập các mẫu định dạng cho các phần tử và hiểu được các mức ưu tiên của bộ chọn. Vậy để giúp các em ôn tập lại toàn bộ những kiến thức đã học cũng như luyện tập tạo trang web bằng HTML và định dạng bằng CSS, chúng ta sẽ cùng nhau đến vớiBài 18: Thực hành tổng hợp thiết kế trang web.

B. HÌNH THÀNH KIẾN THỨC MỚI

Hoạt động 1: Thảo luận theo nhóm

a) Mục tiêu: HS nắm được cách tạo một trang web bằng cách giải quyết từng bước như:

- Xác định mục tiêu, nội dung của trang.

- Thiết kế mẫu, bố cục trang.

- Xây dựng các trang liên quan.

- Tổng hợp, kiểm tra và tinh chỉnh cho phù hợp.

- Quản lí và cập nhật thông tin.

b) Nội dung: GV chọn một số ví dụ minh hoạ có thể có nội dung khác nhau làm gợi ý cho HS về bố cục của các trang. Từ đó có thể triển khai thiết lập bố cục khi đã có nội dung.

c) Sản phẩm: Cách tạo một trang web.

d) Tổ chức thực hiện: