Giải chi tiết tin học ứng dụng 12 cánh diều bài 5 Tạo nội dung hình ảnh cho trang web

KHỞI ĐỘNG

Bên cạnh việc sử dụng các bài viết (dạng văn bản) thì thông tin trên trang web còn có thể được truyền tải dưới dạng hình ảnh, video,.... Theo em, việc sử dụng hình ảnh, video trên trang web có những ưu điểm gì?

Bài làm chi tiết:

Ưu điểm của việc sử dụng hình ảnh, video trên trang web:

• Thu hút sự chú ý.
• Truyền tải thông tin hiệu quả.
• Tăng tính tương tác.
• Tăng thời gian lưu trang.
• Tăng thứ hạng SEO.
• Tạo dựng thương hiệu.
• Thể hiện sự chuyên nghiệp.
• Tăng doanh số bán hàng.

2. BỘ SƯU TẬP VÀ THANH TRƯỢT

Hoạt động: Em có biết bộ sưu tập và thanh trượt khác nhau như thế nào không?

Bài làm chi tiết:

3. THỰC HÀNH

Luyện tập 1: Em hãy tạo nội dung cho trang web được thể hiện dưới dạng hình ảnh có kèm mô tả theo mẫu như ở Hình 7.

Bài làm chi tiết:

Tạo nội dung cho trang web bằng hình ảnh và mô tả theo mẫu trong Mobirise:

Bước 1: Chọn khối nội dung phù hợp:

Mobirise cung cấp nhiều khối nội dung để hiển thị hình ảnh và mô tả. Tùy thuộc vào bố cục mong muốn, bạn có thể chọn:

• Khối "Image with Text": Hiển thị một hình ảnh lớn với mô tả bên dưới.
• Khối "Gallery": Hiển thị nhiều hình ảnh cùng lúc với mô tả ngắn gọn.
• Khối "Carousel": Hiển thị các hình ảnh trượt theo chiều ngang hoặc chiều dọc, kèm theo mô tả.

Bước 2: Thêm nội dung vào khối:

• Chọn hình ảnh:
• Nhấp vào "Edit" trong khối.
• Chọn "Upload Image" để tải lên hình ảnh từ máy tính.
• Hoặc chọn "Browse Media Library" để sử dụng hình ảnh có sẵn trong Mobirise.
• Nhập nội dung mô tả vào phần "Text".
• Định dạng văn bản (font chữ, màu sắc, kích thước) theo ý muốn.
• Thêm mô tả:

Bước 3: Tùy chỉnh giao diện:

• Thay đổi bố cục:
• Chọn "Layout" để thay đổi vị trí của hình ảnh và mô tả.
• Chọn "Style" để thay đổi giao diện tổng thể của khối.
• Chọn "Effects" để thêm hiệu ứng cho hình ảnh khi di chuột qua.
• Chọn "Theme" để thay đổi màu sắc của toàn bộ trang web, bao gồm cả khối nội dung.
• Thêm hiệu ứng:
• Thay đổi màu sắc:

Bước 4: Xuất bản trang web:

• Nhấp "Publish".
• Chọn tên miền và hosting.
• Nhấp "Publish" để xuất bản trang web lên internet.

Luyện tập 2: Em hãy tạo nội dung cho trang web được thể hiện dưới dạng bộ sưu tập theo mẫu như ở Hình 8.

Bài làm chi tiết:

Bước 1: Chọn khối nội dung "Gallery".

Bước 2: Thêm hình ảnh vào bộ sưu tập:

• Nhấp vào "Edit" trong khối "Gallery".
• Chọn "Upload Images" để tải lên hình ảnh từ máy tính.
• Hoặc chọn "Browse Media Library" để sử dụng hình ảnh có sẵn trong Mobirise.

Bước 3: Thêm mô tả cho hình ảnh (tùy chọn):

• Di chuột qua hình ảnh và nhấp vào "Edit".
• Nhập mô tả vào phần "Caption".

Bước 4: Tùy chỉnh giao diện:

• Chọn "Layout": Thay đổi số lượng cột, kích thước hình ảnh, khoảng cách, v.v.
• Chọn "Style": Thay đổi giao diện tổng thể của bộ sưu tập, bao gồm màu sắc, font chữ, hiệu ứng, v.v.
• Chọn "Effects": Thêm hiệu ứng cho hình ảnh khi di chuột qua.

Bước 5: Xuất bản trang web:

• Nhấp "Publish".
• Chọn tên miền và hosting.
• Nhấp "Publish" để xuất bản trang web lên internet.

Câu 3: Em hãy tạo nội dung cho trang web được thể hiện dưới dạng thanh trượt theo mẫu như ở Hình 9.

Bài làm chi tiết:

Bước 1: Chọn khối nội dung "Slider".

Bước 2: Thêm hình ảnh vào thanh trượt:

• Nhấp vào "Edit" trong khối "Slider".
• Chọn "Upload Images" để tải lên hình ảnh từ máy tính.
• Hoặc chọn "Browse Media Library" để sử dụng hình ảnh có sẵn trong Mobirise.

Bước 3: Thêm tiêu đề và mô tả cho mỗi slide (tùy chọn):

• Di chuột qua slide và nhấp vào "Edit".
• Nhập tiêu đề vào phần "Title".
• Nhập mô tả vào phần "Caption".

Bước 4: Tùy chỉnh giao diện:

• Chọn "Layout": Thay đổi kích thước hình ảnh, vị trí tiêu đề và mô tả, hiệu ứng chuyển đổi slide, v.v.
• Chọn "Style": Thay đổi giao diện tổng thể của thanh trượt, bao gồm màu sắc, font chữ, hiệu ứng, v.v.
• Chọn "Effects": Thêm hiệu ứng cho hình ảnh khi di chuột qua.

Bước 5: Xuất bản trang web:

• Nhấp "Publish".
• Chọn tên miền và hosting.
• Nhấp "Publish" để xuất bản trang web lên internet.

TỰ KIỂM TRA

Trong các câu sau, những câu nào đúng?

a) Nội dung trang web chỉ có thể được trình bày dưới dạng bài viết văn bản hoặc hình ảnh.

b) Chỉ có thể sử dụng các hình ảnh được lưu sẵn trong máy tính để đưa vào trang web.

c) Bộ sưu tập cho phép hiển thị cùng lúc nhiều hình ảnh hoặc video khác nhau trên trang web dưới dạng lưới hoặc danh sách.

d) Thanh trượt thường được sử dụng để hiển thị nhiều hình ảnh khi không gian trên trang web hạn chế.

Bài làm chi tiết:

a) Sai: Nội dung trang web có thể được trình bày dưới nhiều dạng khác nhau, không chỉ giới hạn ở bài viết văn bản hoặc hình ảnh. Ví dụ: video, âm thanh, biểu đồ, infographic, v.v. đều có thể được sử dụng để truyền tải thông tin.

b) Sai: Bạn có thể sử dụng nhiều nguồn hình ảnh khác nhau để đưa vào trang web, bao gồm:

• Hình ảnh được lưu sẵn trong máy tính: Đây là cách phổ biến nhất.
• Hình ảnh được tìm kiếm trên internet: Bạn có thể sử dụng các công cụ tìm kiếm hình ảnh như Google Images để tìm kiếm và tải xuống hình ảnh miễn phí hoặc trả phí.
• Hình ảnh được chụp trực tiếp: Bạn có thể sử dụng webcam hoặc điện thoại thông minh để chụp ảnh và tải lên trang web.

c) Đúng: Bộ sưu tập cho phép hiển thị cùng lúc nhiều hình ảnh hoặc video khác nhau trên trang web dưới dạng lưới hoặc danh sách. Đây là một cách hiệu quả để giới thiệu các sản phẩm, dịch vụ, bài viết hoặc dự án.

d) Đúng: Thanh trượt thường được sử dụng để hiển thị nhiều hình ảnh khi không gian trên trang web hạn chế. Thanh trượt giúp tiết kiệm diện tích và thu hút sự chú ý của người dùng.