Học HTML, CSS từ Zero Tới Hero
- Tạo kết nối trước với thẻ link
- Tính hợp lệ khi sử dụng thẻ link
Tạo kết nối trước với thẻ link
Thẻ <link> được sử dụng để tạo kết nối trước cho trang web.
Ví dụ:
<head>
<link rel="preconnect" href="https://example.com">
</head>
Khi đọc được thuộc tính preconnect trong thẻ <link>, trình duyệt sẽ ưu tiên tiên liên kết được đặt trong thuộc tính href và gửi kết nối trước.
Thẻ <link rel="preconnect"> sẽ giúp “kết nối trước” tới địa chỉ nguồn tài nguyên, bao gồm:
- Phân giải DNS, nhận IP
- Khởi tạo kết nối TCP tới IP
- “Bắt tay” với giao thức HTTPS
Sau các bước này, trình duyệt sẽ ghi nhớ và khi gặp nguồn tài nguyên cần tải xuống sẽ thực hiện nhanh hơn.
Tính hợp lệ khi sử dụng thẻ link
Theo nguyên tắc chuẩn của HTML, thẻ <link> thường được đặt trong thẻ <head> để chỉ định các tài nguyên liên quan đến trình bày hoặc hành vi của trang web. Tuy nhiên, theo tiêu chuẩn HTML mới nhất, một số thuộc tính của thẻ <link> cho phép nó được đặt trong thẻ <body>.
Lưu ý, thẻ <link> chỉ được đặt trong thẻ <body> khi nó chứa thuộc tính nằm trong danh sách cho phép đặt trong thẻ <body>. Để kiểm tra xem một thuộc tính cụ thể của thẻ <link> có được phép đặt trong không, bạn có thể tham khảo tại HTML Standard - Link.
Thuộc tính nào được đánh Yes vào trường body-ok thì sẽ được phép đặt trong thẻ <body>.
Để minh bạch nhất về việc trình bày code không ảnh hưởng trực tiếp đến hiển thị ban đầu của trang web, những thẻ nào không mang tính hiển thị nên đặt trong thẻ <head>.
Tóm tắt
- Các trường hợp sử dụng thẻ
<link>:- Liên kết file CSS
- Thêm favicon
- Tạo kết nối trước
- Thẻ
<link>chỉ được đặt trong thẻ<body>khi nó chứa thuộc tính nằm trong danh sách cho phép đặt trong thẻ<body>.
Nhận xét