Mobile Responsive Test là gì ? Đâu là những Responsive Testing Tool tốt nhất

Sự quan trọng của Mobile Responsive Testing

Trong thế giới đầy máy móc ngày nay, các trang web không chỉ được mở ra trên máy tính xách tay hay máy tính để bàn mà còn trên máy tính bảng và điện thoại thông minh.

Đã qua rồi những ngày chúng ta ngồi trước máy tính để bàn hoặc máy tính xách tay để mua sắm hoặc lướt internet hoặc gửi email. Bây giờ là thời đại di động và mọi người truy cập internet ngay cả khi đi bộ trên đường phố, ngồi trong công viên và bất cứ nơi nào họ muốn.

Nếu bạn quan sát máy tính để bàn, máy tính xách tay, máy tính bảng và điện thoại thông minh, chúng không chỉ khác nhau ở hệ điều hành, CPU, vv, mà còn cả kích thước màn hình của chúng.

Vì vậy đối với một business, nó không chỉ là một ứng dụng mà còn là một trang web, việc trang web hiển thị tốt trong các kích cỡ khác nhau trở nên rất quan trọng. Khách hàng hoặc người dùng của bạn sẽ không thích nếu họ phải điều chỉnh điện thoại để có thể nhìn rõ ràng hơn về nội dung trang web của bạn.

Tất cả chúng ta đều sử dụng Amazon, Agoda, và ZDNet, vv, và các trang web khác hầu như hàng ngày. Hãy tưởng tượng như thế nào tẻ nhạt nó sẽ được nếu bạn phải truy cập vào trang tiếp theo hoặc một hình ảnh nhưng liên kết hoặc là không phù hợp trên màn hình hoặc nó là quá nhỏ để click vào? Những thứ như vậy dẫn đến việc mất đi sự quan tâm của người dùng.

Đây là nơi mobile responsive hoặc là các giao diện thân thiện với mobile được áp dụng.

Responsive hoặc thiết kế giao diện web thân thiện có liên quan một cách mật thiết đến trang web. Thiết kế web responsive trên thiết bị di động là một cách tiếp cận được theo dõi trong quá trình phát triển trang web để mang đến cho người dùng trải nghiệm xem tốt nhất trên mọi thiết bị họ đang xem.

Google ưu tiên các trang web thân thiện với thiết bị di động trong kết quả tìm kiếm của họ và do đó cần phải lưu tâm khi thiết kế trang web của bạn.

Ý nghĩa của Thiết kế thân thiện hay Mobile Responsiveness

Thiết kế web responsive hay cũng được gọi là RWD và nó là một cách tiếp cận để thiết kế một trang web để làm cho các trang web hiển thị hợp lý với các thiết bị khác nhau và kích thước màn hình của chúng.

Có ba nguyên tắc phát triển bao gồm:

1. Fluid Grids - Cách tiếp cận này dựa trên tỷ lệ phần trăm chứ không phải là phương pháp dựa trên pixel truyền thống.

2. Media Queries - Được sử dụng để áp dụng các khác nhau dựa trên kích thước màn hình thiết bị.

3. Flexxible images and media - Giúp hiển thị hình ảnh và phương tiện khác nhau ở các kích thước khác nhau bằng cách sử dụng tỷ lệ hoặc CSS.

Với cách tiếp cận phát triển này, việc kiểm thử các trang web responsive cũng rất quan trọng.

Các trang web thân thiện với thiết bị di động cần cung cấp trải nghiệm tương tự cho người dùng trên thiết bị di động như trên máy tính xách tay hoặc máy tính để bàn. Nó cần phải được thử nghiệm cho các trình duyệt khác nhau, kích thước màn hình khác nhau, chế độ - landscape hoặc portrait, v.v.

Mobile responsive testing và những thách thức

Tích hợp một thiết kế web responsive không kết thúc câu chuyện, điều quan trọng không kém là kiểm tra việc triển khai của nó để đảm bảo rằng trang web hiển thị như mong muốn trên tất cả các thiết bị.

Nội dung, video, hình ảnh, liên kết, v.v., tất cả đều cần phải được kiểm tra về hiển thị của chúng trước khi công bố trang web. Việc kiểm tra cũng cần được thực hiện không chỉ trên các thiết bị mà còn trên các trình duyệt và hệ điều hành khác nhau.

Ví dụ: một trang web có thể trông hơi khác trên Android nếu so sánh với iOS hoặc trong Windows.

Nhưng cũng có những thách thức lớn mà QA phải đối mặt để kiểm tra responsive. Thách thức lớn nhất là sự kết hợp của kích thước màn hình, các phiên bản hệ điều hành, các chế độ của điện thoại, các trình duyệt và độ phân giải của chúng. Do đó rất khó để quyết định chiến lược kiểm thử. Những thách thức khác bao gồm khung thời gian thử nghiệm, công cụ, ưu tiên kiểm thử, v.v.

Sau đây là một số cách để quyết định việc kiểm thử

Test bed

Tạo ma trận cho các kết hợp khác nhau về kích thước điện thoại, trình duyệt, hệ điều hành và phiên bản là một nhiệm vụ rất tẻ nhạt và phức tạp. Do đó là một QA, tôi sẽ gợi ý lấy input từ BA và chủ sở hữu sản phẩm hoặc người quản lý.

Do việc xem xét sự phức tạp của test bed, người ta thường khuyến khích việc để cho BA và PO quyết định về các phiên bản, kích cỡ vv cần phải được kiểm tra. Có thể xảy ra tình trạng bạn phải dành rất nhiều thời gian trong nghiên cứu và chiến lược các test bed mà có thể không được phê duyệt bởi người quản lý của bạn hoặc SCRUM master. Trang web có thể truy cập được trên máy tính để bàn, điện thoại, v.v.

Do đó, test bed cần bao gồm các trình duyệt có phiên bản sẽ phổ biến cho tất cả các thiết bị này, do đó sự phức tạp của biến thể phiên bản sẽ tránh được và phiên bản tương tự có thể được kiểm tra tất cả trên cùng môt phiên bản.

Time Allocation

Bạn cần phải thảo luận và đưa ra kết luận bao nhiêu thời gian là cần thiết để thử nghiệm và bao nhiêu phần trăm trong đó được phân bổ bởi việc kiểm thử các trang web responsive là rất tốn thời gian.

Dựa trên điều này, bạn sẽ phải chuẩn bị kế hoạch về cách thức và những gì cần kiểm tra. Hãy chắc chắn rằng bạn có đủ thời gian được phân bổ để kiểm thử để một loạt các test bed quan trọng.

Real Devices and Emulators

Để kiểm thử nhiều sự kết hợp, việc mua tất cả các loại thiết bị là không khả thi và lúc này bạn cần sử dụng emulators cũng như là simulators.

Theo kinh nghiệm của tôi, phần quan trọng nhất là các version và kích cỡ màn hình... và nó nên được kiểm thử ở thiết bị thật, tuy nhiên những version và kích cỡ màn hình đã quá lỗi thời có thể được kiểm thử trên emulators và simulators.

Manual or Automation

Việc kiểm thử có thể được thực hiện bẳng cả cách thủ công hoặc tự động. Đôi khi các công cụ không thể đánh giá tốt bằng mắt thường do đó việc kiểm thử thủ công là cần thiết. Test effort có thể được chia ra theo tỉ lệ 65% tự động và 35% thủ công hoặc ngược lại.

Ví dụ một công cụ click vào một liên kết nhỏ rất khác với việc click vào bằng các ngón tay của chúng ta hoặc thu nhỏ thủ công một trang web thay vì công cụ thu nhỏ trang.

Đánh độ ưu tiên cho việc Testing

Việc kiểm thử cần phải được đánh độ ưu tiên một cách chính xác bởi có nhiều thứ để test và không phải mọi thứ đều có thể được test. Vì vậy, cả nhóm cần có sự đồng thuận về kế hoạch test và độ ưu tiên của nó. Độ ưu tiên kiểm thử càn được trao đổi trước với BA và Product Owner để họ có thể đưa ra được góp ý nếu cần thiết.

Việc kết hợp các hệ điều hành, trình duyệt và kích thước màn hình thường được sử dụng phải được kiểm tra kỹ lưỡng và có độ ưu tiên. Theo kinh nghiệm của tôi, một kiểm thử đầy đủ nên được thực hiện trên hệ điều hành di động mới nhất nhưng sau khi tất cả các vấn đề được khắc phục và xác nhận vì không phải ai cũng sử dụng hệ điều hành di động mới nhất.

Sự quan trọng của việc kiểm thử Responsive của một trang Web

Nội dung của trang web là nội dung quảng bá doanh nghiệp và nếu nội dung không hấp dẫn khách hàng thì doanh nghiệp không thể phát triển tốt. Do đó, việc phát triển trang web responsive sẽ không kết thúc câu chuyện, nó còn cần được kiểm tra và xác minh.

Kiểm thử đóng một vai trò quan trọng trong việc đảm bảo rằng chúng ta đang cung cấp một ứng dụng chất lượng, mạnh mẽ và thân thiện với người dùng cho khách hàng của chúng ta. Điều tương tự xảy ra đối với trường hợp một trang web mobile responsive.

Những yếu tố dưới đây chứng tỏ sự quan trọng của việc kiểm thử một Website có mobile responsive.

1. Rất nhiều thiết bị, hệ điều hành và trình duyệt: Việc xác minh nội dung cần được thực hiện ở các điện thoại di động có kích thước màn hình khác nhau, hệ điều hành và trình duyệt. Nó không có nghĩa là nội dung chỉ cần hoàn hảo với một, mà cho nhiều loại thiết bị khác nhau.
2. Độ mạnh mẽ: Thời gian tải trang nội dung phải giống nhau trên các nền tảng khác nhau và không nên chậm hoặc bị timeout trên bất kỳ thiết bị hoặc trình duyệt 'được hỗ trợ' nào. Do đó kiểm tra hiệu suất của trang web là rất quan trọng cho các trang web đáp ứng di động.
3. Điều hướng: Đây là lỗi rất phổ biến được tìm thấy trong khi kiểm thử các trang web hoặc ứng dụng dành cho thiết bị di động mà các trang không tải như mong đợi khi điều hướng giữa các liên kết khác nhau của trang web. Đôi khi, điều đó xảy ra khi các liên kết bị thiếu hoặc các hình ảnh không được tải hoặc bị timeout trong khi phát với điều hướng.
4. Các loại hình ảnh và video: Cần có việc kiểm thử thích hợp để xác minh xem tất cả các loại hình ảnh và video có được hiển thị như mong đợi trên các điện thoại, trình duyệt khác nhau hay không. Đôi khi một số video phát trên Android nhưng chúng thậm chí không tải được trên iOS hoặc một số hình ảnh xuất hiện bị hỏng trên một số phiên bản của hệ điều hành trên thiết bị di động trong khi chúng hiển thị hoàn hảo trên các hệ điều hành khác

Những vấn đề như vậy có thể gây ấn tượng xấu nếu việc kiểm thử không được thực hiện. Do đó kiểm tra các trang web đáp ứng di động cũng rất quan trọng cùng với các thử nghiệm khác như chức năng, bảo mật, v.v.

Một số Test Case mẫu cho việc kiểm thử Mobile Responsive

Thông thường, người tester bắt đầu kiểm thử bằng cách thay đổi kích thước cửa sổ của điện thoại di động, trình duyệt, máy tính bảng, máy tính xách tay, v.v. nhưng có nhiều thứ cần được kiểm tra hơn.

Dưới đây là một vài trường hợp testcase có thể được đề cập trong khi kiểm tra trang web mobile responsive, đảm bảo rằng các testcase được kiểm tra cho tất cả các ma trận test bed:

1. Kiểm tra xem nội dung khớp với màn hình và không bị cắt bớt cũng như là bị méo mó
2. Kiểm tra xem các videos có được tải và không có link bị hỏng trong đó
3. Kiểm tra xem màu text, font... không bị thay đổi
4. Kiểm tra xem việc zoom out không làm méo mó trang web, hình ảnh và video
5. Kiểm tra xem việc scroll nhanh trang web không làm méo mó nội dung
6. Kiểm tra xem các link có hoạt động tốt và có đưa người dùng đến với trang thích hợp
7. Kiểm tra xem trang web có bị timeout hoặc có tốn quá nhiều thời gian để load không
8. Kiểm tra xem nội dung có được điều chỉnh phù hợp khi xoay ngang, dọc trang web không
9. Kiểm tra xem các ảnh với nhiều extension khác nhau như .jpg, .png, .gif có hiển thị như mong muốn không
10. Kiểm tra xem các link có còn click vào được sau khi zoom in hoặc zoom out trên màn hình bé
11. Kiểm tra xem việc chuyển hướng giữa các trang web có gây ra méo mó nội dung không

Các công cụ test responsive cho trang Web

Có một số công cụ (test tool) có sẵn để kiểm tra khả năng responsive trên các thiết bị di động và đặc biệt là nó miễn phí.

Theo kinh nghiệm của tôi, đối với loại kiểm thử cụ thể này, tốt hơn nên sử dụng một công cụ có thể được sử dụng cho nhiều loại điện thoại, hệ điều hành, trình duyệt, v.v. Không thể sử dụng các công cụ khác nhau cho các thiết bị, trình duyệt khác nhau .

Do đó trong khi lựa chọn một công cụ, chọn một công cụ có thể bao gồm tối đa các testcase của test bed.

Dưới đây là danh sách một bài open source testing tools:

1. Websiteresponsivetest.com: Công cụ này hỗ trợ tất cả các trình duyệt web chính và nó cung cấp bản xem trước về cách trang web thực sự trông như thế nào. Để có được kết quả của một trang web responsive, chúng ta sẽ phải nhập URL của trang web của mình.
2. Screenfly: Nó cũng là một công cụ kiểm thử mobile responsive và có thể được sử dụng để thử nghiệm trên Galaxy Tab, iPad, vv Nó tự động phát hiện trang web di động tương ứng với trang web và đưa bạn đến đó.
3. ViewPort Resizer: Nó là một công cụ có thể cấu hình và có thể được sử dụng để tùy chỉnh kích thước màn hình của một trình duyệt.
4. Responsinator: Đây là một phiên bản trả tiền và cũng là nơi bạn có thể mua các tên miền phụ cho việc kiểm thử của bạn. Bằng cách cung cấp URL của trang web, công cụ này cho biết trang web của bạn trông như thế nào.

Kết luận

Kiểm thử Mobile Responsive là rất quan trọng để đảm bảo tất cả người dùng có trải nghiệm xem tối ưu trên thiết bị của họ, có thể là máy tính xách tay, máy tính để bàn, máy tính bảng hoặc điện thoại thông minh.

Như tôi đã nhắc đến ở trên, chỉ khi nội dung xuất hiện tốt cho người dùng, họ mới quan tâm đến việc tiếp tục xem trang, do đó cùng với các loại kiểm tra chức năng, bảo mật, kiểm thử responsive cũng rất quan trọng và không nên xem nhẹ.

Kiểm thử responsive trên thiết bị di động rất đơn giản nhưng các test bed được tạo ra sự phức tạp và là thách thức lớn nhất đối với loại kiểm thử này. Do đó, là một QA bạn cần phải có những biện pháp đối phó thông minh.

Tham khảo

https://www.softwaretestinghelp.com/mobile-responsive-test/