Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 42 trang
THÔNG TIN TÀI LIỆU
Thông tin cơ bản
Định dạng
Số trang
42
Dung lượng
2,22 MB
Nội dung
Thuyết trình HTML5
Nhóm : 11
GVHD: Phạm Đình Sắc
SVTH : Phạm Văn Ngọc – Trần Thế Quỳnh
Phân công :
Phạm Văn Ngọc – Trần Thế Quỳnh
Lịch sử phát triển công nghệ web
Những ưu điểm của HTML5
Giảm bớt sự phụ thuộc những công nghệ ứng dụng độc quyền.
Tốc độ truy cập web nhanh hơn
Tài nguyên phong phú hơn
Các ứng dụng web và các trang web hấp dẫn hơn.
Những hạn chế của HTML5
Quá ít trình duyệt hỗ trợ
Ngôn ngữ lập trình mới
Tốn chi phí nâng cấp từ HTML lên HTML5
Các Thành Phần Mới Của HTML5
Những Điểm Nổi Bật Của HTML5
HTML5 phát triển các phần tử ngữ nghĩa mới. Cải tiến biểu mẫu Web. một số trong đó được triển khai thực hiện
bằng cách sử dụng phần tử <input>
HTML5 cung cấp phần tử <canvas> và các JavaScript API vẽ 2D mới quan trọng mà bạn có thể sử dụng để tạo hình
dạng, văn bản, các hình ảnh động, các chuyển cảnh, và nhiều hơn nữa.
Ngoài ra còn có các phần tử <audio> và <video> mới dự kiến thay thế sự phụ thuộc hiện tại của trang Web vào
Flash như một nền tảng phân phối đa phương tiện.
!"
#$%&
'()
HTML5 Xu Hướng Thiết Kế Mới
*
HTML5 Xu Hướng Thiết Kế Mới
<header> Định nghĩa khu vực đầu trang web.
<footer> Định nghĩa khu vực cuối trang web.
<nav> Định nghĩa khu vực link danh mục.
<aside> Định nghĩa khu vực bên ngoài nội
dung chính (thường là sidebar).
<section> Định nghĩa một khu vực (vùng bao).
Tương tự thẻ <div>.
<article> Định nghĩa một bài viết
HTML5
Xu
Hướng
Thiết Kế Mới
Một số thẻ mới
của HTML5
[...]... nhiều ứng dụng phần mềm phương tiện không hỗ trợ nó Trần Thế Quỳnh 0973 556 107 25 Ứng Dụng Media Trên HTML5 HTML5 cho phép dễ dàng xem video trực tiếp ngay trong trình duyệt mà không cần cài đặt thêm plug-in Với ứng dụng Easy HTML5 Video, người dùng có thể tiến hành chuyển đổi các video hỗ trợ định dạng HTML5, bao gồm WebM, MP4 và các định dạng OGG Trần Thế Quỳnh 0973 556 107 26 Tag Trần Thế... JavaFX HTML5 nhằm mục đích lấp đầy một số các khoảng trống do phiên bản trước của nó để lại trong lĩnh vực này bằng cách cung cấp toàn bộ các kiểu đầu vào khác nhau của biểu mẫu mới: Trần Thế Quỳnh 0973 556 107 15 HTML5 Bộ Mặt Mới Cho Các Biểu Mẫu Web datetime (ngày giờ) datetime-local (ngày giờ địa phương) month (tháng) time (thời gian) week (tuần) Trần Thế Quỳnh 0973 556 107 16 HTML5 Bộ... video và âm thanh Trần Thế Quỳnh 0973 556 107 23 Ứng Dụng Media Trên HTML5 Tuy nhiên, HTML5 bao gồm cả sự hỗ trợ cho hai phần tử mới, và , cho phép các nhà phát triển Web bao gồm các nội dung đa phương tiện mà không cần người dùng cài đặt các trình cắm thêm của trình duyệt Trần Thế Quỳnh 0973 556 107 24 Ứng Dụng Media Trên HTML5 Tuy nhiên, một vấn đề quan trọng với các phần tử đa phương... tra) radio (nút tròn) file (tệp) image (hình ảnh) Trần Thế Quỳnh 0973 556 107 13 HTML5 Bộ Mặt Mới Cho Các Biểu Mẫu Web password (mật khẩu) reset (thiết lập lại) submit (trình lên) text (văn bản) Trần Thế Quỳnh 0973 556 107 14 HTML5 Bộ Mặt Mới Cho Các Biểu Mẫu Web Ngoài ra, có một số các phần tử mới được HTML5 hỗ trợ, sử dụng trong các biểu mẫu web giúp tạo ra được tính thẩm mỹ và tiện lợi.. .HTML5 Xu Hướng Thiết Kế Mới Trần Thế Quỳnh 0973 556 107 11 Các Cải Tiến Về Biểu Mẫu Web Trần Thế Quỳnh 0973 556 107 12 HTML5 Bộ Mặt Mới Cho Các Biểu Mẫu Web Nếu bạn đã tạo các ứng dụng Web từ trước, bạn có khả năng quen hơn với tập các nút điều khiển biểu mẫu... Web đơn giản Trần Thế Quỳnh 0973 556 107 20 Demo Một Số Kiểu Type Mới Của Biểu mẫu Web đơn giản Trần Thế Quỳnh 0973 556 107 21 Ứng Dụng Media Trần Thế Quỳnh 0973 556 107 22 Ứng Dụng Media Trên HTML5 Trong những năm gần đây, tính phổ biến của các trang Web chia sẻ video như YouTube và các nền tảng phân phối nội dung như Hulu đã chứng kiến một sự bùng nổ to lớn trong việc sử dụng Web để tạo... HTML Tag Trần Thế Quỳnh 0973 556 107 Hiển Thị Trên Trình Duyệt 30 Canvas Trần Thế Quỳnh 0973 556 107 31 Canvas Sẽ Thổi Bay Flash Trong Tương Lai là một phần tử mới xuất hiện trong HTML5 và rất hữu ích trong việc vẽ đồ họa trên nền web Nó lần đầu được giới thiệu bởi Apple, sau đó được ứng dụng nhiều vào trong trình duyệt Safari và bây giờ các trình duyệt phổ biến cũng đã hỗ trợ ... hai điều: 1 2 Tạo một thẻ canvas trong HTML (trang giấy) của bạn dùng để vẽ Dùng JavaScript để vẽ (có giấy mà không có bút thì vẽ bằng gì ?) Thẻ canvas là một thẻ đơn giản, nó không có bất cứ một dữ liệu nào, bạn cần chỉ định cho browser biết kích thướt chiều rộng và cao Nếu trình duyệt không hổ trợ thẻ canvas thì bạn hãy cho một dòng chữ chỉ định trình duyệt hiện tại không hổ trợ thẻ canvas: ... Your browser doesn't support canvas. Trần Thế Quỳnh 0973 556 107 35 Bắt Đầu Với Canvas Chúng ta đã có canvas HTML, tiếp theo là khởi tạo JavaScript: var drawingCanvas = document.getElementById('myDrawing'); // kiểm tra trình duyệt có support Canvas hay không if(drawingCanvas.getContext) { // khởi tạo 2-dimensional (2 chiều) var context = drawingCanvas.getContext('2d'); . HTML5
Các Thành Phần Mới Của HTML5
Những Điểm Nổi Bật Của HTML5
HTML5 phát triển các phần tử ngữ nghĩa mới viết
HTML5
Xu
Hướng
Thiết Kế Mới
Một số thẻ mới
của HTML5
HTML5
Xu
Hướng
Thiết Kế Mới
Các