Giáo án Tin học 12 Cánh diều Bài 5: Chèn hình ảnh, âm thanh, video và sử dụng khung

Xem thử

Chỉ từ 400k mua trọn bộ Kế hoạch bài dạy (KHBD) hay Giáo án Tin học 12 Cánh diều bản word chuẩn kiến thức, trình bày đẹp mắt, dễ dàng chỉnh sửa:

I. MỤC TIÊU

1. Kiến thức

Sau bài học này, HS sẽ:

- Chèn được hình ảnh, tệp âm thanh, video vào trang web.

- Nhúng được nội dung trang web khác vào trang web.

2. Năng lực

Năng lực chung:

- 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:

- Chèn được các tệp tin đa phương tiện vào trang web.

- Nhúng được nội dung trang web khác vào trang web.

3. Phẩm chất

- Có ý thức chủ động tìm hiểu và cập nhật các kiến thức mới.

- Cẩn thận, tỉ mỉ khi viết các mã lệnh HTML.

- Hình thành tư duy lôgic phân tích yêu cầu cần đạt để thực hiện một nhiệm vụ cụ thể.

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

- GV: SGK, SBT Tin học 12 – Định hướng Tin học ứng dụng – Cánh diều, bài trình chiếu (Slide), máy chiếu, phòng máy tính có kết nối Internet.

- HS: SGK, SBT Tin học 12 – Định hướng Tin học ứng dụng – Cánh diều, vở ghi.

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

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

a) Mục tiêu: HS thấy được ý nghĩa của việc sử dụng các đối tượng đa phương tiện trong trang web.

b) Nội dung: HS dựa vào hiểu biết để trả lời các 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 2 – 3 HS, cho HS xem trang web https://khamphadisan.com.vn/du-lich-da-nang-dia-diem-checkin-da-nang/, sau đó nêu câu hỏi cho các nhóm thảo luận:Theo em, việc đưa hình ảnh vào trang web có ý nghĩa gì?

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ề trang web mà GV cho xem.

- 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: Việc đưa hình ảnh vào trang web giúp thu hút người xem, giúp cho trang web trở nên sinh động và trực quan hơn. Nhờ có hình ảnh, người xem sẽ dễ dàng hình dung về các địa điểm du lịch và thông tin mà trang web muốn truyền đạt.

- 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: Việc đưa các tệp tin đa phương tiện như hình ảnh, âm thanh, video vào trang web sẽ giúp diễn tả thông tin tốt hơn và thu hút được sự chú ý của người xem.Vậy để giúp các em biết cách sử dụng thẻ HTML thực hiện được các thao tác đó, chúng ta sẽ cùng nhau đến với Bài 5: Chèn hình ảnh, âm thanh, video và sử dụng khung.

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

Hoạt động 1: Chèn hình ảnh

a) Mục tiêu: Cung cấp cho HS cách sử dụng phần tửimg để chèn hình ảnh vào trang web.

b) Nội dung: GV giao nhiệm vụ; HS tìm hiểu nội dung mục 1. Chèn hình ảnh, thảo luận nhóm và thực hiện nhiệm vụ.

c) Sản phẩm: HS chèn được hình ảnh vào trang web.

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

HOẠT ĐỘNG CỦA GV VÀ HS

SẢN PHẨM DỰ KIẾN

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

- GV yêu cầu HS vận dụng kiến thức thực tiễn, trả lời câu hỏi Hoạt động SGK tr.54:

Trong số các định dạng ảnh sau: PNG, RAW, BMP, JPG, GIF, theo em, những định dạng ảnh nào được sử dụng phổ biến trên trang web? Vì sao?

- GV yêu cầu HS thảo luận theo nhóm 2 – 3 HS và trả lời các câu hỏi:

+ Theo em, việc sử dụng các nội dung đa phương tiện trong trang web có ý nghĩa gì?

+ HTML định nghĩa phần tử nào để chèn hình ảnh vào trang web?

+ Phần tử img có cú pháp khai báo như thế nào?

+ Mặc định, kích thước của hình ảnh trên trình duyệt web được tính theo đơn vị gì?

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

- HS tìm hiểu nội dung mục 1 SGK tr.54 – 55 và thảo luận theo nhóm thực hiện nhiệm vụ.

- GV quan sát và trợ giúp HS.

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

- Đại diện các nhóm HS trả lời.

- Các nhóm khác đưa ra ý kiến nhận xét.

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

- GV nêu nhận xét, chính xác hoá lại các nội dung trả lời của HS.

1. Chèn hình ảnh

- Khi tạo trang web, cần có thêm các nội dung đa phương tiện như hình ảnh, âm thanh, video để việc truyền tải thông tin hiệu quả, trực quan và sinh động hơn.

- HTML định nghĩa phần tử img để chèn hình ảnh vào trang web.

- Phần tử img có cú pháp khai báo như sau:

Giáo án Tin học 12 Cánh diều Bài 5: Chèn hình ảnh, âm thanh, video và sử dụng khung

Trong đó:

+ Thuộc tính src xác định Tên tệp ảnh được chèn vào trang web.

Lưu ý: Tên tệp ảnh có thể bao gồm cả đường dẫn đến tệp ảnh. Ảnh được sử dụng trên trình duyệt web thường ở các định dạng JPG, PNG, GIF.

+ Thuộc tính alt xác định Nội dung thay thế sẽ hiển thị vào vùng của hình ảnh trên trình duyệt web trong trường hợp việc hiển thị hình ảnh gặp lỗi.

+ Thuộc tính width, height:

• Xác định cụ thể kích thước Chiều rộngChiều cao của ảnh.

• Thường được dùng để tăng giảm kích thước của ảnh gốc và tuỳ biến kích thước ảnh khi hiển thị trên trình duyệt web.

• Mặc định được tính theo đơn vị điểm ảnh pixel.

Lưu ý: Ảnh sẽ được hiển thị theo kích thước ảnh gốc nếu không khai báo thuộc tính width, height.

Ví dụ 1: Nội dung phần body của văn bản HTML trong Hình 1a chèn tệp ảnh “canhdieu.jpg” vào trang web. Kết quả hiển thị nhưHình 1b.

Giáo án Tin học 12 Cánh diều Bài 5: Chèn hình ảnh, âm thanh, video và sử dụng khung

Hình 1a. Ví dụ sử dụng phần tử img chèn hình ảnh vào trang web

Giáo án Tin học 12 Cánh diều Bài 5: Chèn hình ảnh, âm thanh, video và sử dụng khung

Hình 1b. Kết quả khi mở văn bản HTML ở Hình 1a bằng trình duyệt web

- Lưu ý: Phải lưu trữ tệp ảnh trong cùng thư mục với văn bản HTML nếu thuộc tính src chỉ xác định tên tệp ảnh mà không bao gồm đường dẫn đến tệp ảnh.

................................

................................

................................

Trên đây tóm tắt một số nội dung miễn phí trong bộ Giáo án Tin học 12 Cánh diều mới nhất, để mua tài liệu đầy đủ, Thầy/Cô vui lòng xem thử:

Xem thử

Xem thêm các bài soạn Giáo án Tin học lớp 12 Cánh diều hay, chuẩn khác:


Đề thi, giáo án lớp 12 các môn học