AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

分享20个优秀的网页表单设计案例

2011-05-02 1680
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 　　表单是网站非常重要的一部分。网站的表单风格各异，可能是简洁的，也可能是多彩的、很有创意的，需要牢记的是表单设计应尽量吸引用户的注意力，引导他们想要往表单里填写信息。这里收集了一些很好的例子供大家参考。

　　表单是网站非常重要的一部分。网站的表单风格各异，可能是简洁的，也可能是多彩的、很有创意的，需要牢记的是表单设计应尽量吸引用户的注意力，引导他们想要往表单里填写信息。这里收集了一些很好的例子供大家参考。 

Sophie Hardach

forms35
forms36

Clyde Quay Wharf

forms23
forms24

37 East

forms25
forms26

Soapbox

forms37
forms38

RxBalance

forms39
forms40

EEHarbor

forms01
forms02

Contrast

forms03
forms04

SVN2FTP

forms05
forms06

Ally Creative

forms07
forms08

Think Vitamin Membership

forms09
forms10
forms11

Scribble & Tweak

forms12
forms13

Barnt & Arnst

forms14
forms15

The Bullitt Agency

forms16
forms17

Atlason

forms18

Major Tom

forms19
forms20

Michael Freimuth

forms27
forms28

Social Design House

forms29
forms30

Tinkering Monkey

forms31
forms32

Go Live!

forms33
forms34

Blind Pig Design

forms21
forms22

示例作品来源

The Best Designs
siteInspire
Unmatched Style

（编译来源：梦想天空  原文来自：25 Excellent Examples of Forms in Web Design）

文章标签：
JavaScript
前端开发
Go
内存技术
HTML5
移动开发
秋天风景
目录
相关文章
六卿
|
4月前
|
缓存 前端开发 数据可视化
前端基础(七)_表单的基本组成与使用
本文详细介绍了HTML表单的基本组成和使用，包括`<form>`标签、`<input>`表单域、`<select>`下拉列表、`<textarea>`多行文本域等元素。文章解释了表单的提交方式（GET和POST）、表单域的各种类型（文本、密码、单选按钮、复选框等）、提交按钮和重置按钮的作用，以及如何通过`<label>`标签提高表单的可访问性。此外，还讨论了表单元素的属性，如`readonly`、`disabled`、`maxlength`等。
六卿
57 1
好奇的菜鸟
|
7月前
|
数据采集 JavaScript 前端开发
HTML表单深度解析：构建互动的网页界面
HTML表单深度解析：构建互动的网页界面
好奇的菜鸟
74 2
东方睿赢
|
7月前
|
编解码 前端开发 JavaScript
带您一步步构建一个基本的动态新闻网站，包括页面布局、样式设计以及交互效果的实现
【6月更文挑战第14天】构建动态新闻网站实战项目，涉及页面布局、样式设计和交互实现。首页采用顶部导航栏、轮播图和新闻列表布局；新闻列表页按分类显示新闻，详情页展示完整内容并可添加相关推荐和评论。设计注重色彩搭配、字体选择和布局间距，实现轮播图效果、导航栏交互和响应式设计，提升用户体验。该项目有助于锻炼HTML和CSS技能，理解网页设计实际应用。
东方睿赢
245 1
游客hxsqda5l7xtqc
|
8月前
|
数据可视化 数据挖掘 API
5 款热门的表单设计器推荐
5 款热门的表单设计器推荐
游客hxsqda5l7xtqc
173 0
码匠Majiang
|
安全 数据安全/隐私保护 对象存储
表单的 9 种设计技巧【上】
表单是信息添加、录入的通用形式，合理的表单设计能减轻用户负担。这里码匠提供了一些表单设计的简单技巧。
码匠Majiang
751 0
表单的 9 种设计技巧【上】
刘金玉编程
|
前端开发 JavaScript 数据安全/隐私保护
form表单常见控件应用，实例讲解注册页面的开发【2020网页综合笔记03】
form表单常见控件应用，实例讲解注册页面的开发【2020网页综合笔记03】
刘金玉编程
201 0
form表单常见控件应用，实例讲解注册页面的开发【2020网页综合笔记03】
1026703026441891
|
存储 前端开发 数据可视化
实现一个表单设计器我们需要知道的
表单功能一直是前端项目中比不可少的一块功能，如果有个项目需要在两个月内开发200个左右表单，那我们应该怎么办？加班加点也是能搞出来的，那质量有保证么，这是我们就需要开发一个可以通过可视化交互设计表单的功能。下面和大家分享下我在开发这款表单设计器时使用的技术能力以及整个的设计思路。
1026703026441891
323 0
码匠Majiang
|
安全 数据库 数据安全/隐私保护
表单的 9 种设计技巧【下】
表单是信息添加、录入的通用形式，合理的表单设计能减轻用户负担。这里码匠提供的一些表单设计的简单技巧的下篇。
码匠Majiang
223 0
表单的 9 种设计技巧【下】
陶然同学
|
前端开发
【前端网页】引入CSS样式以及综合案例用户注册
【前端网页】引入CSS样式以及综合案例用户注册
陶然同学
141 0
【前端网页】引入CSS样式以及综合案例用户注册
陶然同学
|
前端开发 程序员
【网页前端】HTML表格、图片、列表、超链接以及综合案例练习
【网页前端】HTML表格、图片、列表、超链接以及综合案例练习
陶然同学
450 0
【网页前端】HTML表格、图片、列表、超链接以及综合案例练习

热门文章

最新文章

  • 1
    K8S之yaml 文件详解（pod、deployment、service）
  • 2
    AI大咖专访丨阿里靖世：博士的研究同样可以在工业界做，更可以影响亿万人的生活！
  • 3
    Swin Transformer实战：使用 Swin Transformer实现图像分类
  • 4
    阿里成立独立芯片公司“平头哥”；城市大脑2.0发布；马云谈新制造 | 云栖大会集锦
  • 5
    如何优雅打印nginx header和body
  • 6
    币安(binance)API接口
  • 7
    睿云智合的持续交付的传统的SOA的说法
  • 8
    APUE-文件和目录（二）函数access,mask,chmod和粘着位
  • 9
    Oracle中常用的数据类型
  • 10
    微信支付[v3]
  • 1
    Java快速入门之类、对象、方法
    33
  • 2
    操作系统智能助手OS Copilot评测
    40
  • 3
    mac git clone命令提示git@gitee.com: Permission denied (publickey).问题修复
    36
  • 4
    html5+svg太空人404动画模板源码
    30
  • 5
    方案测评 | 零基础一键AI剧本生成与动画创作
    72
  • 6
    Nginx，最强单体之一
    48
  • 7
    随机的暴力美学蒙特卡洛方法 | python小知识
    39
  • 8
    css3 svg制作404页面动画效果HTML源码
    47
  • 9
    DataV Note：让Jupyter Notebook绽放新活力
    53
  • 10
    【Azure APIM】APIM服务配置网络之后出现3443端口不通，Management Endpoint不健康状态
    45

    • 相关电子书

    更多
  • QQ移送页面框架优化实践
  • QQ移动页面框架优化实践
  • 基于浏览器的实时构建探索之路--玄寂

    • 相关实验场景

    更多
  • 前端开发基础3：CSS3常见显示属性
  • 前端开发基础2：VS Code和Edge的联动开发
    • 下一篇
    阿里云oss简介和如何对接使用