iFrame là gì?

iFrame là chữ viết tắt của Inline Frame – khung nội tuyến. Nó dùng để tải một trang HTML khác bên trong frame của nó. Bạn đã từng nhìn thấy video của Youtube nhúng trên website khác ngoài web Youtube chưa? Một iFrame có thể chèn đủ loại nội dung đa phương tiện tương tự như vậy.

Trong bài này, chúng ta sẽ biết được khái niệm của iFrame là gì, cách sử dụng iFrame và những điều đáng lưu ý về iFrame trước khi bạn thực sự đưa iFrame vào trong HTML document.

iFrame là gì?

Một iFrame là một frame bên trong frame. Nó là thành phần của một HTML element (tag HTML) giúp bạn đính kèm/nhúng tài liệu HTML, videos, và các video vào trong một trang web, hay vào trong bài viết. Bằng cách sử dụng iFrame, bạn đã tải thông tin, nội dung từ một web bên ngoài lên trang web của bạn. Vậy, có thể xem iFrame là một phần của nội dung web, chứ không phải là một phần của thiết kế giao diện website.

Ví dụ, bạn muốn thêm một Youtube video để mô tả rõ hơn cho người đọc, bạn có thể thêm iFrame vào bên trong bài viết.

iFrame có thể tích hợp mọi nội dung từ bất kỳ vị trí nào trong trang web. Chính vì vậy, ta không phải đưa nó vào bố cục chính như các thành phần truyền thống.

Dù vậy, bạn không nên sử dụng iFrame quá nhiều. Nó có thể làm chậm trang web của bạn và tạo ra lỗ hổng bảo mật, đặc biệt khi bạn nhúng nội dung từ các trang web không an toàn. Hãy xem nội dung của iFrame là nội dung của chính website mà cẩn thận chọn lựa chúng.

Làm thế nào để sử dụng iFrame

Giờ bạn đã biết iFrame là gì. Bạn có thể chèn iFrame để bổ sung chất lượng cho bài viết đó. Để thêm iFrame, hãy sử dụng tag <iframe> trong trang HTML.

Ví dụ, bạn có thể copy đoạn code sau và dán nó vào notepad, lưu dưới dạng file .html:

<iframe src="https://www.youtube.com/watch?v=wmHU9V2CQAA" width="680" height="480" allowfullscreen></iframe>

Đoạn code trên sẽ hiển thị video hướng dẫn trên Youtube. Hãy xem qua các tag có ý nghĩa gì nhé:

• <iframe>…</iframe> tag được dùng để chứa video bên trong iFrame.
• Nguồn của iFrame (src) là phần nội dung gốc từ server bên ngoài (hoặc server nội bộ khác). Nguồn URL này phải được đặt trong dấu ngoặc kép.
• Width và height là chiều rộng và cao của iFrame. Bạn có thể thêm kích thước mặc định như là 680×480 pixels (px) trong ví dụ. Hoặc, bạn có thể sử dụng số phần trăm (10%-100%) để tự chỉnh kích thước iFrame tự động.

Vấn đề bảo mật của iFrame là gì

Theo lý thuyết, yếu tố iFrame không tạo ra lỗ hổng bảo mật trên web page của bạn hoặc rủi ro cho người đọc, mà chỉ đơn giản như việc người đọc xem qua 2 trang web cùng lúc. Một phần là vì nó được thiết kế để làm rõ nội dung, để giúp bạn tương tác với người đọc hiệu quả hơn. Nhưng bạn tuyệt đối phải chú ý khi thêm iFrame, hãy xem kỹ xem site nguồn có an toàn hay không, và chỉ thêm iFrame từ site bạn tin tưởng vì người đọc có thể tương tác với website khác thông qua iFrame của bạn.

Việc tấn công thông qua chèn mã độc trong iFrame đã tăng lên, đặc biệt là trên những website danh tiếng. Như là ABC news năm 2008. Cuộc tấn công hướng người dùng tới một site độc hại và khiến họ cài đặt virus vào máy tính để đánh cắp thông tin nhạy cảm. Đó cũng chính là lý do vì sao iFrame không được trở thành một phần chính trong bố cục của website.

Tóm lại, nếu bạn thấy một website đáng ngờ hay có cảm giác nó không an toàn, đừng link tới nó làm gì, và đừng sử dụng iFrame để lấy nội dung của nó.

Lời kết

Dù sao chăng nữa, iFrame vẫn là một công cụ mạnh để bạn tiếp cận tốt hơn với người đọc. Bạn cần xem iFrame là một phần của nội dung chứ không phải là thành phần chính tạo nên trang web. Bạn cũng không nên sử dụng iFrame quá nhiều vì nó có thể làm chậm website của bạn; và sẽ tốt hơn nếu bạn thiết kế một website không có iFrame. Nếu bạn cần sử dụng nó cho mục đích thiết kế và phát triển web, hãy nhớ sử dụng nguồn đáng tin cậy.

Chúng tôi hy vọng bài này có thể giúp bạn hiểu iFrame là gì và triển khai nó thật hiệu quả. Nếu có thắc mắc hoặc ý kiến gì, đừng ngại hãy cho chúng tôi biết ngay từ phần bình luận nhé.