首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么这个按钮在另一个按钮的右边,为什么不在左边?

这个问题涉及到用户界面设计和用户体验的原则。按钮的位置选择应该根据以下几个因素来考虑:

  1. 习惯性因素:在大多数文化中,人们习惯将主要操作放在右侧,因为大多数人是右撇子,右手更容易操作。因此,将主要按钮放在右侧可以提高用户的可用性和操作效率。
  2. 阅读顺序:在大多数文化中,人们习惯从左到右进行阅读,因此在用户界面设计中,通常将主要操作放在左侧,次要操作放在右侧。这样设计可以符合用户的阅读习惯,提高用户的理解和操作效率。
  3. 视觉重点:按钮的位置也可以根据界面的布局和视觉重点来选择。如果界面的重点在左侧,将按钮放在左侧可以更好地吸引用户的注意力。反之,如果界面的重点在右侧,将按钮放在右侧可以更好地突出主要操作。

总结起来,按钮在另一个按钮的右边的设计选择是为了符合用户的习惯、阅读顺序和视觉重点,提高用户的可用性和操作效率。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

为什么客户端发送信息时候按发送按钮无法发到服务器端?

一、前言 前几天Python白银交流群【无敌劈叉小狗】问了一个Python通信问题,问题如下:大家能帮我看看为什么客户端发送信息时候按发送按钮无法发到服务器端?...具体表现就是点了发送但服务器收不到,如下图所示: 二、实现过程 这里【啥也不懂】给了一个指导,他当时赶车,电脑不太方便,让粉丝截图了代码,直接看图。这里提出来了几个怀疑点。...顺利地解决了粉丝问题。 如果你也有类似这种Python相关小问题,欢迎随时来交流群学习交流哦,有问必答! 三、总结 大家好,我是Python进阶者。...这篇文章主要盘点了一个Python库下载失败问题,文中针对该问题,给出了具体解析和代码实现,帮助粉丝顺利解决了问题。...最后感谢粉丝【无敌劈叉小狗】提出问题,感谢【啥也不懂】给出思路,感谢【莫生气】等人参与学习交流。

13710

从苹果按钮说起,交互设计中那些小细节

苹果说,不论移动或电脑设备,行动按钮(Action button)都放在右边,也就是说*确定按钮放在右边*: 苹果移动设备 苹果电脑设备 微软说,除了删除之类负向操作外,不论移动或电脑设备,*确定按钮放在左边...然后再让他们剩下图中选择最不喜欢,再按确定按钮提交。这个实验关键是,选择不喜欢图时,*确定和重置按钮位置被悄悄替换了*。...用来测试是一个iPad上展示黑白简易网站: 然而,这30人被分成A和B两组,A组先使用放在左边的确定按钮,再使用放在右边的确定按钮;B组先使用放在右边的确定按钮,再使用放在左边的确定按钮。...真正意想不到是,第二次选图时,如果按钮从左换到右边(A组),错误率稍有提升达到23.08%;如果确定按钮从右换到左边(B组),错误率竟然从第一步0%冲到了*66.66%*!...如果不是亲自做这个实验,我可能不会相信这个结果。 那么,为什么唯独将确定按钮从右换到左时,才有超过一半的人点错呢?

1.1K50
  • 一件交互设计大事,确定按钮放在左还是右?

    苹果说,不论移动或电脑设备,行动按钮(Action button)都放在右边,也就是说*确定按钮放在右边*: 苹果移动设备 苹果电脑设备 微软说,除了删除之类负向操作外,不论移动或电脑设备,*确定按钮放在左边...用来测试是一个iPad上展示黑白简易网站: 然而,这30人被分成A和B两组,A组先使用放在左边的确定按钮,再使用放在右边的确定按钮;B组先使用放在右边的确定按钮,再使用放在左边的确定按钮。...真正意想不到是,第二次选图时,如果按钮从左换到右边(A组),错误率稍有提升达到23.08%(3/13,注:减去了第一次出错的人);如果确定按钮从右换到左边(B组),错误率竟然从第一步0%冲到了*66.66%...如果不是亲自做这个实验,我可能不会相信这个结果。 那么,为什么唯独将确定按钮从右换到左时,才有超过一半的人点错呢?...估计那些没点错少部分人中,不少人都是差点按错,最后时刻才发现并纠正。 所以,得出结论,只有确定按钮放在右边时,使用体验才是最顺畅吗? 这个结论,无法轻易得出。

    1.8K70

    UI界面视觉平衡终极指南

    可以发现左边正方形比圆形面积大,视觉权重也更大。而右边圆形和正方形面积是是相等,它们视觉效果也更平衡。 我们也可以用方形和三角形来见证同样效果。...图标按钮情况与文本按钮略有不同。我们把“发送”图案放在一个圆形按钮背景上。你认为哪种图标视觉上更平衡? ? 你应该已经注意到左边不平衡了,这是因为不同对齐方法。...所以从视觉上来说,左边那种被修改过圆形会比右边几何圆形看起来更加圆润。 ? 我们如何利用这一原理?当然是圆角!...可以发现右边按钮有更平滑圆角,而且视觉效果也更好。 APP 图标也是如此,用标准圆角是不能达到完美效果深入讨论这个话题之前,我们先来看看两个不同圆形。 ?...Marc Edwards提出了拉姆曲线公式,使得形状视觉上光滑而完美。ios7桌面图标就基于此公式。 ? 后来这个形状通过黄金分割网格进行了修改。其思想是不变,不过这是另一个故事了。 ?

    2.5K40

    iOS 与 Android APP 设计差异

    左边是iOS标准日期选择器; 右边是Android标准日期选择器 左边是iOS标准选择器;右边是Android标准选择器 IOS和Android中按钮样式 Android设计规范中有2种不同样式按钮...左边是标准Android按钮右边是标准iOS按钮 还有一种非常有特点按钮类型——Android上叫做浮动按钮iOS上叫做活动按钮。浮动按钮用来展示应用主要操作。...例如,邮件APP中写邮件,或者社交APP中发状态都会用到这个浮动按钮。...正是因为有差异,所以需要密切关注不同平台排版和布局规范。 左边是Android字体; 右边 是iOS字体 交互细节差异 给用户第一印象通常都是建立设计层面。...左边是iOS版Gmail,右边是Android版Gmail 左边是iOS版Instagram,右边是AndroidInstagram 但其实显而易见——使用两个平台系统自身组件设计应用,流程要快很多

    3.4K10

    真·佛系研究:日本开发佛像情绪识别器,还能寻找你“真命天佛”

    比如,三面六臂阿修罗,如果从右边看,有点悲伤;如果从左边看,稍显喜感。 传统上,佛像不应该附有年龄和情感,也不应该有性别,当然守护神除外。...尽管如此,学者们认为,雕塑家往往受到他们时代品味和风格影响,以及那些佛陀雕塑委托人愿望。例如,欢乐表情一个时期流行,而愤怒表达另一个时期受到青睐。...点击同意以后会出现两个按钮左边是上传,右边是摄像头拍照。 点击左边。 点击上传和拖拽都可以。 这次我们试着上传一张Lecun照片试试,Lecunの霸气笑顔!...继续滚轮往下,识别出情感后,出现一个吊胃口画面,“和你结缘佛像是...”。 这个时候不要傻傻地等它结果出来,你会发现怎么等都出不来(别问我为什么知道)。直接滚轮往下,于是得到了和自己匹配结果了。...可以看到,大多佛像都是中立表情,这也符合佛像雕刻讲究,佛像为了体现出超然,没表情更好。 拉到底,还有一些更具体分析,文摘君就不在此一一赘述啦。

    43020

    Pycharm交互式开发环境【图文讲解】

    关于这个环境长什么样子以及怎么用,可以跟着我步骤来看看。...一、使用Python Console 交互式开发环境 打开Pycharm界面,然后单击界面最下面的Python Console这个按钮,单击后会调出一个控制台,这个控制台将自动加载已经调试过解释器。...在这个控制台里,程序员可以在三个绿色箭头>>>后面直接书写代码,不加print时候也行输出数据,当然print在这里也是可以用左边书写代码,右边显示数据。...1.png 左边书写代码,右边显示数据,数据类型也会显示出来 2.png 到底是怎么快速展示结果给程序员呢,下面看看展示步骤 绿色箭头后面直接输入变量名a,然后回车一下就可以得到变量a结果是Python...为什么不推荐复杂数据写在Python console开发环境中,因为这里写代码是临时存储在内存当中,并不会真实写在硬盘中,要是想要后期留存代码就比较麻烦了。

    98620

    pycharm交互式编程_环境影响因素有哪些

    一、使用Python Console 交互式开发环境 打开Pycharm界面,然后单击界面最下面的Python Console这个按钮,单击后会调出一个控制台,这个控制台将自动加载已经调试过解释器。...在这个控制台里,程序员可以在三个绿色箭头>>>后面直接书写代码,不加print时候也行输出数据,当然print在这里也是可以用左边书写代码,右边显示数据。...左边书写代码,右边显示数据,数据类型也会显示出来 到底是怎么快速展示结果给程序员呢,下面看看展示步骤 绿色箭头后面直接输入变量名a,然后回车一下就可以得到变量a结果是Python自学网。...为什么不推荐复杂数据写在Python console开发环境中,因为这里写代码是临时存储在内存当中,并不会真实写在硬盘中,要是想要后期留存代码就比较麻烦了。...Console按钮

    21020

    JavaFX之Scene Builder使用(开发一款GUI小工具原来这么简单)

    三、Scene Builder使用 下载完后打开,选择Basic Application就行,助于理解 打开完后应该是这个界面 中间就是咱们要设计桌面程序UI界面了,左边Library就有JavaFX...说白了就是控制这个界面的文件,可以理解为界面的代码表示~~ 为什么需要Controller类文件?...4.3 自定义界面 下面随意做个栗子: 1.随便拉一个button控件到白色区域 2.然后可以右边properties属性栏更改这个按钮样式,外观等等,例如我这里随便改了个hehe。...3.下面还有个code代码栏里面,可以设置这个按钮id,点击事件等等,例如我这里也改成了hehe,你们也可以改成xxxbutton,这样便于开发 4.点击上方有个preview按钮可以预览我们当前设置好界面...拿上面的按钮例子来解释一下标签中属性是干嘛吧~ fx:id指就是这个控件id值,为Controller类中控制这个控件 onAction指的是点击这个按钮就能实现什么功能 text指就是这个按钮文本

    9.7K31

    WinCE平台下按钮控件没有MouseUp等事件

    先在PC机上XP环境下写了一个测试控制程序,里面有如下效果:在按下按钮时云台开始动作,放开按钮时云台停止。XP环境下很容易实现,一个是按钮MouseDown事件,一个是按钮MouseUp事件。...后来想直接移植到WinCE平台下,但是突然发现WinCE下按钮事件没有MouseDown和MouseUp事件,如下图所示,左边为WinXp下按钮事件,右边为WinCE下按钮事件:     ...一直在想,为什么会存在这种差异,后来才突然想到,因为WinCE作为一种移动平台,很我时候都是用触屏,而现在简单单点触控技术,还不能产生MouseUp这样事件,可能微软是了为考虑软件兼容性,就去掉了这些按钮事件吧

    62640

    Emlog模板设置插件使用教程及开发规范

    一直以来,emlog走轻量级路线,没有集成模板后台设置,于是很多功能强大模板不得不在需要时候,修改文件以改变设置。...那么,有了这个插件以后,就可以不用如此纠结了,只要模板按照开发规范来开发,就可以使用本插件在后台进行设置了。...重点强调,本插件是辅助插件,所有设置依赖于模板功能,而不是插件本身,因此不要问我为什么没有blabla功能,请去寻求模板作者。...其中type属性和name属性必选,name是设置项名字,而type用来指定设置项类型,支持类型如下: radio: 单选按钮 checkbox: 复选按钮 text: 文本 image: 图片 page...对于radio和chexkbox,values属性用来设置各个按钮值和显示名称。

    52210

    Android之自定义View:侧滑删除

    我们这次要实现控件叫做EasySwipeMenuLayout,内部主要分为三部分: 内容区域 左边菜单按钮区域 右边菜单按钮区域 当我们向右滑时,通过scroller将左边按钮区域滚动出来...当我们向左滑时,通过scroller将右边按钮区域滚动出来 实现思路滤清了,那么我们就开始动手吧 具体实现 首先,网上类似的轮子有很多,但为什么我们还要自己写一下呢,当然是为了学习,所谓知其然而知其所以然也...开始前,我还想再说一点,网上有很多类似的轮子,但是我发现个特点,他们要求控件内子布局顺序相对呆板,不够灵活,也就是所谓通过约定来实现。...如下可以看到,就是通过id来绑定,让EasySwipeMenuLayout知道哪个childView是现实内容,哪个是左边菜单布局,哪个是右边菜单布局。 ?...为什么要这样子设计,我想法是,这样子更灵活,我不用规定里面的子布局顺序。 以上仅代表个人观点,当然,肯定有更好设计方案。

    1.3K30

    详解视觉误差对UI设计影响和解决方案

    画 icon 时候,一定要把视觉尺寸这个无法用数字进行衡量维度考虑进去。视觉重量小元素要放大,视觉重量大元素要缩小。...再看看发送按钮左边发送按钮与浅色背景输入框为了达成视觉对齐故意地做短了一点点,右边发送按钮也因为形状缘故被故意地做长了一点,达成视觉对齐。 ?...它们看起来是居中对齐,但实际上并不是,右边箭头形状按钮文字物理上并未居中对齐,它距离左右两边边距是不一样,这种形状按钮文字必须靠左一些才能看起来对齐。 ?...好吧,希望你能够看出来左边那颗按钮是有问题,实际上我画这枚按钮时候确实点了对齐,但是为什么还会出问题呢?跟文字按钮对齐一样,对齐方式选错了。...这个技法 App icon 制作上也有大量使用空间,深入分析之前,我们来看看下面两个 icon。 ? 左边是 Sketch 正圆圆角直出,右边是非正圆手动制作 icon。

    1.3K10

    提升UI产品体验14个细节!你都知道吗?

    特别是“功能说明和条款条件”或任何声明时,提炼要点有助于提升用户体验,这样也不至于让用户直接忽略。(彩云注:左侧大段文字我想应该没多少人会去阅读,右边至少还能在短时间内快速看看几个关键词。)...线上购物,表单填写,申请流程等场景使用这种格式能很好简化流程。(彩云注:左边表单UI不方便跟踪进度和流程,右边表单把进度放在顶部能帮助用户清楚知道流程进度。)...图片07按钮要正确合理从菲茨定律(Fitt's Law)中我们应该知道,目标区域距离和外观与所采取行动成正比。因此,为了将注意力集中转化按钮上,按钮应该准确放置合理位置上。...此外,按钮大小应该易于点击,避免用户因尝试点击时不方便而流失。(彩云注:左侧按钮不在正确决策位置以及按钮太小,右侧按钮简洁明了并且符合用户心理预期,能够让用户更快决策并点击。)...(彩云注:左侧选项圆角不一致,会让用户思考为什么这里会有不同,而右侧一致性选项设计,能让用户忽略内容外干扰。)

    77320

    项目需求讨论 — ConstraintLayout 详细使用教程

    题外话 关于ConstraintLayout文章网上一抓一大把,而且ConstraintLayout16年就已经出来了,但是我一直没有试着去使用(别问我为什么不去使用,当然是因为懒啊)。...绿色矩形B我们可以告诉它:你右边靠着外面界面的右边,你底边靠着外面界面的底边(然后B就处在了现在这个位置)。 所以基本操作就是:确定某个控件二个边位置(比如靠在哪个控件旁边)。...比如我们A按钮已经确定好位置了。我们现在要放B按钮,就像我们上面说,我们B按钮二个边位置,我们可以设置让B按钮左边靠着A按钮右边(相当于B按钮左边与A按钮右边处于同一位置)。...,让按钮右边与父布局右边对齐。...这时候因为不是单纯一边对齐,而是相同直线上二个边都被约束了。所以按钮无法紧靠着左边或者右边其中一个边界,所以这时候,这个按钮就会居于二个约束边界中间位置。如下图所示: ?

    1.7K20

    ConstraintLayout_1:可视化拖拽布局

    image.png 我们可以看到,现在主操作区域内有两个类似于手机屏幕界面,左边是预览界面,右边是蓝图界面。...这两部分都可以用于进行布局编辑工作,区别是左边部分主要用于预览最终界面效果,右边部分主要用于观察界面内各个控件约束情况。...其实这个需求很常见,比如说应用登录界面,都会有一个登录按钮和一个注册按钮,不管它们是水平居中也好还是垂直居中也好,但肯定都是两个按钮共同居中。...12.gif 可以看到,我们给登录按钮右边向Guideline添加约束,登录按钮下面向底部添加约束,并拖动按钮让它距离底部64dp。...然后给注册按钮左边向Guideline添加约束,注册按钮下面向登录按钮下面添加约束。这样就实现了让两个按钮水平方向上居中显示,垂直方向上都距离底部64dp功能了。

    1.4K20

    Django_rest框架实践项目(二) 为什么很少代码就可以实现增删改查?rest框架如何实现分页?页面实现登录按钮?权限控制

    之前已经创建了helloworld项目,并且我们只是写了很少一点代码,就实现了对数据库增删改查,为什么我们写了一点代码,就可以实现增删改查呢? 之前界面是 ?...为什么很少代码就可以实现增删改查? 因为rest框架路由,我们看我们写路由 ?...经过以上创建,就可以启动项目后,浏览器里面出现连接数据库界面, 首先我们看到就是根目录,这个就是我们urls.py里面的路径 ?...对,只要在setting里面配置了那个,那么浏览器页面就会出现分页按钮。 实现登录按钮 我们现在看我们页面 ? 顶部什么也没有,现在我们配置一下路由 ?...要实现登录按钮,那么url里面要加一句代码 api-auth这个名字是随便起,后面就是规定好 url(r’^api-auth/’, include(‘rest_framework.urls’

    91710

    面向所有人 UI 编程 :透过点按弹窗初尝 SwiftUI

    ,而且上下左右请留出边距;对了,选中后要弹出一个选项,左边是复制,右边是一个复制图标;啊,对了对了,英语字体最好是圆体字,而且两段文字都要加粗,就是小标题加粗那种感觉。...下图就是它们 Xcode 中预设。 ?...现在我们来观察上述代码结构,你会发现整段代码由一个名叫 VStack 视图和众多 Modifier 组成。 ? 那么 VStack 是什么呢?它里面为什么会包着两个 Text 呢?...在按钮中,我们需要设置两个点:按钮动作,也就是 action,里面的两行代码会将名言文字复制到剪贴板;另一个点是下面的 HStack ,表示一个水平排列 View。...其左边是一个文字,右边是一个图标。这里关于 Button 解释若你不熟悉编程可能会有点晕,没关系,我会在其它文章详细讲解。 ? 在上图中,你会发现背景变成蓝色了,为什么

    2.1K40

    nicegui布局细节补充——绝对定位,固定定位

    滚动到指定位置才出现 点击按钮,即可立刻回到页面顶部,并且按钮消失 本节使用 nicegui 版本为 1.4.21 绝对定位 专栏惯例:先说原理细节,再给出一个封装好便捷方法。...行6:为什么特意在卡片里面又套一个 column ?...比如 bottom:0; right:0 就是下边缘和右边缘距离为0,就是右下角了 稍微修改位置属性,就可以放到卡片上方靠中间: 位置属性可以用百分比,表达是容器高宽百分比。...卡片上方空白,是我们设置 padding 但是,定位是元素左边缘和上边缘,现在我们希望元素本身往左边移动自身宽度一半。...通过另一个属性,可以控制元素移动: transform:translateX(-50%) ,x轴,就是水平位置。这里百分比参照物是元素本身宽度。

    88710
    领券