Tutorial

Device Optimization for Signup Forms

  • 22 October 2020
  • 0 replies
  • 117 views

Badge +3

Since cellphones and mobile devices have become more prominent in our daily lives, shopping online has become easier now more than ever, as it can be done on the go from virtually anywhere. However, optimizing for the mobile experience can be a tough issue to tackle, since browsers really only accommodate for one format - the portrait view. Having a vertical form can be difficult to click and type on, and it can also be hard to read.


Here’s an example of what a landscape form looks like on both Desktop and Mobile:

a6TvVAt9WJ_HjT54SESbGn_5s1uNxqu2hD2ZrtQI7C1n7ddbYL6mhDTC_RdOZslZqZHH7AvKLouGtUCu9SBqULpjvLvg5XPlwCsj9aMkc-JgtnqCT_pCZjGUZZxOqtTJuyb0yBD8

k0osGzEQvieV3kbTsIJVTJA8S08m4SowkpxkmC4N6t2NXpkAYVH96CKtSg-W6PggJ05cbBig8X7w5LKDDzU5elielY5oyk5erdhUZVbxPR3LJ7edwnJE4iPH9eGB6nwqe-oEQ9vG



 

Klaviyo’s signup form editor allows you to design device specific forms under the Behaviors tab.

k1Yguw-nheHsiSMyZbgDH-rtkmlgLBSTXBWs2mJS3AUNpLSgEmmqVV2pxwUjJWBjr3oAJkeh3rChSQA2AnyCbPahci9PW4ftwajfN4kRxi-Gyf6cvE6wJmsMQbbIPNFya8Oj5Pah

 

In contrast, here’s a more mobile optimized version:

Ppxsp69Dx8HogCaEJVLLTvYa-kmAcd4lyy2lG9IfD0Ygz63V1ZGzxap7_obbpWDjn6G2h1UwlNBVjmJQzBK-OrI5XGwOMic-_MF_ipdIE9wrAD8RAEUUkMIL-7bNz9DZZeg_zCc5


 

FUN TIP: if you want to see how it looks on your device, publish the form on a URL handle that you know is not necessarily a handle someone would visit, such as /test

HUTaIrk2esJDT_ZZFdkh9bF0EvAdICg6A_fKNPZk2DAtxzIP33V3POnVkeA37MNOXaVDLkmqxSe1KGMNBmhqwujasGiMl-zQV1suLeyFFa_uvnRdu4aqKmzjlmDp1EAAGqcqZ1lc

For further reading on optimizing your signup form experience, check out this detailed guide.
Want more tips for signup form best practices? Check out this on-demand training video


0 replies

Be the first to reply!

Reply