Điểm mặt Top 6 vấn đề về khả năng tương thích của trình duyệt Safari

.Trong bài viết này, chúng ta sẽ cùng thảo luận về một số vấn đề tương thích mà các web developer và tester có thể gặp phải khi kiểm tra hiệu suất ứng dụng của họ trên trình duyệt Safari.

• Lập trình UI UX là gì? Tại sao phải học lập trình UI UX?
• UX do AI điều khiển: Tiềm năng thiết kế và đổi mới trải nghiệm người dùng
• Tương lai của phát triển web: Chiến lược ưu tiên thiết bị di động
• PWA là gì? Giải thích về ứng dụng web lũy tiến trong thương mại điện tử
• Tại sao mọi Developer cần học UX?

Safari là trình duyệt web do Apple cung cấp, chiếm thị phần 19,40%  trên toàn cầu. Nó được coi là một trong những trình duyệt web có công nghệ tiên tiến nhất trên thị trường di động của doanh nghiệp về khả năng duyệt nhanh hơn, giao diện người dùng hiệu quả và một số tính năng nổi trội khác. Bất chấp sự cạnh tranh mạnh mẽ với đối thủ lớn nhất là Google Chrome, trình duyệt Safari vẫn là một lựa chọn đáng tin cậy của nhiều người dùng.

Để kiểm tra trình duyệt Safari, trước tiên các lập trình viên cần kiểm tra khả năng tương thích của trình duyệt với các ứng dụng của khách hàng. Sự kết hợp mới nhất của WebKit với công cụ Nitro JavaScript đã nâng cao trải nghiệm duyệt web trên Safari. Tuy nhiên, việc tham gia vào khả năng tương thích tuân thủ quy tắc có thể không dễ dàng như vậy. 

Thay đổi trình duyệt mặc định

Người dùng iOS 14 sẽ cần quyền truy cập được cấp phát từ bộ phận trình duyệt thông qua email để sử dụng các trình duyệt khác nhau với mục đích chính là duyệt web. Hiện tại, hệ thống chỉ cho phép các phiên bản mới nhất của Google Chrome và Microsoft Edge có quyền truy cập phân quyền cho người dùng.

Quá trình thay đổi trình duyệt mặc định khá phức tạp có thể được thực hiện thông qua cài đặt của các trình duyệt riêng biệt. Bạn có thể tìm thấy các panels khác nhau trong mỗi trình duyệt và đặt nó làm trình duyệt mặc định của mình. Tuy nhiên, nó dường như tồn đọng một lỗi là trình duyệt mặc định sẽ được đặt lại thành Safari sau khi hệ thống được khởi động lại. Trong trường hợp này, FUNiX khuyên bạn cần phải thay đổi các trình duyệt Safari sang các trình duyệt mong muốn khác.

UX không nhất quán và đồng bộ (Trải nghiệm người dùng)

Các trình duyệt thường không yêu cầu API bổ sung để trở thành trình duyệt mặc định và các ứng dụng khác cũng không thắc mắc về vấn đề này liên quan đến trình duyệt dẫn đến sự mâu thuẫn UX (trải nghiệm người dùng).

Điều này có thể gây ra một số vấn đề trong SafariViewController trong quá trình chạy thử trang web. Ví dụ: khi bạn chạy một trang web trên SafariViewController, chẳng hạn như nhấp vào liên kết trên Twitter có thể xuất hiện biểu tượng Safari dẫn bạn đến các trình duyệt khác, chẳng hạn như Chrome hoặc Firefox.

Một ví dụ khác là trình duyệt Facebook trên thiết bị di động; nếu trình duyệt di động mặc định là Chrome, thì liên kết được truy cập từ trình duyệt di động Facebook, đáng lẽ được cho là mở trên Safari, sẽ mở trên Chrome vì nó là trình duyệt mặc định. Trình duyệt Safari không có giao thức tùy chỉnh để mở địa chỉ trang URL, do đó không có cách nào để buộc Safari mở URL, điều này hiện tại bạn có thể thực hiện trên một số trình duyệt khác. Bạn có thể mở một URL HTTPS trên Google Chrome, Firefox hoặc Edge bằng cách sử dụng lược đồ URI.

Thay đổi về vị trí địa lý

Bạn có thể chọn một vị trí cụ thể để chia sẻ nếu bạn muốn phạm vi ước tính cho một ứng dụng cụ thể khi dùng iOS 14. Tuy nhiên, sẽ như thế nào đối với các trang web hoặc WPA quản lý thông qua API định vị địa lý W3C? Hãy cùng FUNiX tìm hiểu một số vấn đề liên quan.

Bạn có thể thay đổi bằng cách sử dụng tính năng mới nhất trên trình duyệt Safari để thay đổi vị trí chính xác trong mục Settings.. Để làm điều đó, hãy đi tới Cài đặt chọn Quyền riêng tư và truy cập Dịch vụ vị trí theo cách thủ công. Tính năng này khá hữu ích và phạm vi vị trí cũng khá chính xác. Mặc dù thay đổi này được thực hiện trên trình duyệt Safari, trên Geolocation API vị trí địa lý không được quy định, chính vì thế các trang web hoặc PWA không xác định được cài đặt mới nhất này.

Khi bạn bật Safari truy cập vị trí của mình, điều không đáng chú ý là Safari cho phép cấp quyền chính xác/gần đúng đối với một trang web hoặc PWA cụ thể. Đối với iOS 14, bạn có thể chọn chia sẻ vị trí gần đúng của mình hơn là vị trí chính xác. 

Các ứng dụng web tiến bộ (Progressive Web apps – PWA)

Các ứng dụng web tân tiến đang ngày càng trở nên phổ biến. Việc thực hiện PWAs đôi khi bị ảnh hưởng bởi các cài đặt không thể hỗ trợ như một số trường hợp sau đây:

• Khi trình duyệt mặc định/Các trình duyệt thay thế trong máy bạn không hỗ trợ cài đặt PWA.
• Thư viện chia sẻ hiện tại dường như không chấp nhận PWA hoàn toàn
• Bộ nhớ của Service Worker hiện được gán với Safari
• Chế độ cài đặt Side view của PWA đang hoạt động cùng với các Ứng dụng đang chạy khác hoặc vận hành hai PWA cùng lúc 
• Đôi khi, việc giải quyết một lỗi có thể gây ra những hạn chế hơn nữa.

Khi tải xuống PWA trên bất kỳ thiết bị Android nào, có thể bạn sẽ chỉ có thể sử dụng một phần bộ nhớ như Cookie, Web Storage và IndexedDB (vì chúng được tách biệt với trình duyệt Safari). Đăng ký Service worker và Cache Storage của PWA được chia sẻ với Safari mà Android của bạn có thể không hỗ trợ.

Trên Pinterest, khi bạn đăng nhập trên phiên bản trình duyệt, sau đó máy sẽ tự động đăng nhập bên trong Ứng dụng. Tuy nhiên, bạn có thể gặp phải một số trục trặc, có lẽ là do vấn đề lưu trữ. Vẫn chưa chắc chắn lý do tại sao nó xảy ra nếu cookie được xử lý riêng biệt.

Xác thực lệnh HTML/CSS

HTML từng là ngôn ngữ web chính, nhưng HTML nhập hiện đã trở nên lỗi thời. Bạn có thể thay thế nó bằng một giải pháp đáng tin cậy hơn như ES modules or server-side.

Một số lệnh CSS không được hỗ trợ trong các loại trình duyệt khác nhau, bao gồm cả trình duyệt Safari, khiến nó trở thành lý do chính gây ra những lo ngại về khả năng tương thích giữa các trình duyệt. Việc làm cho nội dung trang web trở nên phong phú và hấp dẫn đối với người truy cập cũng là cần thiết, nhưng hầu hết các nhà phát triển đang hy sinh khả năng tương thích của trình duyệt vì lý do này.

• Một số trình duyệt không hỗ trợ tất cả các loại giá trị CSS.
• Các trình duyệt cũ không chấp thuận CSS property background-repeat:space.
• Các trình duyệt cũ không chấp thuận CSS property background-repeat:round
• Các trình duyệt cũ không chấp thuận CSS property box-shadow
• CSS property filter: không còn được hỗ trợ bởi một số trình duyệt.
• CSS property grid: không được một số trình duyệt hỗ trợ.
• Một số trình duyệt không diễn giải hoàn nguyên từ khóa CSS.
• Một số trình duyệt không hỗ trợ CSS.clip-path

Kết luận

Ngay cả với một số trình duyệt, Safari vẫn đang giữ vững nền tảng của mình với sự hỗ trợ đáng tin cậy từ Apple. Bạn có thể làm theo các biện pháp trên để đảm bảo tính tương thích của trang web của bạn. Tuy nhiên, FUNiX khuyên bạn nên đặt trang web với tất cả các trình duyệt đã chọn để thử nghiệm một cách tương đương nhau, khi đó chỉ trang web của bạn mới có thể đáp ứng các tiêu chuẩn tương thích giữa các trình duyệt.

Bằng cách lưu ý và tránh những vấn đề nêu trên, bạn hoàn toàn có thể cung cấp một trang web hoàn hảo cho khách hàng của mình đúng thời hạn. Quản lý kiểm tra tính tương thích của trình duyệt như một bước cơ bản của quá trình phát triển phần mềm, đảm bảo một trang web chạy thành công.

Bài gốc: https://www.blogvwant.com/top-safari-browser-compatibility-issues/

Nguyễn Huyền (theo Blogvwant)