Giáo án Tin học ứng dụng 12 chân trời Bài E5: Nhúng mã và tạo băng chuyền hình ảnh

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

SẢN PHẨM DỰ KIẾN

a) Tạo mới băng chuyền hình ảnh

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

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

+ Công cụ Image carousel dùng để làm gì?

+ Để tạo mới và chèn băng chuyền hình ảnh vào trang web, em thực hiện như thế nào?

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 1a SGK tr.78 – 79 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. Công cụ Image carousel

Công cụ Image carousel (băng chuyền hình ảnh) dùng để trình chiếu hình ảnh trên trang web hay các hình ảnh sẽ tự chuyển động theo dạng băng chuyền. 

a) Tạo mới băng chuyền hình ảnh

- Cách sử dụng công cụ Image carousel để tạo mới và chèn băng chuyền hình ảnh vào trang web:

+ Nháy chọn thẻ Insert → Công cụ Image carousel.

+ Tại hộp thoại Insert images,  nháy chọn

biểu tượng Add image → Chọn Upload image hoặc Select image để chọn lần lượt các hình ảnh cần chèn.

Hình 1. Hộp thoại Insert images

+ Chỉnh sửa hình ảnh sau khi tải lên: Chọn hình ảnh → Chọn remove image (xoá hình ảnh) hoặc add text (thêm văn bản mô tả hình ảnh).

+ Sau khi hoàn hiện, chọn Insert.

Hình 2. Tạo băng chuyền hình ảnh

- Lưu ý: Chọn ít nhất 2 hình ảnh để tạo băng chuyển hình ảnh.

b) Hiệu chỉnh băng chuyền hình ảnh Bước 1: GV chuyển giao nhiệm vụ:

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

+ Để hiệu chỉnh băng chuyền hình ảnh, em thực hiện như thế nào?

+ Google Sites cung cấp những tuỳ chọn nào để hiệu chỉnh băng chuyền hình ảnh?

- GV yêu cầu HS vận dụng kiến thức vừa tìm hiểu, trả lời câu hỏi hoạt động Làm tr.79 SGK:

Để tạo chuyển động băng chuyền hình ảnh, em cần sử dụng ít nhất bao nhiêu hình ảnh? 

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 1b SGK tr.79 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.

Hướng dẫn trả lời câu hỏi hoạt động Làm tr.79 SGK:

Cần sử dụng ít nhất 2 hình ảnh để tạo chuyển động băng chuyền hình ảnh.

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.

- GV kết luận:

Công cụ Image carousel tạo chuyển động cho hình ảnh dạng băng chuyền.

b) Hiệu chỉnh băng chuyền hình ảnh 

- Cách hiệu chỉnh băng chuyền hình ảnh: 

+ Chọn hình ảnh trên băng chuyền → Chọn Settings hoặc nháy đúp chuột vào hình ảnh trên băng chuyền.

Hình 3. Hiệu chỉnh băng chuyền hình ảnh

+ Thực hiện hiệu chỉnh:

• Cập nhật nội dung thay đổi tại hộp thoại Edit carousel: Chọn một trong các tuỳ chọn thêm, xoá hình ảnh hoặc thêm văn bản → Update.

Hình 4. Hộp thoại  Edit carousel

• Chọn Settings trong hộp thoại Edit carousel để xuất hiện thêm các tuỳ chọn:

Hình 5. Các tuỳ chọn khác

• Show dots (Hiển thị dấu chấm): hiển thị các dấu chấm bên dưới hình ảnh.

• Show captions (Hiển thị phần chú thích): hiển thị chú thích bên dưới hình ảnh.

• Auto start (Tự động bắt đầu): tự động chạy hình ảnh khi mở trang web.

• Transition speed (Tốc độ chuyển đổi): có 4 tuỳ chọn gồm very slow (rất chậm), slow (chậm), medium (vừa), fast (nhanh).

Lưu ý: Tuỳ chọn Transition speed chỉ xuất hiện khi tuỳ chọn Auto start được chọn.

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

SẢN PHẨM DỰ KIẾN

a) Nhúng vào trang web

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

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

+ Công cụ Embed dùng để làm gì?

+ Để nhúng liên kết hoặc mã định dạng web vào trang web, em thực hiện như thế nào?

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 2a SGK tr.80 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.

2. Công cụ Embed

Công cụ Embed (nhúng) dùng để nhúng một liên kết trang web hoặc nhúng mã định dạng web.

a) Nhúng vào trang web

- Cách sử dụng công cụ Embed để nhúng một liên kết hoặc mã định dạng web vào trang web:

+ Chọn thẻ Insert → Công cụ Embed.

Hình 6. Thao tác chọn công cụ Embed

+ Chọn 1 trong 2 tuỳ chọn nhúng tại hộp thoại Embed from the web:

• By URL (nhúng liên kết): Sao chép đường liên kết và dán vào mục Enter URL.

Hình 7. Nhúng mã URL

• Embed code (nhúng mã định dạng web): Sao chép đoạn mã HTML từ các trang web có hỗ trợ nhúng mã. Em có thể nhúng bản tin thời tiết, giờ các nước,... vào trang web của mình.

Hình 8. Nhúng mã web

b) Thay đổi các tuỳ chọn nhúng 

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

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

+ Để thay đổi các tuỳ chọn nhúng, em thực hiện như thế nào?

- GV yêu cầu HS vận dụng kiến thức vừa tìm hiểu, trả lời câu hỏi hoạt động Làm tr.81 SGK:

Em hãy kể tên những thay đổi tuỳ chọn hiển thị khi nhúng một liên kết trang web hoặc nhúng mã web vào trang web.

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 2b SGK tr.80 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.

Hướng dẫn trả lời câu hỏi hoạt động Làm tr.81 SGK:

Có 2 hoặc 3 tuỳ chọn hiển thị tuỳ vào trang web được chọn để nhúng khi nhúng một liên kết trang web hoặc nhúng mã web vào trang web.

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.

- GV kết luận:

Công cụ Embed để nhúng liên kết trang web hoặc mã định dạng web.

b) Thay đổi các tuỳ chọn nhúng 

- Cách thay đổi các tuỳ chọn nhúng:

+ Chọn trang web vừa nhúng → Chọn Settings hoặc nháy đúp chuột vào trang web.

+ Bật các tuỳ chọn phù hợp trong hộp thoại Link Card Settings (tuỳ thuộc vào trang web chọn để nhúng sẽ hiển thị 2 hoặc 3 tuỳ chọn):

Hình 9. Thay đổi phần hiển thị 
nội dung nhúng

• Show image: hiển thị hình ảnh của trang web được nhúng.

• Show title: hiển thị tiêu đề bài viết của trang web được nhúng.

• Show description: hiển thị mô tả ngắn của trang web được nhúng.

- Lưu ý: 

+ Các dấu tick xanh hiển thị bên cạnh các mục là đang bật, nháy chọn biểu tượng sẽ chuyển sang màu xám nếu muốn tắt tuỳ chọn. Khi chọn các nhúng liên kết nên chọn những liên kết có đầy đủ 3 tuỳ chọn trong hộp thoại Link Card Settings.

+ Khi thực hiện nhúng liên kết vào trang web, em nên chọn hiển thị cả 3 nội dung tiêu đề, hình ảnh và mô tả ngắn, giúp cho người xem nắm được nội dung trang web được nhúng.