7 kinh nghiệm người dùng dành cho thiết kế web trên mobile

Internet di động tiếp tục phát triển rất nhanh chóng. Những hướng dẫn này sẽ giúp bạn tạo ra hoặc cải thiện trải nghiệm người sử dụng điện thoại di động của bạn.
1. Giảm số lượng nội dung

Không phải tất cả mọi thứ được hiển thị trên một trang web PC có thể phù hợp với hợp lý vào một trang web điện thoại di động, nơi không gian là ngắn và tới từng điểm ảnh. Điều quan trọng là để giảm số lượng của nội dung hiển thị trên các phiên bản điện thoại di động tối ưu hóa.

Chỉ bao gồm nội dung hoặc các tính năng quan trọng nhất. Nội dung ưu tiên thấp có thể được gỡ bỏ có thể bao gồm các nội dung hoặc liên kết bên ngoài khu vực nội dung chính, chẳng hạn nội dung thường được tìm thấy trong các cột tay phải của các trang web tiêu chuẩn.

Nội dung trang web điện thoại di động nên được tập trung. Điều này làm cho họ dễ dàng hơn để đọc và di chuyển xung quanh, cũng như nhanh hơn để tải trên các thiết bị mà đôi khi có thể có tốc độ kết nối Internet chậm.

2. Bố trí 1 cột duy nhất – làm việc tốt nhất

Trang web rộng là khó khăn để xem trên màn hình điện thoại di động nhỏ. Ngay cả trên điện thoại thông minh như iPhone với màn hình của họ tương đối lớn các trang web tiêu chuẩn tải một tăng thu nhỏ để họ có thể phù hợp trên màn hình. Hầu hết các văn bản là đọc cho đến khi người dùng phóng to một phần của màn hình mà họ muốn xem. Phóng to trong không phải là lý tưởng vì nó cho biết thêm thêm một bước và phóng to và ra không phải là dễ dàng để làm trên tất cả các điện thoại.

bbc news article f 7 kinh nghiệm người dùng dành cho thiết kế web trên mobile

Hủy bỏ nội dung ưu tiên thấp và sử dụng một cách bố trí cột duy nhất.

Thay vào đó, tạo ra các trang cột duy nhất sử dụng toàn bộ chiều rộng của màn hình. Để thêm nội dung bổ sung trang web sẽ mở rộng xuống dưới chứ không phải là trên, như di chuyển xuống là dễ dàng hơn hơn so với di chuyển qua và người dùng thường thích nó.

3. Trình bày các định hướng khác nhau

Thật khó để phù hợp với điều hướng trên đầu trang của màn hình trên một trang web di động. Xếp ở đầu trang sẽ thúc đẩy các nội dung quá xa. Một cách bố trí cột duy nhất trên một trang màn hình điện thoại di động đặt điều hướng ở phía trên sẽ thúc đẩy các nội dung quá xa xuống. Dưới đây là một số lời khuyên cho việc thêm một chuyển hướng đến trang web điện thoại di động:

Trên trang chủ đặt điều hướng và trang web tìm kiếm ở phía trên của trang, và để lại nội dung cho các trang sau đó. Điều này là phù hợp cho các trang web mà người dùng muốn điều hướng hoặc tìm kiếm ngay lập tức, hơn là đọc nội dung. Ví dụ, khi người dùng truy cập các trang web thương mại điện tử, họ thường có một loại sản phẩm cụ thể trong tâm trí và muốn khai thác thông qua nó hoặc gõ vào hộp tìm kiếm.
Đặt điều hướng ở phía dưới. Người dùng vẫn có thể truy cập điều hướng nhưng nó không nhận được trong cách đọc trang. Một liên kết neo ở phía trên cùng của trang có thể cung cấp cho truy cập nhanh hơn.
Đặt điều hướng trong một liên kết thả xuống ở trên cùng của trang (và có thể ở dưới cùng).
Chỉ cung cấp một nút ‘Quay lại’ trên các trang khác ngoài trang chủ. Điều này sẽ giúp thiết kế trang đơn giản tại các chi phí của bất kỳ khả năng điều hướng trực tiếp đến một phần khác của trang web di động.

4. Giảm thiểu nhập văn bản

Nhập văn bản vào các trang web bằng cách sử dụng điện thoại di động là khó khăn hơn nhiều so với khi sử dụng bàn phím máy tính để bàn hoặc máy tính xách tay. Vật lý QWERTY có xu hướng được bàn phím điện thoại di động dễ dàng nhất để sử dụng, tiếp theo là màn hình cảm ứng bàn phím QWERTY theo truyền thống 12 nút vật lý 12 bàn phím chữ và số.

Tuy nhiên, người dùng thực hiện các lỗi nhiều hơn và chậm hơn đáng kể khi gõ trên bàn phím điện thoại di động tốt nhất so với khi sử dụng một bàn phím máy tính đầy đủ kích thước. Nó đứng vào lý do, sau đó, mà người dùng không muốn phải gõ càng nhiều trên các trang web di động.

ms choose address 7 kinh nghiệm người dùng dành cho thiết kế web trên mobileCách để giảm số lượng nhập văn bản yêu cầu bao gồm:

    Cho phép người dùng sử dụng các chi tiết được lưu trữ trong phần ‘Tài khoản của tôi khi đi qua một ví dụ như kinh nghiệm điện thoại di động kiểm tra chọn từ các địa chỉ giao hàng được nhập vào trước đó.
    Yêu cầu người dùng nhập mã PIN thay vì mật khẩu.
    Hãy tận dụng chức năng sẵn có (xem dưới đây)

5. Quyết định xem bạn cần nhiều hơn 1 trang web điện thoại di động

Màn hình và sức mạnh xử lý trên điện thoại di động khác nhau rất nhiều. Ví dụ, một kiểm tra nhanh chóng vào một nhà bán lẻ điện thoại di động hàng đầu cho thấy điện thoại bán với độ phân giải khác nhau, từ 128 x 160 pixel lên đến 480 x 800. Và, trong khi nhiều điện thoại thông minh có khả năng tải lên các trang web đầy đủ trình độ thấp hơn điện thoại không có thể đối phó và sẽ sụp đổ cố gắng để làm như vậy.

Nếu trang web di động của bạn sẽ chỉ để được nhìn thấy bởi người sử dụng điện thoại thông minh với tốc độ nhanh chóng tải về sau đó một phiên bản di động sẽ là ok. Tuy nhiên, nếu bạn muốn có một tiếp cận rộng hơn thì bạn nên xem xét việc tạo ra một kết hợp xuống phiên bản. Facebook đi xa như có 3 phiên bản điện thoại di động chính.m.facebook.com là trang web điện thoại di động chính, touch.facebook.com được tối ưu hóa cho điện thoại di động touscreen và 0.facebook.com được tối ưu cho người sử dụng ở các nước có tốc độ download rất chậm.

facebook mob feed 7 kinh nghiệm người dùng dành cho thiết kế web trên mobileĐây là một trong Facebook của 3 phiên bản chính điện thoại di động.

6. Thiết kế cho màn hình cảm ứng và màn hình cảm ứng người dùng

Điện thoại thông minh chiếm đa số sử dụng Internet di động ở nhiều nước, bao gồm cả Anh và Mỹ. Vì vậy, điều quan trọng là điện thoại di động trang web của bạn sẽ được tối ưu hóa cho điện thoại thông minh. Những điều này thường có màn hình cảm ứng lớn màn hình nhưng có thể có một trackball truyền thống hơn, phím điều khiển hoặc các phím định hướng. Vì vậy, điều quan trọng là thiết kế của bạn là dễ dàng cho cả người sử dụng màn hình cảm ứng và màn hình cảm ứng không.

Khó khăn với việc xem các trang web tiêu chuẩn trên điện thoại thông minh phổ biến nhất là trong việc lựa chọn, đặc biệt là khai thác, liên kết văn bản nhỏ một cách chính xác. Ngón tay có xu hướng quá dày để đạt một liên kết nhỏ chính xác, và nếu có 2 hoặc nhiều hơn liên kết gần nhau sau đó nó dễ dàng để vô tình gõ sai.

Liên kết nên tránh bất kỳ cuộc gọi quan trọng đến hành động (nó ít của một vấn đề để sử dụng chúng cho các liên kết footer). Thay vào đó, thiết kế các cuộc gọi đến hành động mất không gian màn hình nhiều hơn và có thể được khai thác một cách dễ dàng. Ví dụ, sử dụng hàng dày hơn khoảng chiều rộng của màn hình hoặc hộp vuông có thể cả hai đều có thể được khai thác một cách dễ dàng.

7. Hãy tận dụng chức năng sẵn có

Nhiều điện thoại di động có một lợi thế hơn máy tính – họ đến với rất nhiều các chức năng sẵn có mà hầu hết các máy tính không có. Bạn có thể làm cho nó dễ dàng hơn cho người sử dụng để thực hiện các nhiệm vụ nhất định bằng cách sử dụng chức năng sẵn có của điện thoại di động và do đó loại bỏ sự cần thiết cho các bước hướng dẫn sử dụng.

Thực hiện cuộc gọi
Tất cả điện thoại có thể, tất nhiên, thực hiện cuộc gọi điện thoại theo mặc định (máy tính cá nhân yêu cầu người sử dụng phần mềm bổ sung sẽ không mua tín dụng để thực hiện các cuộc gọi từ máy tính của mình để điện thoại vật lý). Cho phép người dùng tự động gọi một số khi họ khai thác hoặc bấm vào một số điện thoại. Điều này rất hữu ích cho ‘Liên hệ với chúng tôi “hoặc các trang cửa hàng tìm’.

Xem một địa chỉ trên bản đồ
Tương tự như vậy, nó có thể cung cấp cho người sử dụng tùy chọn để lựa chọn một địa chỉ và tự động mở ứng dụng bản đồ điện thoại di động.

Tìm nơi gần nhất …
Người sử dụng thường đi từ nhà của họ khi họ sử dụng Internet trên điện thoại di động của họ. Kể từ khi điện thoại di động đi kèm với khả năng phát hiện vị trí sẵn có (ví dụ như GPS), bạn có thể yêu cầu người sử dụng chia sẻ vị trí hiện tại của họ. Các nhà bán lẻ cao, đường phố, ví dụ, có thể làm cho nó dễ dàng cho khách hàng để phát hiện các cửa hàng gần nhất của họ trên bản đồ. Các trang web mạng xã hội di động có thể làm cho nó dễ dàng cho người dùng để tìm thấy những người, địa điểm hoặc sự kiện gần họ.

Nhập thông tin trong cách thức sáng tạo
Có nhiều cách sáng tạo để cho phép người sử dụng thông tin đầu vào là cả hai vui vẻ và hữu ích. Các mã QR là một ví dụ về điều này. Waitrose đã có một chiến dịch báo chí cuối năm ngoái để thúc đẩy nó Giáng sinh iPhone và Android ứng dụng. Quét mã mất người sử dụng trực tiếp đến các cửa hàng ứng dụng để tải về nó.

waitrose qr code 7 kinh nghiệm người dùng dành cho thiết kế web trên mobileQuét các mã số này nhanh chóng trở thành một chương trình tiếp thị phổ biến.
Kết luận

Số người truy cập vào trang web của điện thoại di động của họ ngày càng nhanh chóng. Chúng có thể được đưa ra một kinh nghiệm người dùng tốt hơn bằng cách làm theo những hướng dẫn này:

01. Giảm số lượng nội dung
02. Bố trí cột duy nhất làm việc tốt nhất
03.Trình bày rằng điều hướng khác nhau
04.Giảm thiểu nhập văn bản
05. Quyết định xem bạn cần nhiều hơn 1 trang web điện thoại di động
06. Thiết kế cho màn hình cảm ứng và màn hình cảm ứng người dùng
07. Hãy tận dụng chức năng sẵn có

Về tác giả:

Bài viết này được viết bởi Abid Warsi một nhà tư vấn cao cấp của các tư vấn kinh nghiệm người dùng , Webcredible. Abid đam mê cải thiện trải nghiệm người dùng của các trang web và có trách nhiệm lãnh đạo một loạt các dự án kinh nghiệm người dùng bao gồm theo dõi mắt và kiến trúc thông tin .
View: 3106 21/03/2012 11:35:00 SA