Kế hoạch bài dạy minh hoạ môn Tin học 12 phát triển năng lực số

Kế hoạch bài dạy minh họa môn Tin học 12

Kế hoạch bài dạy minh họa môn Tin học 12 phát triển năng lực số được xây dựng theo định hướng chương trình GDPT 2018, nhằm giúp giáo viên vận dụng công nghệ thông tin hiệu quả trong dạy học và kiểm tra, đánh giá. Tài liệu cung cấp ví dụ minh họa cụ thể về cách tổ chức hoạt động học tập, phát triển tư duy công nghệ, kỹ năng sử dụng công cụ số và năng lực giải quyết vấn đề cho học sinh. Đây là nguồn tư liệu hữu ích phục vụ tập huấn, sinh hoạt chuyên môn và đổi mới phương pháp dạy học môn Tin học ở trường THPT.

• Gợi ý các tình huống sư phạm tích hợp năng lực số lớp 1-12
• Địa chỉ tích hợp năng lực số môn Ngữ văn THCS

Mẫu giáo án tích hợp năng lực số môn Tin học 12 KNTT

BÀI 13. KHÁI NIỆM, VAI TRÒ CỦA CSS

Thời gian thực hiện: 2 tiết

I. MỤC TIÊU

1. Kiến thức

- Khái niệm CSS.

- Cấu trúc của các định dạng CSS

- Vai trò của CSS

- Cách thiết lập CSS, ưu và nhược điểm của từng cách.

2. Năng lực
Thực hiện bài học này sẽ góp phần giúp học sinh rèn luyện và phát triển một số năng lực với các biểu hiện chủ yếu sau đây:

a) Năng lực chung:

- Năng lực tự chủ, tự học: Học sinh có khả năng tự đọc sách giáo khoa và kết hợp với gợi ý của giáo viên để trả lời câu hỏi bằng cách sử dụng mạng Internet, chatGPT...

- Năng lực giao tiếp và hợp tác: Học sinh thảo luận nhóm để đưa ra những tác dụng của từng cách thiết lập CSS.

- Năng lực giải quyết vấn đề và sáng tạo: Học sinh có thể đưa ra những cách giải quyết tình huống nếu bạn của em có biểu hiện nghiện trò chơi trực tuyến, tạo ra các sản phẩm số vể chủ đề CSS.

b) Năng lực Tin học:

- Năng lực A (NLa): Phát triển năng lực sử dụng và quản lý các phương tiện công nghệ thông tin và truyền thông như ChatGPT, internet, điện thoại thông minh.

- Năng lực D (NLd): Sử dụng được môi trường mạng máy tính để tìm kiếm, thu thập, cập nhật và lưu trữ thông tin phù hợp với mục tiêu học tập

Năng lực E (NLe): Có khả năng làm việc nhóm, hợp tác được trong việc tạo ra, trình bày và giới thiệu được sản phẩm số

- Năng lực C (NLc):

+ Hiểu được vai trò và ý nghĩa của cấu trúc định dạng CSS trong việc trình bày trang web.

+ Thực hiện thiết lập được CSS bằng 3 cách trong một số ví dụ cụ thể, từ đó thấy được ưu và nhược điểm của từng cách, lựa chọn được cách thực hiện phù hợp với nhiệm vụ.

- Năng lực số cốt lõi:

+ 3.4NC1a: Tự thao tác được bằng các hướng dẫn dành để giải quyết vấn đề tạo và thiết lập CSS .

+ 5.3NC1b” Sử dụng các công cụ và công nghệ số để tạo ra các sản phẩm tìm hiểu về khái niệm về CSS, cấu trúc và cách thiết lập CSS. Gắn kết cá nhân và nhóm vào quá trình xử lý nhận thức để hiểu và giải quyết các vấn đề giáo viên giao qua bài tập nhóm.

3. Phẩm chất

Hình thành ý thức trách nhiệm khi làm việc nhóm với công cụ máy tính. Rèn tính cẩn thận, kiên trì, chăm chỉ học hỏi để hoàn thành nhiệm vụ được giao.

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

1. GV chuẩn bị:

• SGK, bài giảng PPT, phòng máy tính có kết nối Internet, máy chiếu.

• Chuẩn bị trang web nhỏ và một số dạng tệp CSS khác nhau, sử dụng trong quá trình dạy học trên lớp để không mất thời gian gõ lại.

- Câu hỏi, trò chơi Kahoot trên trang Kahoot.com

- Câu hỏi, link khảo sát trên Google form.

- Link drive email lớp lưu sẵn các tệp:

2. HS: SGK, vở ghi, chuẩn bị bài ở nhà.

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

A. MỞ ĐẦU

Hoạt động 1. Khởi động (5 phút)

a) Mục tiêu:

- Gợi tò mò cho HS về cách thiết lập định dạng cho trang web thông qua một ví dụ cụ thể.

b) Tổ chức thực hiện

# 1. Chuyển giao nhiệm vụ

GV đưa hình ảnh minh hoạ trong tình huống khởi động, yêu cầu 2 HS trên cùng 1 bàn chạy 2 tệp code nguồn, sau đó nhận xét định dạng van bản trong trang web. HS thực hiện thao tác, suy nghĩ, nêu nhận xét.

- Thông qua hình ảnh là kết quả thể hiện một trang web trên trình duyệt, HS phán đoán sẽ phải thiết lập các thông số định dạng như thế nào, cho phép HS phát biểu có thể sai.

#2. Thực hiện nhiệm vụ

- HS suy nghĩ trả lời câu hỏi.

- Dự kiến HS có thể nhận ra: phần tử <h1> và 2 phần tử <p> có định dạng giống nhau, phần tử h1 có màu khác biệt so với trước

- # 3. Báo cáo, thảo luận

- GV mời các HS trả lời câu hỏi. Ghi nhận các câu trả lời của HS.

- Với các câu trả lời của HS, GV phân tích đúng/sai.

- Câu hỏi 3 HS có thể chưa đưa được câu trả lời đúng, GV gợi ý trả lời câu 3: Hai đoạn văn bản sẽ đều là các phần tử p. Vậy có thể thiết lập được 1 lần định dạng và áp dụng cho cả hai phần tử p này à dẫn dắt vào bài.

# 4. Kết luận

- Cần thiết tìm hiểu một cách làm để có thể định dạng chung cho nhiều phần tử nhanh.

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

Hoạt động 2. Tìm hiểu khái niệm và cấu trúc mẫu định dạng CSS (10 phút)

a) Mục tiêu

-HS làm quen với khái niệm mẫu định dạng CSS. Bước đầu thấy được ý nghĩa của mẫu định dạng CSS.

-HS biết được cấu trúc mẫu định dạng CSS.

b) Nội dung (Mục 1 và 1/2 Mục 2 trong SGK)

1. Hoạt động 1 (SGK trang 71)

(Mã nguồn hình 13.2 và kết quả hiển thị trên trang web hình 13.1)

- Mã nguồn hình 13.2 có gì khác biệt với những nội dung em đã học?

- Quan sát kết quả hiển thị của mã nguồn. Những nội dung em vừa chỉ ra trong câu hỏi trên ảnh hưởng như thế nào đến kết quả hiển thị?

2. Khái niệm mẫu định dạng CSS + ví dụ

3. Cấu trúc mẫu định dạng CSS + ví dụ

4. Câu hỏi củng cố và câu hỏi tự luyện 2 trang 72

Câu hỏi: Thiết lập mẫu định dạng CSS cho:

- Các thẻ <h1> có định dạng chữ màu xanh (blue), cỡ chữ 14

- Các thẻ <p> có định dạng lùi đầu dòng 20px.

- Các thẻ <h1> và <p> đều có định dạng phông chữ Time New Roman.

c) Sản phẩm

1. Khái niệm mẫu định dạng CSS

2. Cấu trúc CSS

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

#1. Chuyển giao nhiệm vụ:

GV chiếu cho HS xem đoạn code HTML và kết quả thể hiện trên trình duyệt, nêu câu hỏi số 1 “CSS là gì?” , nêu câu hỏi số 2 “Đặc điểm của CSS là gì?”, câu hỏi số 3 “Cấu trúc tổng quát của mẫu định dạng CSS như thế nào?”,

# 2. Thực hiện nhiệm vụ:

HS thảo luận nhóm và tìm câu trả lời.

# 3. Báo cáo, thảo luận

- GV mời một số nhóm HS báo cáo kết quả, các HS khác nhận xét, bổ sung.

# 4. Kết luận

GV chốt kết quả, giới thiệu kiến thức mới: Khái niệm và phân tích ý nghĩa CSS, chỉ ra trên ví dụ. Sau khi chốt kết quả nội dung 1, GV giao nhiệm vụ HS trả lời câu hỏi củng cố và câu hỏi tự luyện 1,2 trong SGK/Trang 72

Tiếp tục khai thác ví dụ trên, GV gợi ý HS chỉ ra cấu trúc chung của các mẫu định dạng trong ví dụ.

- HS suy nghĩ trả lời. HS có thể không gọi đúng tên bộ chọn mà gọi tên thẻ, nhưng có thể chỉ ra điểm chung của các mẫu định dạng.

GV phân tích câu trả lời của HS, giới thiệu cấu trúc của mẫu định dạng CSS. Chú ý nhấn mạnh ý nghĩa của bộ chọn trong cấu trúc. GV minh hoạ các nội dung thông qua ví dụ (SGK) và bổ sung thêm ví dụ khác để làm rõ.

- HS nghe giảng và quan sát ví dụ về mẫu định dạng CSS, cấu trúc mẫu định dạng CSS.

Kết luận kiến thức trong hộp kiến thức cuối trang 72, đầu trang 73.

Hoạt động 3. Tìm hiểu về cách thiết lập CSS (15 phút)

a) Mục tiêu

- HS hiểu và thực hiện được 3 cách thiết lập CSS, ưu và nhược điểm của từng cách.

b) Nội dung

1. Tìm hiểu cách thiết lập CSS: - Có mấy cách thiết lập CSS, đó là những cách nào? - Với mỗi cách, tìm hiểu cách thực hiện thiết lập? - Ưu, nhược điểm từng cách là gì? 2. Câu hỏi tự luyện trang 74

c) Sản phẩm

1. Cách thiết lập CSS (3 cách) C1: Cách thiết lập CSS trong (internal CSS) - Đưa mẫu định dạng vào thẻ <style>, đặt trong phần tử <head> của tệp HTML. - Ví dụ: HĐ1/71 - Nhược điểm: Mẫu định dạng CSS chỉ được áp dụng cho tệp HTML hiện thời C2: Cách thiết lập CSS ngoài - Tạo tệp CSS ghi thông tin các mẫu định dạng à Thực hiện kết nối (liên kết) từ tệp HTML đến tệp định dạng CSS - Ví dụ: SGK/73 - Ưu điểm: Có thể áp dụng định dạng từ 1 tệp CSS cho nhiều trang web (ví dụ các trang web trong cùng website) giúp cho việc định dạng thống nhất. Khi cần chỉnh sửa định dạng thì chỉ cần sửa định dạng 1 lần ở tệp CSS. C3: Cách thiết lập CSS nội tuyến. - Chỉ ra thuộc tính và giá trị thuộc tính style - Đặc điểm: Phức tạp, mất thời gian, tốc độ thực thi nhanh. 2. Câu hỏi tự luyện trang 74 C1. Cần thiết lập các định dạng CSS bên trong thẻ <style> .... </style> và đặt trong phần <head> của trang web cần định dạng. C2. Cần thiết lập các định dạng CSS trong một tệp .css ngoài, sau đó kết nối tất cả các trang web bằng liên kết dạng như sau trong <head>. <link href="styles.css" rel="stylesheet" type = "text/css">

Mời các bạn xem thêm trong file tải về.

Mời các bạn tham khảo các bài viết khác trong chuyên mục Dành cho giáo viên của Hoatieu.