Chuyển hướng thiết bị di động đến nội dung hoặc thiết kế di động
Trong nhiều năm nay, các chuyên gia đã nói rằng lưu lượng truy cập đến các trang web từ khách truy cập trên thiết bị di động đã tăng lên đáng kể. Vì lý do này, nhiều công ty đã thông minh bắt đầu nắm lấy chiến lược di động cho sự hiện diện trực tuyến của họ, tạo ra những trải nghiệm phù hợp với điện thoại và các thiết bị di động khác.
Khi bạn đã dành thời gian tìm hiểu cách thiết kế trang web cho điện thoại di động và triển khai chiến lược của mình, bạn cũng sẽ muốn đảm bảo rằng khách truy cập trang web của bạn có thể xem những thiết kế đó. Có rất nhiều cách bạn có thể làm điều này và một số hoạt động tốt hơn những cách khác. Dưới đây là một phương pháp bạn có thể sử dụng để thực hiện hỗ trợ di động trên trang web của mình - cùng với đề xuất ở gần cuối cho phương pháp tốt nhất để đạt được điều này là trên trang web hôm nay!
Cung cấp liên kết đến một phiên bản trang web khác
Đây là, cho đến nay, phương pháp dễ nhất để xử lý người dùng điện thoại di động. Thay vì lo lắng liệu họ có thể hoặc không thể xem các trang của bạn, chỉ cần đặt một liên kết ở đâu đó gần đầu trang trỏ tới phiên bản di động riêng biệt của trang web của bạn. Sau đó, người đọc có thể tự chọn xem họ muốn xem phiên bản di động hay tiếp tục với phiên bản "bình thường".
Lợi ích của giải pháp này là dễ thực hiện. Nó đòi hỏi bạn phải tạo một phiên bản tối ưu hóa cho điện thoại di động và sau đó thêm một liên kết ở đâu đó gần đầu trang của trang thông thường.
Những hạn chế là:
- Bạn phải duy trì phiên bản riêng của trang web cho người dùng thiết bị di động. Khi trang web của bạn trở nên lớn hơn, bạn có thể quên duy trì phiên bản thứ hai đó và các trang web của bạn có thể không đồng bộ.
- Bạn cũng tạo phiên bản thứ ba cho máy tính bảng phải không? Làm thế nào về một phiên bản thứ tư cho wearables? Khái niệm về các phiên bản dành riêng cho thiết bị này có thể vượt khỏi tầm kiểm soát rất nhanh.
- Bạn phải đặt một liên kết xấu xí ở đầu trang mà người đọc không di động có thể thấy (và có thể nhấp vào).
Cuối cùng, cách tiếp cận này là một phương pháp đã lỗi thời và khó có thể trở thành một phần của chiến lược di động hiện đại. Nó đôi khi được sử dụng như là một sửa chữa khoảng cách dừng trong khi một giải pháp tốt hơn đang được phát triển, nhưng nó thực sự là một băng trợ ngắn hạn tại thời điểm này.
Sử dụng JavaScript
Trong một biến thể của phương pháp được đề cập ở trên, một số nhà phát triển sử dụng một số loại tập lệnh phát hiện trình duyệt để phát hiện xem khách hàng có đang sử dụng thiết bị di động không và sau đó chuyển hướng họ đến trang web di động riêng biệt đó. Vấn đề với phát hiện trình duyệt và thiết bị di động là có hàng ngàn thiết bị di động ngoài kia. Để cố gắng phát hiện tất cả chúng bằng một JavaScript có thể biến tất cả các trang của bạn thành một cơn ác mộng tải xuống - và bạn vẫn phải chịu nhiều hạn chế tương tự như cách tiếp cận được đề cập ở trên.
Sử dụng CSS & # 64; phương tiện truyền thông cầm tay
Lệnh CSS @media handheld dường như là một cách lý tưởng để hiển thị các kiểu CSS chỉ dành cho các thiết bị cầm tay - như điện thoại di động. Điều này có vẻ như một giải pháp lý tưởng để hiển thị các trang cho thiết bị di động. Bạn viết một trang Web và sau đó tạo hai tờ định kiểu. Đầu tiên cho loại phương tiện "màn hình" kiểu trang của bạn cho màn hình và màn hình máy tính. Thứ hai cho "thiết bị cầm tay" tạo kiểu cho trang của bạn cho các thiết bị nhỏ như những điện thoại di động đó. Nghe có vẻ dễ dàng, nhưng nó không thực sự hoạt động trong thực tế.
Ưu điểm lớn nhất của phương pháp này là bạn không phải duy trì hai phiên bản trang web của mình. Bạn chỉ cần duy trì một cái, và bảng định kiểu định nghĩa nó trông như thế nào - nó thực sự đang tiến gần đến giải pháp cuối cùng mà chúng ta muốn.
Một vấn đề với phương pháp này là nhiều điện thoại không hỗ trợ loại phương tiện cầm tay — chúng sẽ hiển thị các trang của chúng với loại phương tiện màn hình thay thế. Và nhiều điện thoại di động và thiết bị cầm tay cũ hơn không hỗ trợ CSS. Cuối cùng, phương pháp này không đáng tin cậy và do đó hiếm khi được sử dụng để phân phối các phiên bản di động của trang web.
Sử dụng PHP, JSP, ASP để phát hiện tác nhân người dùng
Đây là cách tốt hơn để chuyển hướng người dùng thiết bị di động sang phiên bản di động của trang web, bởi vì nó không dựa vào ngôn ngữ kịch bản hoặc CSS mà thiết bị di động không sử dụng. Thay vào đó, nó sử dụng ngôn ngữ phía máy chủ (PHP, ASP, JSP, ColdFusion, v.v.) để xem xét tác nhân người dùng và sau đó thay đổi yêu cầu HTTP để trỏ tới trang di động nếu đó là thiết bị di động.
Một mã PHP đơn giản để làm điều này sẽ trông như thế này:
stristr ($ ua, "Windows CE") hoặc
stristr ($ ua, "AvantGo") hoặc
stristr ($ ua, "Mazingo") hoặc
stristr ($ ua, "Di động") hoặc
stristr ($ ua, "T68") hoặc
stristr ($ ua, "Syncalot") hoặc
stristr ($ ua, "Blazer")) {
$ DEVICE_TYPE = "MOBILE";
}
if (isset ($ DEVICE_TYPE) và $ DEVICE_TYPE == "MOBILE") {
$ location = 'mobile / index.php';
header ('Location:'. $ location);
lối thoát;
}
?>
Vấn đề ở đây là có rất nhiều tác nhân người dùng tiềm năng khác được các thiết bị di động sử dụng. Kịch bản này sẽ bắt và chuyển hướng rất nhiều trong số họ nhưng không phải tất cả bằng bất kỳ phương tiện nào. Và nhiều hơn nữa được thêm vào tất cả các thời gian.
Ngoài ra, như với các giải pháp khác ở trên, bạn sẽ vẫn phải duy trì một trang web dành riêng cho thiết bị di động cho những người đọc này! Hạn chế của việc phải quản lý hai (hoặc nhiều hơn) các trang web là lý do đủ để tìm ra một giải pháp tốt hơn.
Sử dụng WURFL
Nếu bạn vẫn quyết định chuyển hướng người dùng di động của bạn đến một trang web riêng biệt, thì WURFL (Tệp tài nguyên phổ dụng không dây) là một giải pháp tốt. Đây là một tệp XML (và bây giờ là tệp DB) và các thư viện DBI khác nhau không chỉ chứa dữ liệu tác nhân người dùng không dây cập nhật mà còn có các tính năng và khả năng hỗ trợ tác nhân người dùng đó.
Để sử dụng WURFL, bạn tải xuống tệp cấu hình XML và sau đó chọn ngôn ngữ của bạn và triển khai API trên trang web của bạn. Có các công cụ để sử dụng WURFL với Java, PHP, Perl, Ruby, Python, Net, XSLT và C ++.
Lợi ích của việc sử dụng WURFL là có rất nhiều người cập nhật và thêm vào tệp cấu hình mọi lúc. Vì vậy, trong khi tệp bạn đang sử dụng đã lỗi thời gần như trước khi bạn tải xuống xong, rất có thể là nếu bạn tải xuống mỗi tháng một lần hoặc lâu hơn, bạn sẽ có tất cả các trình duyệt di động mà người đọc thường sử dụng mà không cần bất kỳ các vấn đề. Nhược điểm, tất nhiên, là bạn phải liên tục tải về và cập nhật này - tất cả vì vậy bạn có thể hướng người dùng đến một trang web thứ hai và những hạn chế tạo ra.
Giải pháp tốt nhất là thiết kế đáp ứng
Vì vậy, nếu duy trì các trang web khác nhau cho các thiết bị khác nhau không phải là câu trả lời, thì sao? Thiết kế web đáp ứng .
Thiết kế đáp ứng là nơi bạn sử dụng truy vấn phương tiện CSS để xác định kiểu cho các thiết bị có độ rộng khác nhau. Thiết kế đáp ứng cho phép bạn tạo một trang web cho cả người dùng di động và không di động. Sau đó, bạn không phải lo lắng về nội dung hiển thị trên trang web dành cho thiết bị di động hoặc nhớ chuyển những thay đổi mới nhất cho trang web trên thiết bị di động của mình. Ngoài ra, một khi bạn đã viết CSS, bạn không phải tải xuống bất kỳ thứ gì mới.
Thiết kế đáp ứng có thể không hoạt động hoàn hảo trên các thiết bị và trình duyệt cực kỳ cũ (hầu hết trong số đó là sử dụng rất nhỏ ngày nay và không nên lo lắng nhiều cho bạn), nhưng vì nó là phụ gia (thêm kiểu vào nội dung, thay vì lấy nội dung những người đọc này sẽ vẫn có thể đọc được trang web của bạn, nó sẽ không trông lý tưởng trên thiết bị hoặc trình duyệt cũ của họ.