Thủ thuật wordpress

HTML5 là gì và những thay đổi mới của HTML5

HTML5 là gì? Cùng với CSS3 là 2 chương trình mới nhất cho việc thiết kế Web. Các tính năng video của HTML5 – cho phép đơn giản hoá việc thêm một video vào trang Web – đã được nhận được nhiều sự chú ý, không những thế HTML5 còn có nhiều tính năng làm nó trở nên tuyệt vời đối với người sử dụng cũng như các nhà phát triển Web.
html5 la gi va nhung thay doi cua html5 hinh anh 2

HTML5 là gì?

HTML5 là sự phát triển mạnh mẽ đột biến của HTML, viết tắt của cụm từ Hyper Text Markup Language. Đây là hình thức định dạng cốt lõi của hầu hết các website trên internet. HTML5 với phiên bản đầu tiên được hình thành trong năm 2008 nhưng mãi tới năm 2011 mới chính thức được ra mắt với một ánh hào nhoáng của công nghệ hiện đại. Tuy nhiên, trong thời điểm đó rất nhiều trình duyệt chưa kịp thay đổi để hỗ trợ nó. Đến ngày nay, hầu hết các trình duyệt phổ biến như Chrome, Safari, Firefox, Opera, IE đều hỗ trợ HTML5. Điều đó đã tạo ra một cuộc cách mạng lớn cho nền công nghệ web.
Cùng với CSS3, HTML5 vẫn tiếp tục được phát triển. W3C đang thêm vào đó nhiều tính năng hơn nữa.
HTML5 là sự kế thừa của HTML 4.01, được phát hành đầu tiên vào năm 1999. Việc tạo ra một ngôn ngữ mới dựa theo các tiêu chuẩn như:

  • Các tính năng mới phải dựa trên HTML, CSS, DOM, và JavaScript
  • Làm giảm nhu cầu cho các plugins bên ngoài (như Flash)
  • Xử lý lỗi tốt hơn
  • Đánh dấu để thay thế kịch bản
  • HTML5 nên phát triển cho các thiết bị độc lập
  • Quá trình phát triển nên được công khai nhằm cho các tổ chức khác có thể lấy làm cơ sở phát triển.

Những thay đổi mới

Với HTML5, quá trình mã hóa trở nên dễ dàng và hợp lý hơn. Các tính năng độc đáo và ấn tượng của HTML5 không những có trong tiến trình sử lý đa phương tiện như <video>, <audio>,<canvas> mà còn tích hợp các nội dung đồ họa vector (những gì chúng ta biết trước đây chính là thẻ <object>). Điều này có nghĩa rằng media và vector trên website được xử lý và thực hiện dễ dàng hơn, nhanh hơn mà ko cần phải bổ sung bất kì phần mềm liên quan hoặc thư viện API nào khác.
Có rất rất nhiều thẻ mới được thêm vào, nhưng dưới đây, tôi sẽ chỉ mô tả một số thẻ quan trọng nhất. Phần còn lại các bạn có thể tìm thấy trong phần HTML5 của W3C.

  • <article> thẻ này định nghĩa một bài viết hoặc bình luận của người dùng. Nó độc lập với content của website.
  • <aside> thẻ này đánh dấu nội dung bên cạnh của trang hiện tại. Ví dụ như một slidebar.
  • <header><footer> hai thẻ này giúp bạn không cần định nghĩa id cho tiêu đề và cuối trang.
  • <nav> thẻ này định nghĩa phần menu điều hướng cho website.
  • <section> đây là một thẻ quan trọng, nó giúp bạn xác định các thành phần khác nhau trong website. Bạn có thể gộp chung các div cùng nội dung vào trong thẻ này để dễ dàng quản lý.
  • <audio>, <video> hai thẻ này giúp bạn hiển thị một đoạn phim hoặc một bài hát trên website đơn giản hơn rất nhiều.
  • <embed> thẻ này xác định một container các plugin tương tác với ứng dụng bên ngoài.
  • <canvas> thẻ thú vị này cho phép bạn vẽ đồ họa mà không cần phải qua bất kì đoạn mã hỗ trợ nào (chủ yếu là javascript).

Một điều quan trọng mà các bạn nên lưu ý là các thẻ mới của HTML5 không chỉ được sử dụng 1 lần. Ví dụ, header và footer sẽ không chỉ đánh dấu sự bắt đầu và kết thúc của một trang mà có thể là một phần nội dung nào đó. Điều này có nghĩa, hai thẻ này có khả năng được sử dụng nhiều lần trong toàn bộ trang. Bạn có thể xem trong hình minh họa dưới đây:
html5 la gi va nhung thay doi cua html5 hinh anh 1
Trong ví dụ mẫu trên, các bạn có thể thấy cấu trúc cơ bản của một website sử dụng HTML5. Vâng, các bạn thấy khai báo DOCTYPE vô cùng đơn giản. Tôi nhớ trong thời gian trước, để khai báo phần mở đầu <html lang=”en”> v.v.. rất khó để nhớ, tôi đều phải tìm kiếm trên internet hoặc copy từ website này sang website khác. Nó quả là một sự rút ngắn tuyệt vời.
Các thẻ sau đây của HTML4.01 bị loại bỏ trong HTML5

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>

Các trình duyệt không hỗ trợ các thẻ này. Chính vì vậy, nếu bạn là một người phát triển website thì đây là lúc bạn kiểm tra, loại bỏ và thay thế chúng trên các dự án đã hoàn thành.