Ứng dụng HTML5 tốt nhất

Nếu bạn muốn xây dựng các ứng dụng web, bạn có thể muốn nghĩ đến việc sử dụng HTML5. HTML5 là điểm nóng mới khi phát triển ứng dụng và nó có khả năng thay đổi cách tạo và bán phần mềm. Nó cũng kích hoạt hàng triệu người ngoài kia, những người biết cách tạo trang web và không bao giờ nghĩ rằng bộ kỹ năng của họ có thể được sử dụng cho mục đích khác. Nhưng trước khi bắt tay vào phát triển, có một số điều bạn nên biết về HTML5. Trong hướng dẫn này, tôi sẽ dạy bạn những điều cơ bản

HTML5 là gì?

HTML5 là một thông số kỹ thuật của W3C trong quá trình sản xuất

Nó bắt đầu tại WHATWG và là tiêu chuẩn vàng trong tương lai cho HTML. Nếu bạn đã sử dụng được một thời gian, nhiều người sẽ biết rằng XHTML 2 là phiên bản chính tiếp theo, nhưng phiên bản đó đã thất bại. Các lý do rất đa dạng, nhưng một điểm gây tranh cãi chính là rất ít trang web sử dụng cú pháp hoàn hảo và XHTML 2 sẽ thực thi cú pháp hoàn hảo. Cũng rất khó để nói chính xác cú pháp hoàn hảo là gì. Khi các nhà cung cấp trình duyệt nhận ra rằng việc chuyển sang XHTML 2 sẽ khó đến mức nào, mọi thứ đã đổ vỡ

Vào thời điểm đó, một nhóm người đã rời khỏi W3C và bắt đầu WHATWG. Những người này muốn suy nghĩ lại không chỉ HTML, mà toàn bộ quy trình tạo tiêu chuẩn. Họ bắt đầu làm việc trên một tiêu chuẩn HTML5 mới. Họ hoạt động dựa trên nguyên tắc rằng không có gì hoàn hảo và nhiệm vụ của họ không phải là nói cho cả thế giới biết cách làm HTML. Thay vào đó, họ tập trung vào việc xem xét những gì đang xảy ra trong thế giới thực của HTML

Họ cũng dành thời gian để hệ thống hóa một số quy ước xuất hiện trong cộng đồng. Đó là nơi rất nhiều phần tử mới trong thông số kỹ thuật HTML5 (như thanh tiến trình, video và thẻ âm thanh) đến từ đó. Mọi người đã đến hạn và họ chỉ muốn tạo ra những phần đánh dấu cụ thể để giúp mọi người làm những gì họ đã và đang làm

Bên cạnh việc chỉ đánh dấu, WHATWG đã bắt đầu tạo một số API JavaScript mới. Đây là nơi HTML5 bắt đầu trông giống như “ứng dụng”. Họ đã tạo ra các tiêu chuẩn để lưu trữ dữ liệu ngoại tuyến và bộ nhớ đệm ứng dụng ngoại tuyến để toàn bộ ứng dụng có thể được lưu trữ ngoại tuyến. Họ cũng bắt đầu các nhóm làm việc mới xung quanh các tiện ích và quyền truy cập thiết bị (để sử dụng các thiết bị như máy ảnh và máy đo gia tốc)

Một lưu ý phụ thú vị cho toàn bộ quá trình tiêu chuẩn là điều này. trong một thời gian, sự khác biệt trong các công cụ kết xuất lớn đến mức một cách tiếp cận để tuân thủ nhiều trình duyệt là đánh hơi xem người dùng đang sử dụng trình duyệt nào và cung cấp trải nghiệm khác dựa trên trình duyệt đó

WHATWG và những người khác luôn nghĩ rằng việc đánh hơi trình duyệt không phải là một ý tưởng hay. Những gì thường được khuyến nghị bây giờ là tăng cường dần dần. Tóm lại, tăng cường tiến bộ là điều này. Thay vì chỉ quyết định rằng một trình duyệt sẽ nhận được trải nghiệm Y và một trình duyệt khác sẽ nhận được trải nghiệm Z, tại sao không phát hiện hỗ trợ tính năng nâng cao và xây dựng trải nghiệm tuyệt vời?

Thông số kỹ thuật được đánh số cuối cùng

Điều này dẫn đến một điểm khác về thông số HTML5. nó có thể sẽ là thông số kỹ thuật được đánh số cuối cùng. Trong tương lai, thay vì cải tiến các phiên bản HTML, như HTML6, W3C sẽ chỉ duy trì phiên bản HTML mới nhất và sẽ có một thông số tiêu chuẩn vàng. Các nhà phát triển web có thể sử dụng tính năng nâng cao lũy tiến để xử lý sự phân mảnh trong khi chờ các nhà cung cấp trình duyệt bắt kịp thông số kỹ thuật

Vậy Ứng dụng HTML5 là gì?

Với HTML5 được xác định, ứng dụng HTML5 là gì?

Về cơ bản, ứng dụng HTML5 sử dụng tất cả các phần mới, sáng bóng của bản nháp HTML5 để tạo trải nghiệm giống như ứng dụng

Điều này có nghĩa là lưu trữ dữ liệu ngoại tuyến, có chức năng và hoạt động như một ứng dụng thực sự thay vì chỉ là nội dung để xem xét. Hiện tại, bạn có thể sử dụng các ứng dụng web, chẳng hạn như Gmail. Gmail thực sự có phiên bản HTML5;

---

Tại sao tôi nên sử dụng HTML5?

Tại sao tôi muốn sử dụng HTML5 thay vì Objective-C, Flash, Silverlight hoặc một số loại môi trường dành riêng cho thiết bị khác?

1. Nếu tôi đang tạo trò chơi bắn súng 3D mới nhất, hay nhất, tôi sẽ không sử dụng HTML5. Nó chỉ không có thư viện đồ họa phong phú cần thiết để tạo ra những trò chơi cường độ cao như vậy;
2. Nếu bạn cần sử dụng máy ảnh trên thiết bị hoặc hệ thống tệp cục bộ, HTML5 sẽ không phải là lựa chọn tốt nhất. Có những cách giải quyết khác, sử dụng trình bao bọc gốc, mà tôi sẽ thảo luận ngay sau đây và cũng có một số tiêu chuẩn sắp tới sẽ giúp giải quyết vấn đề đó

Mặc dù có những trường hợp cụ thể không sử dụng HTML5, nhiều ứng dụng được sản xuất ngày nay cho iOS và Android có thể hoạt động dễ dàng trong HTML5. Bên cạnh việc có thể làm điều đó về mặt kỹ thuật, còn có những lý do chính đáng khác để sử dụng HTML5

Bạn đã biết cách sử dụng nó

Ngay bây giờ, nếu bạn là nhà phát triển web, bạn có tất cả các công cụ cần thiết để tham gia vào lĩnh vực này. Phát triển ứng dụng HTML5 chỉ hơn một chút so với việc thay đổi cách bạn nghĩ về các trang web. Trong một số trường hợp, bạn có thể chỉ cần thêm một vài dòng vào HTML của mình và thêm một số nội dung trên máy chủ của mình và bạn sẽ có một ứng dụng HTML5 ngoại tuyến đầy đủ, đang hoạt động

Chúng ta càng làm việc với các tiêu chuẩn, chúng càng trở nên hữu ích hơn

Bên cạnh đó, các nhà phát triển web đã hiểu các vấn đề về trình duyệt chéo. Mặc dù sẽ có nhiều vấn đề về trình duyệt chéo hơn bao giờ hết, nhưng các nhà phát triển web có lợi thế khác biệt so với các loại nhà phát triển khác, vì họ đã có sẵn điều này trong túi của mình. Phần khác của phát triển trình duyệt chéo là các tiêu chuẩn. Chúng ta càng làm việc với các tiêu chuẩn, chúng càng trở nên hữu ích hơn. Các nhà phát triển web đã dẫn đầu về một số khía cạnh và giờ đây nó đang được đền đáp. Thay vì phải tìm hiểu toàn bộ tiện ích bổ sung không tuân theo tiêu chuẩn khác, bạn có thể chỉ cần dựa vào những gì các cơ quan tiêu chuẩn đang hướng tới

Cuối cùng, khi viết mã, có thể khó nhận ra rằng bạn cũng có thể đang làm điều gì đó mang tính chính trị.

Khi bạn nhìn vào cách một nhà sản xuất thiết bị cầm tay tự xử lý và cách họ chọn khóa các nhà phát triển của mình, bằng cách chọn hoạt động bên ngoài hệ thống đó, bạn đang ủng hộ khái niệm tự do

Đó là một khái niệm nhỏ, nhưng nó quan trọng, bởi vì về lâu dài, chúng tôi muốn các nhà phát triển thiết bị cầm tay của mình cởi mở và để chúng tôi tấn công họ bao nhiêu tùy thích

---

Làm cách nào tôi có thể sử dụng HTML5?

Thực ra sử dụng HTML5 không khó lắm. Nó có thể bao gồm từ một vài dòng mã, đến viết một ứng dụng hoàn toàn mới. Dưới đây là một vài cách để bắt đầu

---

1. Tạo trang web thân thiện với thiết bị di động

Nhiều trang web chỉ cần một vài chỉnh sửa để có trải nghiệm di động thân thiện hơn. Điều đầu tiên cần làm là hãy nhìn vào khung nhìn

1

2

3

4

Thẻ meta chế độ xem chưa phải là một tiêu chuẩn, nhưng nó là một quy ước được chấp nhận rộng rãi. Nhiều trình duyệt di động sử dụng thẻ này để thiết lập các khía cạnh nhất định của kết xuất trang web

Thông tin thêm về chế độ xem, xem tài liệu sau

• Tài liệu Apple
• Fennec. Firefox di động

Ngoài chế độ xem, hãy đảm bảo rằng các trang web của bạn linh hoạt; . Thiết bị di động có đủ hình dạng và kích cỡ, giống như cửa sổ trình duyệt. Thiết kế với ý tưởng linh hoạt sẽ tự động làm cho các trang web của bạn thân thiện với thiết bị di động hơn

Loại tài liệu

Một mẩu tin nhỏ tuyệt vời về phiên bản tiếp theo của HTML5 là đây. loại tài liệu đã đi theo con đường của dodo. Nó vẫn phải ở đó, vì nhiều lý do, nhưng nó đã bị teo lại gần như không còn ý nghĩa gì nữa

1

Điều này thật tuyệt. Chúng ta không còn phải sao chép và dán một chuỗi văn bản dài, bởi vì dù sao thì ai có thể nhớ được điều đó?

---

2. Đặt trang web của bạn ở chế độ ngoại tuyến

Một số trình duyệt hiện triển khai bộ đệm ứng dụng. Bộ đệm ứng dụng cho phép bạn báo trước cho trình duyệt biết trang web sẽ cần những tài nguyên nào khi ngoại tuyến. Sau đó, trình duyệt sẽ tải xuống các tệp đó để sử dụng ngoại tuyến. Khi máy khách ngoại tuyến, trình duyệt sẽ đề cập đến các tài nguyên được lưu trong bộ nhớ cache đó

Tuy nhiên, bộ đệm của ứng dụng không phải là thứ mà bạn có thể làm chỉ bằng cách thay đổi đánh dấu của mình. Bạn sẽ cần khả năng thay đổi tiêu đề kiểu nội dung trên máy chủ. Để làm điều đó trong Apache, bạn có thể đặt tệp này vào tệp cấu hình hoặc trong tệp. tập tin htaccess

1

1

Khi bạn làm điều đó, bạn có thể thêm đánh dấu sau vào thành phần

3

0 trong trang web của mình. Bạn có thể gọi tệp kê khai của mình theo bất kỳ thứ gì bạn muốn, nhưng hãy đảm bảo rằng tệp kê khai nằm ở thư mục gốc của trang web của bạn và tệp kết thúc bằng dấu. rõ ràng

1

3

Sau đó, bạn có thể tạo tệp kê khai của mình. Chỉ cần liệt kê tất cả các phần bạn sẽ cần khi ngoại tuyến. Bạn không thể đặt các tệp tên miền chéo ở đây và bạn sẽ không muốn liệt kê bất kỳ thứ gì thường xuyên thay đổi. Đây là một tệp kê khai ví dụ

1

5

2

3

8

4

2

0

2

1

2

2

2

3

2

4

2

5

2

6

2

7

Khi bạn đã thiết lập tất cả điều này, hãy kiểm tra nó trong trình duyệt hỗ trợ bộ đệm của ứng dụng

Nếu bạn cần cập nhật tài nguyên, chỉ cần thay đổi tệp kê khai. Ngay cả việc thêm một bình luận sẽ nhắc trình duyệt cập nhật bộ đệm của ứng dụng

Bộ đệm ứng dụng nổi tiếng là khó gỡ lỗi. có một số phương pháp tốt để kiểm tra trạng thái bộ đệm ứng dụng của bạn

---

3. Làm cho video của bạn có thể truy cập được ở mọi nơi

Nếu bạn lưu trữ nội dung video trên trang web của mình và sử dụng trình phát flash để phát nội dung đó, thì bạn đang bỏ lỡ cơ hội hiển thị video cho những người sử dụng thiết bị iOS và điện thoại không hỗ trợ flash (hầu hết các điện thoại)

HTML5 có hai thẻ mới giúp hiển thị đa phương tiện dễ dàng hơn.

3

1 và

3

2. Đây là một ví dụ về thẻ

3

2

1

2

9

Bây giờ, nếu bạn muốn hỗ trợ nhiều trình duyệt nhất có thể, bạn sẽ cần mã hóa nội dung của mình ở một vài định dạng khác nhau. Sau đó, liệt kê chúng như vậy

1

1

2

3

3

5

4

7

2

0

9

Điều này đảm bảo rằng nội dung của bạn có thể được xem trong Firefox, Safari, Chrome và điện thoại di động. Cuối cùng, đối với các trình duyệt không hỗ trợ thẻ

3

2, bạn vẫn có thể sử dụng flash player. Khi trình duyệt không hỗ trợ thẻ, nó thường sẽ không xử lý nó và tiếp tục lặp lại cho đến khi tìm thấy thẻ mà nó biết. Theo cách này, nếu bạn đặt

3

5 hoặc

3

6 bên trong thẻ

3

2, một trình duyệt như IE sẽ sử dụng

3

6. Tuy nhiên, trình duyệt hỗ trợ thẻ

3

2 sẽ bỏ qua flash nhúng

---

Phần kết luận. Bắt đầu sử dụng thẻ HTML5 ngay hôm nay

Các thẻ như đầu trang, chân trang, điều hướng, sang một bên, bài viết và phần rất hay vì chúng có ngữ nghĩa. Họ thông báo cho người tiêu dùng trang web một chút về ý định của bạn đối với nội dung của bạn. Thật tuyệt khi sử dụng chúng. Trong tương lai, chúng sẽ hữu ích hơn hiện tại, nhưng không gì có thể ngăn cản bạn sử dụng chúng ngay hôm nay

Một số trình duyệt như IE sẽ “lăn tăn” nếu bạn sử dụng các thẻ mới này, nhưng đừng lo. IE không hỗ trợ thêm các loại thẻ vào DOM, bạn chỉ cần thông báo cho IE về chúng. Để khắc phục điều này, Remy Sharp đã tạo HTML5 Shiv. Nếu bạn đưa phần này vào phần đầu trang web của mình, trong một nhận xét có điều kiện của IE, thì trang của bạn sẽ hiển thị tốt

Bây giờ bạn đang sử dụng HTML hữu ích về mặt ngữ nghĩa

---

Tiền thưởng. Bán ứng dụng của bạn trong App Store

Có, ngay bây giờ, bạn có thể lấy các ứng dụng HTML5 của mình và bán chúng trên các cửa hàng ứng dụng dành cho thiết bị di động. Hai dự án đang giúp mọi người phát triển các ứng dụng dành cho thiết bị di động “gốc”, không sử dụng gì ngoài HTML, JavaScript và CSS. Kiểm tra những điều này

• Khoảng cách điện thoại
• titan

Ngoài ra, CodeCanyon rất riêng của chúng tôi, trong tháng tới, sẽ ra mắt một danh mục mới cho các ứng dụng HTML5. Trong danh mục này, chúng tôi sẽ bán mọi thứ từ trình phát video nâng cao và tùy chỉnh, đến thư viện, đến ứng dụng thuyết trình

Để chuẩn bị cho hạng mục này, chúng tôi đã phát động một cuộc thi với giải thưởng trị giá $7000. Bạn còn hai tuần để tham gia, nếu điều đó khiến bạn quan tâm

---

kết thúc

Không gì có thể ngăn cản bạn khám phá HTML5 và nếu bạn muốn dẫn đầu cuộc chơi, bạn nên xây dựng các ứng dụng HTML5 ngay bây giờ. Cảm ơn vì đã đọc

Tôi có thể tạo ứng dụng bằng HTML5 không?

HTML5 đã lỗi thời?

HTML5 có tốt hơn Java không?

Tôi có thể sử dụng HTML5 ở đâu?