Biểu mẫu liên hệ là một thành phần chính của nhiều trang web. Mặc dù chúng thường đơn giản nhưng bạn cần đảm bảo rằng chúng dễ sử dụng nếu bạn muốn thu thập khách hàng tiềm năng và giữ liên lạc với người dùng của mình. Đây thường không phải là vấn đề với lưu lượng truy cập văn phòng, nhưng việc sử dụng biểu mẫu có thể khó khăn nếu bạn đang sử dụng thiết bị di động.
Trong hướng dẫn này, chúng ta sẽ nói một chút về tầm quan trọng của việc thiết kế các biểu mẫu thân thiện với thiết bị di động. Tiếp theo, chúng tôi sẽ hướng dẫn bạn năm mẹo để đảm bảo biểu mẫu của bạn hoạt động trơn tru trên thiết bị di động.
Hãy làm việc!
Tại sao việc biểu mẫu của bạn trở nên thân thiện với thiết bị di động lại quan trọng
Biểu mẫu có đủ hình dạng và kích cỡ. Thông thường, bạn sẽ xử lý các biểu mẫu liên hệ:
Các hình thức đăng ký (đăng ký) cũng rất phổ biến vì chúng cho phép bạn thu thập email và nhắm mục tiêu chúng trong các chiến dịch:
Tuy nhiên, biểu mẫu có thể được sử dụng cho tất cả các loại mục đích khác. Ví dụ: bạn có thể thu thập thông tin bằng cách sử dụng bản khảo sát trực tuyến hoặc bảng câu hỏi , trong trường hợp đó, bạn sẽ cần các biểu mẫu cho phép người dùng nhập câu trả lời.
Nói cách khác, biểu mẫu rất linh hoạt và hầu như tất cả các trang web đều sử dụng biểu mẫu theo cách này hay cách khác. Do đó, điều cần thiết là các biểu mẫu của bạn phải dễ sử dụng (trừ khi bạn muốn cung cấp trải nghiệm khó chịu cho khách truy cập).
Sử dụng biểu mẫu từ máy tính để bàn hoặc máy tính xách tay thường rất dễ dàng. Bạn có đầy đủ chuột và bàn phím, vì vậy việc chọn trường bạn muốn sử dụng và nhập dữ liệu sẽ không thành vấn đề. Tuy nhiên, duyệt web từ điện thoại thông minh hoặc thiết bị nhỏ gọn khác của bạn có những phức tạp.
Khi thao tác bằng ngón tay trên màn hình nhỏ, việc tương tác với các biểu mẫu đôi khi có thể quá tải do các quyết định thiết kế không tốt. Đây là điều bạn nên tránh trong các thiết kế của riêng mình. Rốt cuộc, nếu người dùng di động không thể tương tác với biểu mẫu của bạn, bạn có thể mất chuyển đổi, khách hàng tiềm năng hoặc chỉ làm phiền khách truy cập.
Cũng cần hiểu rằng lưu lượng truy cập trên thiết bị di động hiện nay, nếu không muốn nói là quan trọng hơn các nguồn trên máy tính để bàn. Trên thực tế, lưu lượng truy cập trên thiết bị di động đã vượt qua thứ hai trong những năm gần đây. Điều này có nghĩa là thiết kế một trang web thân thiện với thiết bị di động nên là mục tiêu chính của bạn khi bắt đầu một dự án mới.
Mẹo 5 để thiết kế các biểu mẫu di động dễ sử dụng
May mắn thay, việc thiết kế các biểu mẫu thân thiện với thiết bị di động không khó như bạn tưởng tượng. Trong hầu hết các trường hợp, bạn chỉ cần ghi nhớ một số nguyên tắc cơ bản và kiểm tra kỹ lưỡng các biểu mẫu của mình trước khi đưa chúng vào sử dụng. Hãy nói về cách làm điều đó!
1. Xóa tất cả các phần không cần thiết
Biểu mẫu của bạn càng chứa nhiều trường thì càng khó sử dụng trên thiết bị di động. Thật vậy, việc sử dụng biểu mẫu trên thiết bị di động đơn giản là phức tạp hơn. Bằng cách giảm số lượng trường hoặc phần có trong biểu mẫu, bạn có thể tối đa hóa cơ hội được khách truy cập điền vào.
Đây là một ví dụ nhanh về một Mẫu liên hệ với một số trường bổ sung không cần thiết trên thiết bị di động:
Trong hầu hết các trường hợp, tất cả những gì bạn cần cho một Mẫu liên hệ là tên, email và nội dung thư bạn muốn nhận. Mọi thứ khác phụ thuộc vào loại trang web bạn đang sử dụng và nếu bạn đang cố gắng thu thập khách hàng tiềm năng.
Cuối cùng, biểu mẫu càng có ít trường, khách truy cập trên thiết bị di động càng dễ sử dụng chúng. Rốt cuộc, việc chọn một trường bằng màn hình cảm ứng có thể phức tạp, bất kể được thiết kế tốt như thế nào, để giảm thiểu số bước nhảy mà người dùng phải thực hiện.
Mục tiêu của bạn lúc này là xem xét các biểu mẫu hiện có trên trang web của bạn. Xem qua từng phần của chúng và xác định xem bạn có thực sự cần bất kỳ trường bổ sung nào ngoài những trường đã đề cập trước đó hay không. Nếu có trường thừa, chỉ cần xóa nó.
2. Sử dụng danh sách thả xuống nếu có thể
Hầu hết chúng ta đều cảm thấy thoải mái khi gõ trên thiết bị di động và sử dụng màn hình cảm ứng. Tuy nhiên, việc nhắn tin cho một người bạn và điền vào một Mẫu liên hệ là hai trải nghiệm rất khác nhau. Với những thứ này, rất có thể bạn sẽ cảm thấy nản lòng nếu phải nhập nhiều thông tin.
Một cách để làm cho cuộc sống của khách truy cập trên thiết bị di động của bạn dễ dàng hơn là đơn giản hóa các lựa chọn mà họ phải thực hiện về các yếu tố của trang web của bạn. Để cung cấp cho bạn ý tưởng về những gì chúng ta đang nói đến, hãy tận dụng ví dụ trước của chúng ta về đặt phòng quán ăn:
Để tạo ra một đặt phòng, có thể bạn sẽ cần để lại tên, email, điện thoại et cho biết thời gian cũng như số lượng người có mặt. Có hai cách bạn có thể tạo trường biểu mẫu để xác thực thời gian trong ngày. đặt phòng:
- Cấu hình một trường chỉ chấp nhận các mục số.
- Thiết kế một danh sách thả xuống bao gồm tất cả thời gian có sẵn để đặt phòng.
Như bạn có thể tưởng tượng, cái sau thân thiện hơn với người dùng di động. Với cách tiếp cận này, họ không cần nhập số và họ chỉ có thể chọn những gì phù hợp nhất với họ từ các tùy chọn bạn đưa vào.
Ý tưởng để bạn xem các biểu mẫu của mình và xem chúng có bao gồm các trường mà bạn có thể thay thế bằng menu thả xuống hay không. Điều này không phải lúc nào cũng đúng vì bạn không thể sử dụng menu thả xuống để thu thập tên hoặc email, nhưng có thể sử dụng các tùy chọn khác.
Dù trường hợp sử dụng của chúng là gì, bạn muốn đảm bảo các menu thả xuống của mình bao gồm các tùy chọn dễ dàng chọn từ thiết bị di động. Nói cách khác, làm cho menu đủ lớn để ai đó không phải mổ bụng để chọn tùy chọn phù hợp.
3. Đảm bảo các nút gửi của bạn dễ chạm vào
Mẹo này khá đơn giản, nhưng vẫn cần được nhắc đến. Mọi biểu mẫu bạn thiết kế nên bao gồm một cách để người dùng xác nhận rằng họ muốn gửi dữ liệu đã nhập. Trong hầu hết các trường hợp, điều đó có nghĩa là tạo nút gửi:
Khi sử dụng máy tính thông thường, nhấp vào nút gửi là điều tự nhiên nhất trên thế giới. Tuy nhiên, chúng tôi đã gặp một số biểu mẫu trên thiết bị di động, nơi việc nhấn nút khó hơn nhiều.
Nếu khách truy cập của bạn không thể gửi thông tin họ đã nhập trong các biểu mẫu của bạn, tất cả nỗ lực của bạn sẽ bị lãng phí. Thêm vào đó, không có gì trông không chuyên nghiệp bằng một nút bấm gởi Điều đó không làm việc như mong đợi.
Để thiết kế các nút gửi tốt hơn cho thiết bị di động, dưới đây là ba mẹo để xem xét:
- Đảm bảo rằng chúng đủ lớn để bạn có thể dễ dàng nhấn trên thiết bị di động.
- Không đặt các nút của bạn quá gần với các vật phẩm khác để người dùng không chạm vào chúng đúng cách.
- Làm nổi bật các nút của bạn, chẳng hạn như sử dụng màu sắc tương phản hoặc kiểu chữ sáng tạo.
Trên hết, bạn cũng sẽ muốn kiểm tra các nút của mình trước khi trang web của bạn hoạt động. Chúng tôi sẽ đi sâu hơn về cách thực hiện điều này sau một phút. Còn bây giờ, hãy nói về hiệu suất.
4. Đảm bảo các biểu mẫu của bạn tải nhanh
Chúng tôi nói rất nhiều về hiệu suất trang web trong nhiều bài báo của mình và đó không phải là vì chúng tôi cần tốc độ. Vấn đề là, hầu hết mọi người không thích các trang web chậm, điều này hoàn toàn hợp lý.
Với tốc độ internet nhanh hơn, có thể khó để đợi một trang web tải quá lâu. Ngoài ra, tốc độ internet di động có xu hướng thay đổi nhiều hơn so với kết nối gia đình thông thường. Điều này có nghĩa là trang web của bạn sẽ phải được tối ưu hóa cao cho các thiết bị di động nếu bạn muốn giữ cho những người dùng này hài lòng, vì không phải tất cả họ đều có thể truy cập internet (tức là nhanh).
Mẹo cụ thể này có thể áp dụng cho toàn bộ trang web của bạn, nhưng nó cũng quan trọng đối với các trang di động hiển thị biểu mẫu của bạn. Nếu các phần này của trang web của bạn tải quá lâu, bạn mất các hội nghị và cơ hội để kết nối với khách truy cập của bạn.
Nói chung, một trang web sẽ không mất quá hai giây để tải. Khi bạn vượt qua giới hạn này, tỷ lệ thoát có xu hướng tăng đáng kể, đây là một tin khủng khiếp đối với bạn và với bản chất của duyệt web trên thiết bị di động, tốt nhất bạn nên giữ thời gian này càng thấp càng tốt. .
Với suy nghĩ này, có nhiều cách để cải thiện hiệu suất tổng thể của trang web của bạn. Ví dụ: bạn có thể nâng cấp lên gói tốt hơnchỗ ở, hãy sử dụng chủ đề đáp ứng được tối ưu hóa cho tốc độ và nén hình ảnh của bạn. Tất nhiên, những điều này sẽ giúp ích cho tất cả người dùng, nhưng sẽ đặc biệt hữu ích cho những người sử dụng thiết bị nhỏ hơn.
5. Kiểm tra biểu mẫu của bạn trước khi xuất bản
Xem xét rằng biểu mẫu là một phần quan trọng của hầu hết các trang web, bạn nên kiểm tra chúng kỹ lưỡng trước khi xuất bản. Với WordPress, quá trình này khá đơn giản. Bạn có thể tiếp tục và thiết kế các trang cụ thể để hiển thị biểu mẫu của mình và không xuất bản chúng cho đến khi bạn đã kiểm tra đầy đủ.
Tất nhiên, bạn muốn sử dụng plugin hoặc chủ đề nào là tùy thuộc vào bạn (miễn là nó có thể giúp phát triển các trang web di động). Tuy nhiên, khi nói đến giai đoạn thử nghiệm, chúng tôi khuyên bạn nên giữ nó đơn giản và sử dụng các công cụ như công cụ phát triển cơ rôm để thực hiện công việc.
Hãy xem qua một ví dụ nhanh. Nếu bạn đang sử dụng Chrome, hãy tiếp tục và xem trước trang có biểu mẫu bạn muốn kiểm tra. Sau đó nhấp chuột phải vào bất kỳ đâu trên trang này và chọn tùy chọn thanh tra . Chrome sẽ hiển thị một bộ công cụ mà bạn có thể sử dụng để xem xét và chỉnh sửa mã nguồn của trang ở bên phải và bên trái, bạn có thể xem bản xem trước về giao diện của nó từ thiết bị di động:
Ở đầu màn hình, bạn có thể sử dụng menu để chuyển đổi giữa các độ phân giải khác nhau. Chrome bao gồm cài đặt cho một số thiết bị di động phổ biến, nhưng bạn cũng có thể nhập độ phân giải tùy chỉnh.
Tại thời điểm này, bạn nên kiểm tra giao diện và hoạt động của biểu mẫu liên hệ của mình trên nhiều thiết bị. Hãy lấy ví dụ bên dưới - biểu mẫu hoạt động tốt, nhưng bạn có thể thấy rằng nó không phù hợp như bình thường. Đặc biệt chú ý đến văn bản và các biểu tượng, đặc biệt là quá gần với cạnh của màn hình:
Một cách để ngăn chặn vấn đề này là giữ cho các biểu mẫu của bạn đơn giản, như chúng tôi đã đề cập trong mẹo đầu tiên. Trong ví dụ bên dưới, biểu mẫu sử dụng nhiều danh sách thả xuống và chỉ yêu cầu ba trường. Điều này làm cho nó dễ sử dụng và quan trọng hơn, hình thức đơn giản đến mức nó phải hoàn toàn phù hợp với tất cả các thiết bị:
Nếu bạn gặp bất kỳ vấn đề nào với bất kỳ biểu mẫu nào của mình, bạn rõ ràng cần phải giải quyết chúng ngay lập tức. Nếu không, bạn có nguy cơ xa lánh đối tượng di động của mình, điều mà chúng tôi cố gắng tránh trước tiên!
Kết luận
Đảm bảo trang web của bạn tương thích với các thiết bị di động là chìa khóa để giữ lưu lượng truy cập và không làm mất lòng khách truy cập của bạn. Cụ thể, biểu mẫu của bạn phải dễ sử dụng trên thiết bị di động nếu bạn không muốn bỏ lỡ việc nhận tin nhắn hoặc thu thập khách hàng tiềm năng có giá trị.
Khi nói đến thiết kế biểu mẫu thân thiện với thiết bị di động, dưới đây là năm mẹo để đơn giản hóa cuộc sống của bạn:
- Xóa tất cả các phần không cần thiết.
- Sử dụng danh sách thả xuống nếu có thể.
- Hãy chắc chắn rằng các nút gửi của bạn dễ bấm.
- Đảm bảo các biểu mẫu của bạn tải nhanh.
- Kiểm tra các biểu mẫu của bạn trước khi xuất bản chúng.
