Bạn chắc chắn đã nghe nói về làn sóng sắp tới của web di động. Điều phổ biến nhất mà bạn có thể đã nghe là truy cập web di động đang tăng nhanh chóng và khoảng một nửa lưu lượng truy cập web hiện nay là qua điện thoại hoặc máy tính bảng. A Báo cáo 2018 tháng 2 từ Trung tâm nghiên cứu Pew lưu ý rằng 95% của tất cả người Mỹ sở hữu điện thoại di động, trong khi tỷ lệ người Mỹ sử dụng điện thoại thông minh là 77%.

Bạn không cần phải nhìn đâu xa để thấy tác động của điện thoại di động. Nhìn vào hành vi của chính bạn và của gia đình bạn. Vào tháng 2016 năm XNUMX, comScore báo cáo rằng trung bình người Mỹ trên 17 tuổi dành hai giờ 51 phút mỗi ngày trên điện thoại của họ (Englais).

Statcounter.com lưu ý rằng lưu lượng truy cập Web toàn cầu chủ yếu đến từ các thiết bị di động trong ít nhất một năm (51,95% vào tháng 2 2018).

Mặc dù bạn có thể nghĩ rằng bạn không đủ khả năng để phát triển một ứng dụng gốc để người dùng di động của bạn lưu trữ trên điện thoại của họ, nhưng có một giải pháp thay thế tuyệt vời dành cho tất cả các doanh nghiệp: Ứng dụng web tiến bộ. Có thể bạn đã nghe nói về Ứng dụng web tiến bộ (PWA) và cách mọi người sử dụng chúng để phát triển doanh nghiệp của họ. Trong bài viết này, bạn sẽ tìm hiểu thêm một chút về PWA và tại sao bạn nên suy nghĩ nhiều hơn về việc sử dụng chúng vào năm 2018.

Một số định nghĩa

Ứng dụng web tiến bộ (PWA) là tập hợp các tiêu chuẩn web do Google phát triển ban đầu để cải thiện hiệu suất trang web trên thiết bị di động. Do đó, các trang web hoạt động giống như các ứng dụng dành riêng cho thiết bị di động mà bạn có thể tìm thấy trong Apple App Store hoặc Google Play.

Một Định nghĩa các nhà phát triển cho chuỗi khách sạn Ấn Độ Treebo: “PWA là các ứng dụng một trang được cải tiến dần dần với các tính năng mang lại trải nghiệm bản địa sống động hơn. »

Cắt giảm điều đó một chút, PWA trên thiết bị di động cho phép người đọc và khách hàng của bạn tải nhanh trang chủ của trang web của bạn và sử dụng nhiều tính năng tương tự trên thiết bị di động mà một ứng dụng gốc sẽ sử dụng. Trang web của bạn có thể tồn tại bên ngoài trình duyệt, ngay cả khi thiết bị không được kết nối với Internet.

Các định nghĩa khác

Một số phần kỹ thuật chính của PWA bao gồm:

Công nhân dịch vụ là công nghệ quan trọng liên quan đến PWA. Những điều này cho phép PWA hoạt động bên ngoài mạng.

Tệp kê khai chứa biểu tượng và tên liên kết ứng dụng trên thiết bị với Website. Nhà phát triển cũng có thể thêm các yếu tố thiết kế vào đây để nâng cao trải nghiệm khách hàng của bạn.

Push thông báo giao tiếp với người dùng của bạn (với sự cho phép của họ), để họ quay lại.

Một số lý do

Vậy tại sao trang web của bạn nên bao gồm một PWA? Nó khá đơn giản.

Hiệu suất tốt hơn - ngay cả trên máy tính để bàn!

Bạn biết rằng bạn có một thời gian giới hạn để giành được một khách thăm quan lần đầu tiên – sáu giây tải trước khi khách hàng tiềm năng rời đi và truy cập trang web tiếp theo trên kết quả tìm kiếm. Người dùng di động thậm chí còn thiếu kiên nhẫn hơn – một nửa số người dùng tiềm năng của bạn sẽ rời đi nếu trang web mất hơn 3 giây để tải!

Tin tốt: những thay đổi bạn thực hiện để tạo một ứng dụng web tiến bộ sẽ tăng tốc trang web của bạn!

Ví dụ: Công ty khách sạn Ấn Độ Treebo đã giảm thời gian sạc điện thoại di động của họ từ sáu giây xuống còn 1,5 giây bằng cách tạo PWA của họ. Trang web hiện tải trên máy tính để bàn trong giây lát! Nhóm công nghệ của họ đã báo cáo rằng thứ hạng tìm kiếm của trang web đã được cải thiện và tỷ lệ chuyển đổi hàng tháng đã tăng hơn gấp đôi!

Dung lượng ngoại tuyến

PWA không cần phải có trên Internet để làm như vậy. Người dùng của bạn có thể truy cập tất cả nội dung của ứng dụng từ thiết bị hoặc máy tính để bàn của họ.

Trên thực tế, một trong những điều tuyệt vời nhất về PWA là khách hàng của bạn có thể lưu trang web vào trang chủ của thiết bị của họ và sử dụng nó sau này để mua sản phẩm của bạn hoặc lấy thêm thông tin. .

Mệnh dụ, CNET Tech hôm nay cung cấp bản tóm tắt hàng ngày về các tin tức liên quan đến công nghệ, vốn là bánh hàng ngày của trang web. Nếu bạn mở trang web bằng Google Chrome trên thiết bị Android và cuộn xuống cuối màn hình, bạn sẽ thấy điều này:

Thêm PWA vào màn hình chính di động. Không có cửa hàng ứng dụng cần thiết!
Thêm PWA vào màn hình chính di động. Không cần cửa hàng ứng dụng!

Báo chí Thêm vào màn hình chính để tải ứng dụng web tiến bộ Tech Today xuống thiết bị của bạn. Nhấn vào biểu tượng để tải 10 câu chuyện hiện tại hàng đầu. Vuốt sang trái để đọc từng câu chuyện. Nhấn vào biểu trưng CNET để mở trang chủ CNET trong trình duyệt của bạn.

Remarque : Trên Firefox, các trang web có PWA có biểu tượng “Thêm vào trang chủ” (dấu cộng trong ô nhỏ) ngay trên thanh địa chỉ. Nếu PWA đã được cài đặt, logo Android trên thanh địa chỉ sẽ đưa bạn đến PWA.

Một thứ mà trang web của bạn không cần: Các tiện ích "Tải xuống ứng dụng của chúng tôi" chiếm dung lượng trên trang của bạn (thường có biểu tượng iTunes và Android khiến người dùng mất tập trung). Nếu Chrome nhận thấy rằng một người dùng đã mở trang PWA của bạn vài lần một tuần, Chrome sẽ nhắc bạn thêm PWA của mình. Cập nhật cũng tự động.

Không cần ngôn ngữ lập trình phức tạp

Bạn có thể đã cân nhắc việc xây dựng một ứng dụng dành cho thiết bị di động gốc cho doanh nghiệp của mình, nhưng nhận thấy rằng việc xây dựng một ứng dụng dành cho thiết bị di động là một động vật khác với việc xây dựng một Website. Nếu bạn đang làm việc với một đại lý thiết kế / phát triển web để duy trì trang web của mình, họ sẽ không nhất thiết phải có kỹ năng xây dựng ứng dụng cho các nhà cung cấp thiết bị di động chính thống.

Để phần mềm của bạn hiển thị trong Apple App Store, các nhà phát triển của bạn phải đăng ký với Mạng nhà phát triển Apple, sử dụng Công cụ dành cho nhà phát triển Apple (chỉ hoạt động trên Mac) và biết ngôn ngữ của Lập trình được Apple phê duyệt: Swift hoặc Objective C.

Lập trình cho Android dễ dàng hơn một chút (không cần sự chấp thuận của nhà phát triển), nhưng phần lớn các ứng dụng Android được viết bằng Java, đây có thể là một ngôn ngữ khó học.

Để ứng dụng xuất hiện trong các cửa hàng trực tuyến của Apple hoặc Android, ứng dụng đã hoàn thiện phải được sự chấp thuận của người quản lý cửa hàng tương ứng.

Ngược lại, các ứng dụng web tiến bộ được xây dựng bằng các ngôn ngữ web phổ biến: HTML, CSS (Cascading Style Sheets) và JavaScript. Nói tóm lại, ngay cả những nhà phát triển web mới cũng có thể xây dựng PWA chất lượng cao.

Cụ thể, bạn không cần phải có nhiều kiến ​​thức về máy tính để thực hiện PWA cho trang web WordPress của mình. Nếu bạn đã thay đổi định dạng trang web của mình bằng chủ đề con, bạn cũng có thể tạo tệp PWA. Chúng tôi sẽ đề cập đến các vấn đề mã hóa trong một bài viết khác.

Tăng sự hỗ trợ của những người khổng lồ công nghệ

Tiêu chuẩn mất nhiều thời gian để trở thành tiêu chuẩn. Google lần đầu tiên quảng cáo PWA vào năm 2015.

Trong một thời gian dài, Chrome là trình duyệt duy nhất hỗ trợ PWA, nhưng điều đó sắp thay đổi. Trong những tháng gần đây:

  • Mozilla đã thêm hỗ trợ PWA trong Firefox 58
  • Apple gần đây đã công bố hỗ trợ cho các ứng dụng Web trong iOS
  • Microsoft sẽ hỗ trợ PWA trong phiên bản Windows 10 tiếp theo, phiên bản này sẽ ra mắt vào cuối năm nay (2018).

Vượt xa các nhà cung cấp hệ điều hành khác, Microsoft cho biết PWA “chất lượng cao” sẽ sớm được tích hợp vào kho ứng dụng Windows 10 trên điện thoại di động và máy tính để bàn.

WordPress và PWAs

WordPress chưa hỗ trợ đầy đủ việc xây dựng các ứng dụng web tiến bộ trong ứng dụng cơ sở. Nhóm Jetpack cam kết bổ sung chức năng PWA trong năm tới. Điều này được hỗ trợ bởi Javascript-ification của WordPress.

Jetpack "Từng bước giới thiệu các tính năng PWA ngay khi chúng sẵn sàng", Nhà phát triển cho biết Dan Walmsley trong một bài báo trên blog WordPress VIP . Các nhà phát triển có thể thêm tệp kê khai bằng cách sử dụng mô-đun tệp kê khai của Jetpack kể từ phiên bản 5.6.0 và họ đã giới thiệu tính năng tải hình ảnh liên tục, giúp tải trang web nhanh hơn ngay cả khi có nhiều hình ảnh trên đó. trang. Nhiều tính năng sẽ đến trong năm nay.

Một số plugin tìm cách thêm chức năng PWA, nhưng chưa được chấp nhận nhiều.

  • Công cụ Tối ưu hóa WordPress cung cấp một công cụ làm việc và kê khai.
  • Ứng dụng web Super Progressive tạo một bản kê khai và một nút Thêm vào màn hình chính, trong số các tính năng khác.
  • Gói di động WordPress cũng bổ sung các tính năng PWA

Bạn sẽ sử dụng PWA như thế nào?

Trong hướng dẫn này, bạn đã tìm hiểu một chút về Ứng dụng web lũy tiến và lý do bạn nên thêm một ứng dụng này vào Website của công ty bạn:

  • Làn sóng lưu lượng truy cập thiết bị di động ngày càng tăng
  • Hiệu suất tốt hơn cho trang web của bạn - thiết bị di động và máy tính để bàn
  • Khả dụng ngay cả khi thiết bị ngoại tuyến
  • Sử dụng các tính năng web tiêu chuẩn: HTML, CSS và Javascript. Rẻ hơn để xây dựng
  • Tăng cường hỗ trợ cho các trình duyệt và hệ điều hành

Có thể bây giờ bạn muốn biết cách thực hiện PWA trong WordPress? Hoặc chỉ cho các nhà phát triển của bạn cách làm điều đó? Đây sẽ là chủ đề của một hướng dẫn khác.