{"id":9598,"date":"2011-04-04T21:30:18","date_gmt":"2011-04-04T13:30:18","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=9598"},"modified":"2024-05-16T11:46:25","modified_gmt":"2024-05-16T03:46:25","slug":"login-registration-form","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/","title":{"rendered":"Login \/ Registration Form: Ideas and Beautiful Examples"},"content":{"rendered":"<p><strong>Note:<\/strong> This post was first published on the 4th April, 2011.<\/p>\n<p>All throughout the modern web, we are seeing a growing amount of places for user input. These include shopping carts, interactive web games, and, most certainly, website registration forms. It seems that not only should designers be focusing on page design, but form aesthetics also play an equally vital role.<\/p>\n<p>Consider how many forms you may have filled out over the course of your Internet history. There are countless examples from forums, message boards, blogs, and so many more. In this article, we\u2019ll look at some great tricks to designing your in-page forms.<\/p>\n<p>It is wise to consider some of the items here from an objective perspective. Although many login and registration forms work well with one type of site, there is no final judgment call on what\u2019s the \u201cbest\u201d solution. Use your design intuition to apply bits and pieces from forms you aspire towards.<\/p>\n<h2>Consider Multiple Inputs<\/h2>\n<p>To start things off, consider a small contact form from Foundation Six Web Design. Yes, this isn\u2019t a login form, so it may steer a bit off-topic. However, their page design is impressive and shows you what a little creativity can achieve.<\/p>\n<p>Each of the input fields offers room for you to type personal contact info \u2013 name, e-mail, etc. The styles go far beyond ordinary, offering user input in a type of handwritten calligraphy. This type of formatting will keep your users in a state of wonder and achieve a goal of much higher design standards.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg\" width=\"500\" height=\"256\" alt=\"multiple input\"><\/figure>\n<p>You\u2019ll want to implement styles like these similar to all of your login pages. I certainly wouldn\u2019t recommend sticking with the same style of input text and option\/select menus. When jogging your brain for creativity, consider how each element should be laid out: plenty of space between layers, large easily-readable text, and even sidebar links to their direct e-mail line.<\/p>\n<h2>jQuery Login Boxes<\/h2>\n<p>This has been used on countless websites in the past and will surely be seen within new-age designs. Long gone are the days when standard practices would bring users onto a new page for each step of the login process. Normally this would mean a page to input your data and also a new page for processing login information.<\/p>\n<p>Pixel2Life offers some fantastic insight into a new field of data input. From their homepage, you can click the login link and bring up a dynamic jQuery-powered login box. This form contains an Ajax call to an external PHP script that checks the credentials of your login info and, once processed, either grants or denies access.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/jquery-login.jpg\" width=\"500\" height=\"392\" alt=\"jquery login\"><\/figure>\n<p>Going further, astute may notice a registration link directly below the login box. This offers a much smoother user experience for those looking to sign up for the website but unable to locate the registration link.<\/p>\n<p>If a user doesn\u2019t have an account but would like to make one, this brings them onto the registration page without any buggy page glitches. The log-in box would still be a viable option for accessing your own account; however, allowing the option gives way for greater returns and higher volumes of new registrants.<\/p>\n<h2>Simple One-Page Registrations<\/h2>\n<p>Another shifting paradigm we see is lacking in such detail for new account registrations. This isn\u2019t necessarily a bad statistic assuming users are growing impatient with filling out data. The numbers actually suggest websites with shorter registration pages garner <strong>heavier<\/strong> lists of new users daily.<\/p>\n<p>Sikbox offers a lightweight option for visitors to create their own search box for a website. The only requirement is your own custom domain which to provide search results for. The input fields are large, the text is very simple to read, and there are <strong> no advertisements<\/strong> to distract users from building their search form!<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/one-page-registration.jpg\" width=\"500\" height=\"281\" alt=\"one page registration\"><\/figure>\n<p>Now, this isn\u2019t the best form to build off when creating your own registration page for a forum or blog archive. These will, by standard definition, at least require some type of e-mail address\/username combination along with a password. Some new-age web applications will generate dynamic passwords for users just to make the registration process quicker.<\/p>\n<p>Of course, the trade-off here is lacking control on the user\u2019s end to generate their own password, which many people are accustomed to.<\/p>\n<h2>Build off Flashy Effects<\/h2>\n<p>One of the greatest signup experiences I\u2019ve ever had was creating my first <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.tumblr.com\/\">Tumblr account<\/a>. The home page of their site offers both login and signup forms placed directly beneath each other with new CSS3 highlight\/fade effects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/thumblr.jpg\" width=\"500\" height=\"187\" alt=\"Tumblr\"><\/figure>\n<p>This systematic approach is similar to Pixel2Life\u2019s jQuery login area. However, the difference with Tumblr is the network cannot offer any content to those without a blog (aside from browsing others\u2019 accounts). The real benefit from Tumblr is creating your own blog and following others \u2013 thus, your main objective on the front page is either to create an account or log in.<\/p>\n<p>There are some bugs with this system. Most notably, IE6\/IE7 does not support these new CSS properties. Also used on the home page is a system for adding label elements into form input values \u2013 basically overruling the \u201cdefault\u201d characters used for email\/password boxes.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/twitter.jpg\" alt=\"Twitter Login Box\" width=\"500\" height=\"268\"><\/figure>\n<p>These labels fade away on focus in modern browsers such as Chrome\/Firefox. But no such luck with the deprecated browsers, which, as you can imagine, is quite annoying trying to re-read your own input!<\/p>\n<h2>20+ Examples of Beautiful Form Design<\/h2>\n<p>Below is a quick roundup gallery of some fantastic login form designs. These have been picked from around the web and include numerous forms of web applications.<\/p>\n<p>If you have suggestions for other sites, feel free to share them in the comments section below!<\/p>\n<p><strong><a href=\"https:\/\/www.hongkiat.com\/blog\/go\/freshbooks\" rel=\"nofollow noopener\" target=\"_blank\" class=\"js-aw-brand-link\" data-feed=\"NwcTbnuIf8MC0TkkS78vJe8tzBoHcg1a\">Freshbooks<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/freshbook.jpg\" width=\"500\" height=\"187\" alt=\"freshbook\"><\/figure>\n<p><strong>Snoggle News<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/Snoggle-News.jpg\" width=\"266\" height=\"224\" alt=\"Snoggle News\"><\/figure>\n<p><strong>Robo.to<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/roboto.jpg\" width=\"343\" height=\"459\" alt=\"robo.to\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"http:\/\/virb.com\/\">Virb<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/virb.jpg\" width=\"500\" height=\"331\" alt=\"virb\"><\/figure>\n<p><strong>Grooveshark<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/grooveshark.jpg\" width=\"500\" height=\"393\" alt=\"grooveshark\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.storenvy.com\/\">Storenvy<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/storenvy.jpg\" width=\"434\" height=\"359\" alt=\"storenvy\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.dropbox.com\/\">Dropbox<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/dropbox.jpg\" width=\"478\" height=\"347\" alt=\"dropbox\"><\/figure>\n<p><strong>Green Globe Ideas<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/green-globe.jpg\" width=\"350\" height=\"204\" alt=\"green globe\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/go\/themeforest\/\">Themeforest<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/themeforest.jpg\" width=\"500\" height=\"344\" alt=\"themeforest\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/mailchimp.com\/\">MailChimp<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/mailchimp.jpg\" width=\"500\" height=\"435\" alt=\"mailchimp\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/launchpad.37signals.com\/basecamp\/signin\">BaseCamp<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/basecamp.jpg\" width=\"500\" height=\"314\" alt=\"basecamp\"><\/figure>\n<p><strong>TestFlight<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/testflight.jpg\" width=\"500\" height=\"350\" alt=\"testflight\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"http:\/\/www.awesomejs.com\/order\/\">AwesomeJS<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/awesomejs.jpg\" width=\"412\" height=\"305\" alt=\"awesomejs\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.unlocking.com\/\">Unlocking<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/unlocking.jpg\" width=\"328\" height=\"369\" alt=\"unlocking\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.popscreen.com\/join\">PopScreen<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/popscreen.jpg\" width=\"500\" height=\"417\" alt=\"popscreen\"><\/figure>\n<p><strong>Gowalla<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/gowalla.jpg\" width=\"336\" height=\"405\" alt=\"gowalla\"><\/figure>\n<p><strong><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"http:\/\/www.kontain.com\/signup\">Kontain<\/a><\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/kontain.jpg\" width=\"500\" height=\"164\" alt=\"kontain\"><\/figure>\n<p><strong>MobileMe<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/mobileme.jpg\" width=\"500\" height=\"156\" alt=\"mobileme\"><\/figure>\n<p><strong>Laterthis<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/laterthis.jpg\" width=\"484\" height=\"369\" alt=\"later this\"><\/figure>\n<p><strong>Launchlist<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/launchlist.jpg\" width=\"500\" height=\"224\" alt=\"launchlist\"><\/figure>\n<p><strong>Theidealist<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/theidealists.jpg\" width=\"500\" height=\"317\" alt=\"theidealist\"><\/figure>","protected":false},"excerpt":{"rendered":"<p>Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These include shopping carts, interactive web games, and, most certainly, website registration forms. It seems that not only should designers be focusing on page design, but form aesthetics&hellip;<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[4655,1312,1659],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.6) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Login \/ Registration Form: Ideas and Beautiful Examples - Hongkiat<\/title>\n<meta name=\"description\" content=\"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Login \/ Registration Form: Ideas and Beautiful Examples\" \/>\n<meta property=\"og:description\" content=\"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2011-04-04T13:30:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-05-16T03:46:25+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg\" \/>\n<meta name=\"author\" content=\"Jake Rocheleau\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jake Rocheleau\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/\"},\"author\":{\"name\":\"Jake Rocheleau\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\"},\"headline\":\"Login \\\/ Registration Form: Ideas and Beautiful Examples\",\"datePublished\":\"2011-04-04T13:30:18+00:00\",\"dateModified\":\"2024-05-16T03:46:25+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/\"},\"wordCount\":987,\"commentCount\":42,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/login-registration-forms\\\/multiple-input.jpg\",\"keywords\":[\"appwiki\",\"Forms\",\"login\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/\",\"name\":\"Login \\\/ Registration Form: Ideas and Beautiful Examples - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/login-registration-forms\\\/multiple-input.jpg\",\"datePublished\":\"2011-04-04T13:30:18+00:00\",\"dateModified\":\"2024-05-16T03:46:25+00:00\",\"description\":\"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/login-registration-forms\\\/multiple-input.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/login-registration-forms\\\/multiple-input.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/login-registration-form\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Login \\\/ Registration Form: Ideas and Beautiful Examples\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\",\"name\":\"Jake Rocheleau\",\"description\":\"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers\",\"sameAs\":[\"https:\\\/\\\/www.hongkiat.com\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/jake\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Login \/ Registration Form: Ideas and Beautiful Examples - Hongkiat","description":"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/","og_locale":"en_US","og_type":"article","og_title":"Login \/ Registration Form: Ideas and Beautiful Examples","og_description":"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These","og_url":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2011-04-04T13:30:18+00:00","article_modified_time":"2024-05-16T03:46:25+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg","type":"","width":"","height":""}],"author":"Jake Rocheleau","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Jake Rocheleau","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/"},"author":{"name":"Jake Rocheleau","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a"},"headline":"Login \/ Registration Form: Ideas and Beautiful Examples","datePublished":"2011-04-04T13:30:18+00:00","dateModified":"2024-05-16T03:46:25+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/"},"wordCount":987,"commentCount":42,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg","keywords":["appwiki","Forms","login"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/","url":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/","name":"Login \/ Registration Form: Ideas and Beautiful Examples - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg","datePublished":"2011-04-04T13:30:18+00:00","dateModified":"2024-05-16T03:46:25+00:00","description":"Note: This post was first published on the 4th April, 2011. All throughout the modern web, we are seeing a growing amount of places for user input. These","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/login-registration-form\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/login-registration-forms\/multiple-input.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/login-registration-form\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Login \/ Registration Form: Ideas and Beautiful Examples"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a","name":"Jake Rocheleau","description":"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers","sameAs":["https:\/\/www.hongkiat.com"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/jake\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-2uO","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/9598","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=9598"}],"version-history":[{"count":4,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/9598\/revisions"}],"predecessor-version":[{"id":71896,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/9598\/revisions\/71896"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=9598"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=9598"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=9598"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=9598"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}