04/10/2018, 20:11

5 điều bạn có thể làm với thẻ HTML Meta

Thẻ Meta thường được dùng để lưu trữ những mẩu thông tin trên một trang web. Mục đích của nó thường hướng đến trình duyệt hoặc bộ máy tìm kiếm hiểu và biết trang tốt hơn. Là một web developer, chắc hẳn các bạn đã quá quen thuộc với việc sử dụng thẻ meta cho các cấu hình mô tả trang ...

Thẻ Meta thường được dùng để lưu trữ những mẩu thông tin trên một trang web. Mục đích của nó thường hướng đến  trình duyệt hoặc bộ máy tìm kiếm hiểu và biết trang tốt hơn.

meta-tag

Là một web developer, chắc hẳn các bạn đã quá quen thuộc với việc sử dụng thẻ meta cho các cấu hình mô tả trang (description) , tác giả (author), hoặc là từ khóa (keyword). Tuy nhiên còn có vài chức năng khác nữa mà có thể các bạn chưa biết, vì thế hôm nay mình xin mạo phép chia sẻ cho các bạn những thuộc tính này.

1 Kiểm soát Browser Cache

Khi bạn viếng thăm một trang web, thường thì trang web đó sau khi được tải xuống sẽ được lưu trữ dưới dạng cache. Tuy nhiên, nếu các bạn không muốn trang web của mình được lưu trữ dưới dạng cache thì các bạn có thể chèn thêm thẻ meta  như sau :

<meta http-equiv="Cache-Control" content="no-store" /> 

Thẻ meta này sẽ được nhận dạng với trình duyệt Firefox, Chrome và Internet Explorer. Với trình duyệt IE các bạn có thể dùng thêm như sau :

<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />

Các bạn cũng có thể chèn thêm thời hạn hết hạn để đảm bảo rằng trình duyệt sẽ hiển thị những file mới nhất từ server chứ không phải từ cache.

<meta http-equiv="expires" content="Fri, 18 Jul 2014 1:00:00 GMT" /> 

2 Cấu hình Cookies

Tương tự như cache, cookies cũng là một dạng lưu trữ thông tin từ website đến máy người dùng (Client). Thường thì cookies sử dụng rất nhiều ở những trang bán hàng. Để ấn định thẻ meta các bạn có thể dùng :

<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Day, DD-MMM-YY HH:MM:SS ZONE">

Giả sử các bạn muốn ấn định thời hạn hết hạn cookies từ máy người dùng vào ngày 31/01/2015 thì có thể sử dụng như sau :

<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Thursday, 01-Jan-2015 00:00:00 GMT">

3 Refreshing Web Pages

Các bạn có thể dùng thẻ meta để ấn định thời gian refresh lại trang, ví dụ sau sẽ ấn định thời gian 5 giây sẽ refresh :

<meta http-equiv="refresh" content="5">

4. Redirecting

Chúng ta vừa ấn định thơi gian để refresh trang , thì lần này là số giây sẽ chuyển sang trang khác.

<meta http-equiv="refresh" content="5; url=http://example.com/">

để chuyển trang ngay lập tức, các bạn chỉ việc ấn định giá trị 0 ở content như sau :

<meta http-equiv="refresh" content="0; url=http://example.com/">

5. Page Transition

Các bạn cũng có thể áp dụng hiệu ứng transition đến trang web của các bạn thông qua thẻ meta theo cách tương tự như PowerPoint với cú pháp như sau :

<meta http-equiv="page-enter" content="revealtrans(duration=seconds,transition=num)" />

hoặc :

<meta http-equiv="page-exit" content="revealtrans(duration=seconds,transition=num)" />
<meta http-equiv="page-enter" content="blendTrans(duration=sec)" />

Các bạn có thể chỉ định thời gian hiệu ứng diễn ra với việc ấn định giá trị duration.

Đó là tất cả những gì mà mình có thể chia sẻ với các bạn trong ngày hôm nay, nếu các bạn có thêm những tính năng nào khác thì chia sẻ cho mình và mọi người biết dưới dạng comments nhé.

Tags: meta tags

Chuyên Mục: HTML5

Bài viết được đăng bởi webmaster

0