Đáp án Tin học ứng dụng 12 kết nối bài 10: Tạo liên kết

BÀI 10. TẠO LIÊN KẾT

KHỞI ĐỘNG

Em hãy nêu những điểm khác biệt khi em đọc thông tin trên các trang web với việc em đọc sách, báo giấy. Theo em, điểm khác biệt nào là quan trọng nhất?

Giải chi tiết:

Việc đọc thông tin trên các trang web và đọc sách, báo giấy có nhiều điểm khác biệt, cả về trải nghiệm và cách tiếp nhận thông tin. Dưới đây là một số điểm khác biệt chính:

1. Trải nghiệm đọc

• Trang web: Thông tin trên các trang web thường có thể tương tác được, bao gồm các liên kết, video, hình ảnh động, và các yếu tố đa phương tiện khác. Người đọc có thể dễ dàng di chuyển qua lại giữa các trang hoặc các phần khác nhau.

• Sách, báo giấy: Thông tin tĩnh, không có sự tương tác. Việc di chuyển qua lại giữa các trang hoặc mục đích yêu cầu thao tác thủ công như lật trang.

2. Tốc độ truy cập và cập nhật thông tin

• Trang web: Thông tin được cập nhật liên tục và nhanh chóng. Người đọc có thể truy cập thông tin mới nhất bất kỳ lúc nào.

• Sách, báo giấy: Thông tin cố định, không thay đổi sau khi in. Việc cập nhật thông tin mới yêu cầu in ấn một phiên bản mới.

3. Tính tương tác và tìm kiếm

• Trang web: Có chức năng tìm kiếm, cho phép người đọc tìm nhanh thông tin cần thiết. Các bình luận, đánh giá, và chia sẻ trên mạng xã hội cũng giúp tăng cường tính tương tác.

• Sách, báo giấy: Không có chức năng tìm kiếm. Người đọc phải dò tìm thủ công thông tin trong sách hoặc báo.

4. Tính tiện lợi và khả năng tiếp cận

• Trang web: Có thể truy cập mọi lúc, mọi nơi nếu có kết nối internet và thiết bị phù hợp (máy tính, điện thoại thông minh, máy tính bảng).

• Sách, báo giấy: Cần phải mang theo sách hoặc báo, có thể không tiện lợi nếu cần di chuyển nhiều.

5. Khả năng tập trung và thẩm mỹ

• Trang web: Có thể gây phân tán do quảng cáo, pop-up và các yếu tố gây nhiễu khác. Đọc lâu trên màn hình có thể gây mỏi mắt.

• Sách, báo giấy: Thường ít bị phân tán, giúp người đọc dễ tập trung hơn. Trải nghiệm đọc sách giấy cũng mang tính truyền thống và thẩm mỹ cao.

Điểm khác biệt quan trọng nhất:

Tính tương tác và khả năng cập nhật thông tin nhanh chóng trên trang web có lẽ là điểm khác biệt quan trọng nhất. Việc có thể tìm kiếm thông tin ngay lập tức, cập nhật liên tục và truy cập đa phương tiện mang lại lợi thế lớn cho trang web so với sách, báo giấy trong thế giới thông tin hiện đại ngày nay.

1. SIÊU VĂN BẢN VÀ ĐƯỜNG DẪN

Hoạt động 1: Nhận biết siêu văn bản

Các tệp có phần mở rộng .docx được tạo bởi Microsoft Word có thể là một siêu văn bản còn tệp có phần mở rộng .txt tảo bơi Notepad thì không. Theo em, siêu văn bản có những đặc điểm gì?

Giải chi tiết:

Siêu văn bản (hypertext) là một dạng văn bản được thiết kế để có khả năng liên kết với các tài liệu khác thông qua các liên kết (hyperlinks) và có thể bao gồm các yếu tố đa phương tiện như hình ảnh, video và âm thanh. Các tệp .docx tạo bởi Microsoft Word có thể chứa các đặc điểm của siêu văn bản, trong khi các tệp .txt được tạo bởi Notepad chỉ là văn bản thuần túy và không có khả năng này.

Đặc điểm của siêu văn bản:

1. Liên kết (Hyperlinks):

   • Khả năng chứa các liên kết đến các trang web, tài liệu khác hoặc các phần khác trong cùng một tài liệu.

   • Liên kết có thể là văn bản hoặc hình ảnh, và khi nhấp vào, chúng sẽ dẫn đến tài liệu hoặc trang đích khác.

2. Định dạng phong phú (Rich Formatting):

   • Hỗ trợ các kiểu chữ như in đậm, in nghiêng, gạch chân, thay đổi phông chữ, cỡ chữ, màu chữ.

   • Cho phép định dạng đoạn văn bản như căn lề, giãn dòng, đánh số, và tạo danh sách.

3. Đa phương tiện (Multimedia):

   • Có thể nhúng hình ảnh, video, âm thanh và các yếu tố đa phương tiện khác vào tài liệu.

   • Tích hợp biểu đồ, đồ thị, bảng biểu, và các đối tượng khác.

4. Tương tác (Interactivity):

   • Hỗ trợ các yếu tố tương tác như nút bấm, biểu mẫu, và các điều khiển tương tác khác.

   • Có thể nhúng mã nhúng như HTML, CSS, JavaScript để tạo ra các trang web hoặc tài liệu có tính tương tác cao.

5. Metadata:

   • Chứa thông tin về tài liệu như tiêu đề, tác giả, ngày tạo, từ khóa và các thuộc tính khác.

   • Metadata giúp việc tìm kiếm và quản lý tài liệu dễ dàng hơn.

6. Cấu trúc phân cấp (Hierarchical Structure):

   • Hỗ trợ tạo mục lục tự động, tiêu đề, và các phần phân cấp để tổ chức tài liệu một cách logic.

   • Giúp người đọc dễ dàng điều hướng và tìm kiếm thông tin trong tài liệu.

So sánh với tệp .txt:

• .docx: Hỗ trợ tất cả các đặc điểm trên, cho phép tạo ra tài liệu phong phú và tương tác.

• .txt: Chỉ chứa văn bản thuần túy, không có định dạng phong phú, không hỗ trợ đa phương tiện hay siêu liên kết.

Siêu văn bản là công cụ mạnh mẽ cho việc tạo và chia sẻ thông tin trong môi trường kỹ thuật số, đặc biệt trong việc tạo ra các tài liệu phong phú và tương tác.

Câu hỏi: Trong các đường dẫn sau, đường dẫn nào là tuyệt đối, đường dẫn nào là tương đối?

a) html/cách_tao_lien_ket.html

b) http://google.com

c) mail.google.com/mail/u/#inbox/FMfcgzGMpKDHQFWcdfxcmMtxvZ 

Giải chi tiết:

Để xác định xem đường dẫn là tuyệt đối hay tương đối, ta cần hiểu rõ định nghĩa của chúng:

• Đường dẫn tuyệt đối (absolute path): Là đường dẫn đầy đủ chỉ rõ vị trí của một tệp hoặc tài nguyên trên internet hoặc hệ thống tệp. Nó thường bắt đầu bằng giao thức (như http://, https://, ftp://) hoặc từ gốc của hệ thống tệp (như /).

• Đường dẫn tương đối (relative path): Là đường dẫn được xác định dựa trên vị trí của tệp hiện tại hoặc thư mục hiện tại. Nó không bao gồm giao thức hoặc thông tin về miền (domain) và thường bắt đầu bằng tên thư mục hoặc tệp (không có / ở đầu).

Xác định đường dẫn:

a) html/cách_tao_lien_ket.html

• Đây là một đường dẫn tương đối, vì nó chỉ định vị trí tệp dựa trên thư mục hiện tại.

b) http://google.com

• Đây là một đường dẫn tuyệt đối, vì nó bao gồm giao thức (http://) và tên miền đầy đủ (google.com).

c) mail.google.com/mail/u/#inbox/FMfcgzGMpKDHQFWcdfxcmMtxvZ

• Đây cũng là một đường dẫn tuyệt đối, vì nó bao gồm tên miền đầy đủ (mail.google.com). Tuy nó không có giao thức (http:// hoặc https://), nhưng theo quy ước trong trình duyệt web, việc bắt đầu bằng tên miền đầy đủ sẽ được xem là một đường dẫn tuyệt đối.

2. CÁC CÁCH LIÊN KẾT TỚI MỘT TRANG WEB

Hoạt động 2: Tìm hiểu các cách liên kết tới một trang web

Hãy kể tên các trường hợp liên kết mà em đã gặp khi duyệt trang web hoặc khi đọc văn bản.

Giải chi tiết:

Ví dụ: khi em tìm hiểu về “Hương vị Tết cổ truyền” thì tại trang văn bản em thấy có phần “nem chua”, “thịt kho”, “bánh tét” có màu khác với các phần văn bản còn lại. Đó là một siêu liên kết, khi bấm vào sẽ dẫn em tới một trang web mới nói về các từ khác màu này.

Câu hỏi: Viết một đoạn mã html để hiển thị một danh sách không có thứ tự trong tệp index.html. Danh sách gồm ba mục: bài tập 1, bài tập 2 và ôn tập. Ba mục này liên kết tới ba trang tương ứng với ba tệp bai_tap_1, bai_tap_2 và bai_tap_on_tap.html

Giải chi tiết:

Các thẻ HTML:

Kết quả trả về:

LUYỆN TẬP

Câu 1: Viết đoạn mã để tạo liên kết quay về trang chủ CLB.html trong thong_tin.html

Giải chi tiết:

Mã HTML:

Kết quả trả về:

Câu 2: Viết một rang web giới thiệu bản thân, trong đó để ít nhất ba liên kết tới trang web (có thể là Facebook) của ba bạn củng lớp.

Giải chi tiết:

Mã HTML:

Kết quả trả về:

Chú ý: khi các em thực hành thì điền link facebook hoặc mạng xã hội của bản thân và của bạn em vào các vị trí tương ứng.

VẬN DỤNG

Viết thêm các đoạn giới thiệu (địa điểm, số thành viên, thành tích, phí hội viên, điện thoại liên hệ) cho từng câu lạc bộ ở dưới bảng Lịch hoạt động các CLB Thể thao rồi đặt liên kết từ câu lạc bộ trong bảng đến đoạn giới thiệu tương ứng.

Giải chi tiết:

Gợi ý một đoạn mã HTML:

<!DOCTYPE html>

<html>

<head>

 <title>Lịch hoạt động các CLB Thể thao</title>

</head>

<body>

 <h1>Lịch hoạt động các CLB Thể thao</h1>

 <table>

   <tr>

     <th>Câu lạc bộ</th>

     <th>Lịch hoạt động</th>

   </tr>

   <tr>

     <td><a href="#clb1">CLB Thể thao A</a></td>

     <td>Thứ Hai, Thứ Tư: 18:00 - 20:00</td>

   </tr>

   <tr>

     <td><a href="#clb2">CLB Thể thao B</a></td>

     <td>Thứ Ba, Thứ Năm: 17:00 - 19:00</td>

   </tr>

   <tr>

     <td><a href="#clb3">CLB Thể thao C</a></td>

     <td>Thứ Tư, Thứ Sáu: 16:00 - 18:00</td>

   </tr>

 </table>

 <div id="clb1">

   <h2>CLB Thể thao A</h2>

   <p>Địa điểm: Sân bóng ABC</p>

   <p>Số thành viên: 30</p>

   <p>Thành tích: Vô địch giải đấu quận 2022</p>

   <p>Phí hội viên: 500.000 VNĐ/năm</p>

   <p>Điện thoại liên hệ: 0123-456-789</p>

 </div>

 <div id="clb2">

   <h2>CLB Thể thao B</h2>

   <p>Địa điểm: Nhà thi đấu XYZ</p>

   <p>Số thành viên: 25</p>

   <p>Thành tích: Á quân giải đấu thành phố 2021</p>

   <p>Phí hội viên: 400.000 VNĐ/năm</p>

   <p>Điện thoại liên hệ: 0987-654-321</p>

 </div>

 <div id="clb3">

   <h2>CLB Thể thao C</h2>

   <p>Địa điểm: Bể bơi XYZ</p>

   <p>Số thành viên: 20</p>

   <p>Thành tích: Huy chương đồng giải bơi thành phố 2020</p>

   <p>Phí hội viên: 300.000 VNĐ/năm</p>

   <p>Điện thoại liên hệ: 0123-789-456</p>

 </div>

</body>

</html>

Khi đó kết quả trả về là: