Thách thức dành cho web linh hoạt
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (95.52 KB, 4 trang )
Thách thức dành cho Web linh hoạt
Thiết kế web linh hoạt là một sự tiếp cận liên quan tới thiết kế web dành cho điện
thoại cầm tay. Một số người cho rằng nó chỉ là "mốt", số khác cho rằng nó là một
cách suy nghĩ mới. Về cá nhân, tôi cho rằng vùng làm việc của thiết kế web thay
đổi liên tục và nhanh chóng, mọi thứ đều bị cân nhắc như là một xu hướng theo
cách nghĩ nào đấy.
Không cần đi quá sâu vào phần này. Tốt hơn, chúng ta cùng xem những thách
thức sẽ phải vượt qua để xây dựng những trang web linh hoạt thành công.
1. Thời gian phát triển
Hầu hết điểm chính của việc xây dựng một trang web linh hoạt chính là sự tiêu
tốn về thời gian. Rõ ràng, thiết kế trang web cho một màn hình để bàn phổ thông
bạn cần ít thời gian chuẩn bị và ít tài nguyên để xây dựng nó, và cả việc kiểm định
cũng ít yêu cầu hơn.
Mất nhiều thời gian để chuyển một trang web độc đáo thành một trang web linh
hoạt. Nếu bạn đang hướng về mobile, và nghĩ về việc khiến trang web của mình là
loại web linh hoạt, đừng đánh giá thấp thời gian bạn dành cho việc thiết kế hiển thị
trên máy để bàn.
2. Các thiết bị khác nhau duy trì sự khác biệt
Ý nghĩ rằng bạn có thể dễ dàng xây dựng một trang web có thể hoạt động tổng thể
tốt trên mọi thiết bị là sự huyễn hoặc. Chắc chắn, có những đoạn code giúp trang
web của bạn hiển thị tốt nội dung và cấu trúc trên thiết bị này, nhưng trên thiết bị
khác nó lại là cách nghĩ khác.
Mọi ngươì sẽ mở trang web của bạn thông qua nhu cầu và mục tiêu cụ thể của họ,
và họ không để ý tới bối cảnh sử dụng.
Nhà thiết kế của trang choiceresponse.com có một sự ưu tiên rõ ràng cho việc
hiển thị trên thiết bị di động. Trong khi phiên bản dành cho máy để bàn hiển thị rất
nhiều nội dung cùng một lúc, thì với một màn hình nhỏ hơn bạn cần biết chính xác
điều gì đang có ở trong trang.
Tưởng tượng, bạn rất linh hoạt với trang web vận tải công cộng. Một ngươì dùng
có lẽ ghé thăm phiên bản trên máy để bạn, mở chúng kiên nhẫn và hy vọng tìm
thấy một ưu đãi đặc biệt cho kỳ nghỉ cuối tuần. Cùng lúc đó, một số khác có lẽ lại
đang mở trang web với phiên bản trên thiết bị di động, và hy vọng tìm ra bến xe
mà anh ta nên tới trước khi tàu rời đi trong ít phút.
Một trang web, hai vấn đề, và hoàn toàn khác nhau về kịch bản của ngươì dùng.
Để tạo một trải nghiệm tuyệt vời cho tất cả người dùng, bạn cần cân nhắc rằng
người ta có thể sử dụng nhiều thiết bị khác nhau trong bối cảnh khác nhau và mục
đích khác nhau.
3. Thiết bị khác nhau cho phép tương tác khác nhau.
Phiên bản dành cho máy để bàn của bạn không chỉ khác với phiên bản dành cho
mobile về mặt bố cục, mà còn rất khác về cách thực hành tương tác, và trang của
bạn chỉ có thể tốt trong cách này hoặc cách kia. Dĩ nhiên điều này sẽ xảy ra bởi vì
sự tương tác của màn hình máy tính và thiết bị di động hoàn toàn khác nhau.
Trong khi chúng ta dùng tới bàn phím và chỉ chuột để điều hướng trang web, thì
trên các thiết bị bạn không có gì ngoài ngón tay.
Phiên bản cho máy tính của forefathersgroup.com bao gồm rất nhiều liên kết với
những hiệu ứng khi rê chuột qua, người thiết kế sử dụng những hiệu ứng này chỉ
cho nội dung và nó không xuất hiện trên bản dành cho mobile.
Một lần nữa sự ưu tiên dành cho nội dung rất quan trọng trong thiết kế web linh
hoạt.
4. Sự giới hạn của media queries (phương thức nhận biết thiết bị)
Web linh hoạt làm việc với media queries để xác định kích thước màn hình của
người truy cập và hiển thị chính xác bố cục. Vấn đề ở đây là, những trình duyệt cũ,
đặc biệc là IE 8 và cũ hơn, không nhận ra media queries. 14% là con số quan trọng
về phía khách hàng của bạn và dựa trên đối tượng khách hàng mục tiêu của bạn thì
nó có thể cao hơn.
Điều này không có nghĩa là không có cách để hiển thị tốt trang web của bạn trên
các trình duyệt cũ. Bạn chỉ cần nhận biết chúng khi làm việc với media queries.
Có rất nhiều cách để tránh gặp vấn đề, như sử dụng các stylesheet riêng biệt cho
IE, hoặc thiết kế trang web của bạn dành cho mobile ngay lần xuất hiện đầu tiên.
Để chế độ hiển thị trên mobile ngay lần tiếp cận đầu tiên. Có nghĩa là chỉ có
những kiểu có thể áp dụng cho thiết kế bố cục phiên bản rộng trong phạm vi nhận
biết thiết bị. Tức là các trình duyệt không hỗ trợ nhận biết thiết bị sẽ thấy phiên
bản dành cho mobile.
5. Hình ảnh thu nhỏ có thể mất đi chi tiết.
Một hạn chế của thiết kế web linh hoạt là việc thay đổi kích thước hình ảnh. Thay
đổi kích thước hình ảnh có thể mất đi những chi tiết nhiều ý nghĩa. Về cơ bản, giới
hạn thực sự ở đây không phải là bản thân việc thay đổi kích thước, mà thực tế là
việc thay đổi xảy ra dựa trên kích thước màn hình mà không phải dựa trên bối
cảnh.
Trang oiverrussell.com giải quyết vấn đề này rất hay. Các hình ảnh được sắp xếp
lại để chúng có thể trượt ngang màn hình nếu cần thiết. Điều này tạo ra đủ khoảng
trống để giữ các hình ảnh thay đổi lại kích thước của chúng.
Giải pháp khác của việc thay đổi kích thước có lẽ là cắt (crop) chúng. Tuy vậy ý
nghĩa của hình ảnh có thể thay đổi.
6. Menu điều hướng.
Điều cuối cùng nhưng quan trọng, thanh điều hướng là một phần rất quan trọng
của trang web. Đặc biệt nó khá phức tạp với các trang web trên máy để bàn, với
việc chúng ta sử dụng nhiều lớp menu thả. Trên thiết bị di động, bạn sẽ phải chú ý
tới tài nguyên giới hạn của màn hình, điều khiến việc thiết kế menu là thách thức
thật sự.
Nhà thiết kế ra trang starbucks.com đã quyết định ẩn đi menu điều hướng ngay
ban đầu trên màn hình nhỏ. Chỉ khi chạm vào một biểu tượng nhỏ trên cao phía
góc trái, thì các nội dung thư mục mới hiện ra như là nút thân thiện với ngón tay
(finger-friendly buttons).
