Hướng dẫn kinh nghiệm làm website responsive – giao diện mobile-friendly

 Website đang dần trở thành một kênh được sử dụng rộng rãi và phổ biến khắp internet. Người tạo trang web thì nhiều, đa phần các trang web được tạo để chạy trên máy tính. Nhưng thời buổi hiện tại một trang web tốt cần phải chuẩn cả trên mobile. Vậy thiết kế giao diện web cho mobile là gì?

Nó thực chất là một trang web với giao diện chuyên dụng để chạy trên mobile, điện thoại. Bùng nổ công nghệ cao, mỗi người đều ưa chuộng sử dụng điện thoại di động thông minh. Làm web chuẩn mobile có thể hỗ trợ bạn phát triển kinh doanh, quảng bá doanh nghiệp. Bởi người dùng hiện nay đều chuộng tìm hiểu và mua hàng trên điện thoại. Bởi vậy bạn muốn cạnh tranh với những shop khác thì web bạn cần chuẩn mobile.

Nội dung cần được giảm tối đa:

Những nội dung hiển thị trên PC có thể không hiển thị được trên mobile chính vì điều đó giảm tối đa nội dung là điều bạn nên chú ý đến khi có ý định thiết kế website chuẩn trên các thiết bị di động của mình. Một điều nữa, do tâm lý đọc thông tin trên di động khách hàng không muốn xuất hiện quá nhiều nội dung trên màn hình.

Những tính năng quan trọng nhất nên được thâu tóm một cách cô đọng nhất trong nội dung. Việc tối giản nội dung không chỉ là cách để giúp người dùng dễ dàng hơn khi tiếp xúc với website, mà còn giảm tải đươc khá nhiều tốc độ truy cập internet. Giúp người dùng truy cập vào web nhanh hơn. Phù hợp với tốc độ đường truyền 3g hiện nay tại Viêt Nam.

Nên bố trí 1 cột duy nhất:

Theo cách thiết kế thông thường trên màn hình máy tính, những thông tin có thể được rải trên nhiều cột khác nhau. Gồm có cột thông tin chính và những cột phục lục liên quan. Thế nhưng khi thiết kế trên mobile vì do hạn chế về kích thước của màn hình thế nên bố cục theo 1 cột duy nhất là cần thiết với kiểu thiết kế này. Chính những điều này không chỉ làm người dùng có thể dễ dàng đọc nội dung cần thiết, mà không bị hạn chế kích cỡ chữ phù hợp hơn với màn hình di động.



Tận dụng tối đa những tính năng sẵn có của mobile:

Ngoài việc như dễ dàng tiếp cận website của bạn ở mọi nơi, mọi lúc, trên mọi thiết bị di động thì thiết kế website chuẩn mobile còn có rất nhiều lợi thế hơn hẳn những thiết kế phổ thông như: , liên hệ khi cần thiết,  tính năng kết nối cuộc gọi và tính năng định vị vị trí thuận lợi.

Để tận dụng được những ưu điểm của thiết bị di động và nâng cao tiện ích trong thiết kế cụ thể như sau:

– Tính năng kết nối cuộc gọi:  Khi khách hàng bắt đầu click vào tính năng  ĐĂT MUA hay nút LIÊN HỆ trên trang web thì khi đó tính năng này sẽ được kết nối ngay với điện thoại. Khách hàng lập tức có thể được kết nối với tư vấn viên để mua hàng hay giải đáp những thắc mắc của mình. Và điều này không chỉ tạo tính tiện lợi mà còn tạo ra sự đồng bộ hóa, khiến cho hệ thống của bạn trở nên chuyên nghiệp hơn.

– Tính năng Xác định vị trí thuận lợi: Hầu hết mọi smartphone đều có tính năng định vị, chính vì điều đó bạn có thể yêu cầu khách hàng của mình kích hoạt tính năng này để chia sẽ vị trí hiện tại của họ. Để bạn có thể điều hướng, chỉ dẫn khách hàng đến những cửa hàng của bạn ngay gần tọa độ của khách hàng nhất

Chuyển đổi trang web responsive bằng CMS Plugin

Cách thứ hai để chuyển đổi trang web cho desktop thành trang web responsive là dùng plugin. Tuy nhiên, phương pháp này sẽ hoạt động tốt hơn với người dùng CMS như Joomla, Drupal hoặc WordPress.

Đối với người dùng WordPress, WPtouch và JetPack là những công cụ tốt nhất cho nhiệm vụ này.

Đối với người dùng Joomla, Responsivizer và JoomlaShine sẽ làm tốt công việc cần thiết.

Trong khi đó, nếu bạn sử dụng Drupal, ThemeKey và MobileTheme là những ứng dụng chúng tôi khuyên bạn nên sử dụng.

Tuy nhiên, vài plugin này không miễn phí sẵn. Bạn cần phải trả một khoản phí đăng ký để sử dụng nó. Chẳng hạn, bạn có thể phải trả tới $359 mỗi năm để sử dụng gói WPtouch pro Enterprise.



Sử dụng Responsive Theme

Theo lẽ thông thường, một thiết responsive sẽ tự động khiến website thân thiện với thiết bị di động. Bạn sẽ sở hữu trang web responsive để hiển thị tốt trên cả desktop và mobile khi dùng theme loại này.

Hiện tại, có rất nhiều responsive theme WordPress bạn có thể dùng. Vài theme không miễn phí, nhưng cũng không quá mắc và hoạt động trên cả tuyệt vời.

Một trong những responsive theme nhanh nhất trong WordPress là Avada. Theme này có thể load trang web trong chưa đầy 1 giây. Load time hoàn hảo nếu bạn muốn tạo trang web thân thiện với thiết bị di động.

Để chứng minh theme phản hồi nhanh và load nhanh, chúng tôi khuyên bạn nên sử dụng Pingdom.

Pingdom là công cụ cung cấp dữ liệu toàn diện về tốc độ trang web tốt nhất. Bạn chỉ cần copy link trang web, sau đó paste vào cột URL. Chọn nơi bạn muốn bắt đầu kiểm tra trang web và nhấn nút Start Test.

Pingdom sẽ hiển thị cấp độ của trang web (dựa trên hiệu suất tổng thể), thời gian load và nhiều yếu tố quan trọng khác.

Nó cũng sẽ đưa ra một số lưu ý về cách cải thiện tốc độ trang.

Dưới đây là kết quả thử nghiệm của Avada home portfolio style (đây là bản demo trực tiếp).


Đăng nhận xét

0 Nhận xét