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

关于如何做一个“优秀网站”清单——规范篇

按返回,确保列表视图滚动到与细节链接/按钮被点击之前相同位置。 改善方法:当用户按“返回”,恢复列表中滚动位置。有些路由库可以帮你完成这个功能。...如果是通用按钮,您可能希望在点击将URL直接复制到用户剪贴板,提供他们社交网络来分享,或尝试新Web Share API与Android上本机共享系统集成。...将PWA添加到用户屏幕后,删除任何顶部/底部横幅。...Chrome显示权限请求,请确保该页面“暗淡”(覆盖上一层),所有内容与解释网站需要推送通知原因无关。...改善方法: 调用Notification.requestPermission时调暗屏幕。当用户选择后,再恢复屏幕原来样子。

3.1K70

最新iOS设计规范四|3大界面要素:视图(Views)

按钮放置在人们期望位置。一般而言,人们最有可能点击按钮位于右侧。取消按钮始终位于左侧。 正确标记取消按钮。取消警报操作按钮始终标记为“取消”。 识别破坏性按钮。...将“取消”按钮作为默认按钮,并使用粗体文本。 允许用户通过退出APP到主屏幕来取消警示框。警示框出现时,退出到主屏幕可以退出APP。这个操作产生与点击取消按钮效果是相同。...如果可能的话,让用户在一次点击中关闭一个浮层,同时打开另一个浮层。避免额外点击,尤其是需要在多个不同项目栏中打开浮层。 避免浮层太大。浮层不应该占据整个屏幕,足以显示其内容并指向触发按钮即可。...滚动视图缩放选项被打开,设置比较合适最大及最小值。例如:放大文本直到一个单一字符充满整个屏幕,即使其可能对于大部分应用来说是没有意义滚动视图处于页面模式考虑显示页面控制元素。...十二、网页视图Web Views) 网页视图可以在APP中加载和显示丰富网页内容。例如:嵌入式HTML和网站;邮箱APP使用网页视图来在消息中显示HTML内容。 ? 适当地使用前进和后退导航。

8.3K31
您找到你想要的搜索结果了吗?
是的
没有找到

使用Firefox开发工具做性能审计

网络监视器向您显示了一个列表视图,其中包含了Firefox发出所有网络请求(例如,加载页面,或者发送xmlhttprequest,获取API请求等等)。...HTML文档和所有相关样式表、图像和frames被完全加载,事件负载就会触发。...要开始分析加载时间性能,您可以: 单击底部状态栏中Analyze图标 网络监视器打开,重新加载页面或发出网络请求(实际上,这只是为了显示关于请求表格信息,而不是做加载性能分析)。...浏览器已经缓存了应用程序资源,从而避免了许多往返服务器过程。 您还可以使用Disable Cache设置来模拟在任何选项卡上打开DevTools首次加载web页面的情况。...使用性能工具,您可以在一段时间内启动当前打开web页面的性能分析,您可以使用start和stop记录按钮进行控制。然后,该工具将向您显示浏览器呈现页面的操作摘要、表格和图表视图

3.3K40

最新iOS设计规范五|3大界面要素:控件(Controls)

详情展开按钮 详情展开按钮打开视图(通常是模态视图),其中包含与屏幕上特定项目相关信息或功能。...列表中有详情展开按钮,点击该按钮会显示附加信息,点击其他位置则选择行或APP自定义行为。...折叠后,紧凑型样式将显示一个按钮,该按钮以应用程序主色显示当前值。人们点击按钮,日期选择器将扩展为模式视图,从而提供对熟悉日历样式编辑器和时间选择器访问。...执行无法量化任务(例如加载或同步复杂数据)加载器会旋转。任务完成后它会消失。活动加载器是不是可交互元素。 ? 进度条优于加载器。...网络加载时间超过几秒,才显示此加载器。加载很快情况下不要显示此加载器,因为它可能会在用户注意到它之前就消失了。

8.5K30

odoo Actions学习总结

如果未提供id,则客户端获取所请求模型指定类型默认视图(这由 fields_view_get()自动完成)。列表第一种类型是默认视图类型,在执行操作默认打开。...每个视图类型在列表中最多出现一次。...action配置如下打开依旧是tree视图,也就说view_mode似乎是如下文所述,type为ir.actions.act_window情况下,被忽略了,不起作用 { 'type':...form,指定需要加载记录(否则创建一个条新记录) search_view_id (可选) (id, name) 对, id 为动作需要加载指定搜索视图数据库ID。...在web客户端中默认为80 name(可选),action名称,界面显示拼接到当前面包屑导航(现有导航面包屑 / name值)。

2.6K30

Apriso开发葵花宝典之八Portal Session篇

导航到普通屏幕屏幕被放置在屏幕堆栈中,可以稍后返回。但是,您可以使用导航类型更改屏幕屏幕堆栈交互方式。...Screen Close 帮助Help 刷新:刷新当前屏幕 替换屏幕Replace Screen:替换屏幕堆栈中的当前屏幕 打开弹出视图Open Pop-up View 弹出一个窗口。...ActionView输出不为空,将从指定视图中采取一个动作,只允许当前可见视图名称 ToScreen和ToScreenProjectCode:执行“Go to Screen”导航类型到任何页面。...从模板创建视图,它视图操作也被复制(重复)。 View Operation特征: View操作负责呈现屏幕一部分。...默认情况下,视图模板使用所有不带按钮,并将它们显示在视图UI底部。可以通过将相关HTML代码移动到不同位置来进行调整。

8010

GitHub 标星10.2K:将任何设备转换为电脑辅助屏幕

) 01 Deskren功能特性 Deskreen 具有以下功能特性: 第二屏幕:使用任何带有 Web 浏览器设备作为计算机第二个屏幕 共享屏幕视图:将你计算机整个屏幕 共享应用程序视图:将Deskreen...限制为仅与任何具有 Web 浏览器设备共享单个应用程序视图。...这将在你平板电脑上打开一个带有连接状态页面。 ? 如果你没有相机扫描二维码 (QR),点击二维码 (QR) 下面的蓝色按钮将地址复制到剪贴板上。...然后,你可以共享复制地址并将其粘贴到 Web 浏览器地址栏以打开 Deskreen 查看器。你也可以在任何设备浏览器地址栏中手动键入蓝色按钮地址,以打开 Deskreen 查看器。...第二步:选择 单击 “允许” 按钮,系统将要求你选择要共享屏幕源。系统将提示你选择以下两个选项之一:共享整个屏幕或共享应用程序窗口。如下图所示。 ?

1.1K30

微信开发--微信小程序(四)

,谈谈这个wx:key 假如我们更新array数组,预期来说视图重新渲染,但是我们假如只是在array中push更多元素,我们想法应该是重新排序,不去重复创建视图原来已经有的元素,这里为了标识item...我做法是使用wx.getSystemInfo这个api来获取到运行手机屏幕宽度和高度,那么根据UI标注图屏幕宽高,就可以换算出一个比例来了。...="loadMore" lower-threshold="50" bindscroll="scroll"> 十一: 微信小程序 —— button按钮去除border边框 在开发微信小程序组件框架,我遇到了一个问题...使用 button::after{ border: none; } 来去除边框 十二: tabBar 底部菜单切换,数据没更新 推荐切换到书架页,页面打开只执行一次onLoad生命周期,应该是每次点击切换都会执行...请注意switchTab只能跳转到带有tab页面,不能跳转到不带tab页面!跳转不带tab页面还是需要使用redirect或者navigate! <navigator url="..

19.4K51

腾讯会议SaaS SDK特性更新列表

3、 iPad宫格视图支持手势缩放:宫格视图支持手势切换视图大小,查看参会者更便捷。 版本3.21.3 1、 会中增加PSTN入口:会中点击邀请按钮,弹框增加PSTN呼叫入口。...15、视图布局支持入会隐藏自己视图:会中隐藏自己视图,为查看其他参会者留出更多空间,会议画面也更聚焦。...24、暂停参会者活动能力增强:有人入会捣乱,支持一键暂停参会者活动同时批量移出对应成员并向腾讯会议举报,快速恢复会议秩序。...28、视频镜像多方视角预览:在设置视频镜像,可预览自己和他人视角视频表现。 29、新增日志上传接口:新增带UI和不带UI两个日志上传接口,免除线下日志传递。...3、 网络研讨会观众自动退出发言 4、 同传列表屏蔽web、rooms、mra端入会用户 5、 网页应用内嵌视图屏幕共享结束后恢复内嵌样式 6、 移动端支持预定网络研讨会 7、 分组会议支持云录制

3.8K22

Human Interface Guidelines —— Popovers

Popover Popover是一个短暂视图您点击某个控件或某个区域,它会出现在屏幕其他内容上方。 通常,Popover包含指向其出现位置箭头。...popover出现时,通常不能与其他视图进行交互,直到popover被关闭。 使用popover显示与屏幕上内容相关选项或信息。...·自动关闭非模态popover始终保存工作数据 通过点击屏幕另一部分很容易无意中消除非模态popover。但是只有当用户点击明确取消按钮才丢弃之前数据。...·将popover放在屏幕中适当位置  popover箭头直接指向弹出它元素。由于popover无法在屏幕上拖动,因此popover不应包含人们在使用popover可能需要查看基本内容。...·可能的话,让用户点击一次就能关闭一个popover同时打开另一个popover 几个不同按钮每个都打开一个popover,避免额外点击是特别明智

1.3K110

微信小程序开发学习笔记(二)——小程序框架、组件、WXML

name 与视图 name 进行了绑定,所以在页面一打开时候会显示 Hello Weixin!...; 点击按钮时候,视图层会发送 changeName 事件给逻辑层,逻辑层找到并执行对应事件处理函数; 回调函数触发后,逻辑层执行 setData 操作,将 data 中 name 从 Weixin...开放能力、无障碍访问 2.0、单位 2.0.1、响应式单位rpx 在使用 CSS 进行移动端网页开发,由于不同手机设备屏幕比,在换算像素单位时会遇到很多麻烦。... hover-class="none" ,没有点击态效果 1.0.0 hover-stop-propagation boolean false 否 指定是否阻止本节点祖先节点出现点击态 1.5.0...否 默认不解析 webP 格式,只支持网络资源 2.9.0 lazy-load boolean false 否 图片懒加载,在即将进入一定范围(上下三屏)才开始加载 1.5.0 show-menu-by-longpress

1.8K40

如何在Ubuntu 14.04上安装Ajenti控制面板和Ajenti V.

您可以通过在“ 插件”菜单中单击它们并按下所需依赖项旁边按钮来安装已禁用插件。否则,如果您稍后手动安装应用程序并且Ajenti有一个插件,您可以重新启动Ajenti,下次登录出现相应菜单。...加载可能需要一些时间。 注意:在Ajenti终端中运行命令将以root用户身份运行。 在屏幕底部有一个标有粘贴方框。...系统提示是否安装软件包,输入Y,然后再次按Enter。屏幕上可能会显示一些弹出窗口,例如: 对于这些提示,只需按ENTER键即可选择预选选项。无需配置。...它要求保留当前密码按ENTER键,这对于本教程来说很好。 完成后,单击屏幕顶部终端0旁边X返回到主页。返回侧栏中Configure菜单,然后使用屏幕底部按钮重新启动Ajenti。...Ajenti重新启动,您应该会在侧栏中看到一个Web部分,并在其下方看到一个网站选项。在网站视图中,您可以添加和管理网站以及监控配置,以确保一切正常。

2.2K20

Apriso 开发葵花宝典之六 Client Mode 篇

,该操作不会刷新屏幕(在服务器模式下,执行刷新操作) 没有从任何视图返回任何操作Action,提交视图不会刷新屏幕(在服务器模式下,执行refresh操作) 在Mozilla Firefox中以弹出窗口显示...一个动作在屏幕上执行或一个屏幕被提交,调试树将被附加有关执行动作信息——调试历史将被保留。...用户输入替换为屏幕接口输出(通常使用data- flex -bind)。 替换所有客户端模式下不支持Business Controls。...Layout editor打开视图错误,但步骤已经有HTML布局编辑器。...检查屏幕配置(是否所有变量都初始化了)或在视图操作(和子操作)中启用操作接口interface。 打开视图显示“已经添加了具有相同键项目”错误-。

34670

最新iOS设计规范二|7大应用架构

提供启动屏幕。系统会在应用启动显示启动屏幕,并迅速将其替换为应用第一个屏幕。启动屏幕功能是给人一种印象,即您应用程序快速且响应迅速,同时允许加载初始内容。...要避免显示看起来像可交互屏幕截图。 三、加载中(Loading) 加载内容,空白或静态屏幕可能会使您应用程序看起来像死机了,从而造成用户混乱和沮丧,甚至离开APP。 表明加载状态。...如果使用当前上下文模式视图样式在拆分视图窗格,弹出窗口或其他非全屏视图中显示模式内容,则在紧凑环境中显示模式内容切换为使用工作表。 模态设计规范如下: 模态要在合适时机使用。...例如,模态视图包含导航栏,它应该采用与APP导航栏相同外观。 为模态视图展示提供合适过渡动画。使用与APP风格统一过渡动画,增强用户对内容转变认知。...在iPad上,使用拆分视图而不是标签栏。拆分视图提供与选项卡栏相同快速导航,同时更好地利用了大屏幕您具有内容类型相同多个页面,请使用页面控件。

2.5K20

安卓Chrome使用技巧合辑

双击屏幕,在第二次点击屏幕按住屏幕不放,以双击屏幕位置定为原点,把手指向三象限或者四象限方向滑动,即可以原点为中心,快速放大页面,如果想要缩小页面,只需要双击屏幕,在第二次点击屏幕把手指向一象限或者二象限方向滑动...受网络环境限制,你可能需要把一个页面保存下来以便离线查看,这时你只需要打开Chrome菜单,点击菜单上部"下载"按钮,即可将此网页保存到本地。...改变网页加载进度条动画:   chrome://flags/#progress-bar-animation   改变此项可定义网页加载,地址栏下方加载进度条动画。..."稍后下载此网页"特性:   chrome://flags/#offline-pages-async-download   启用此特性后,某网页因为某种原因(如网络原因,目标网站服务器等)暂时无法正常加载...,Chrome会在报错页显示一个"稍后下载此网页"按钮,点击此按钮,Chrome会在后台尝试下载此网页,网页下载完成后,将会给用户弹出通知。

9.5K30

15 个必须知道 chrome 开发工具技巧

Web开发者中,Google Chrome是使用最广泛浏览器。六周一次发布周期和一套强大不断扩大开发功能,使其成为了web开发者必备工具。...你会很高兴听到chrome开发者功能也有这个功能,DevTools被打开时候,按Ctrl+P(在 mac 是cmd+p),就能快速搜寻和打开你项目的文件。...当你想要研究在页面还没加载完之前出现bug,这会是一个很方便方法。 七、优质打印 Chrome’s Developer Tools有内建美化代码,可以返回一段最小化且格式易读代码。...Pretty Print按钮在Sources标签左下角。...在CSS编辑器中可以利用这个功能 十二、可视化DOM阴影 Web浏览器在构建如文本框、按钮和输入框一类元素,其它基本元素视图是隐藏

67510

weex-15-组件web使用

本节学习内容 熟练掌握web组件用法 功能 1.设置web组件加载地址 2.控制向前,重载 1.设置web组件地址 ?...视图就被这个力拉和容器一样高 width:750px;设置宽度为屏幕宽度,注意这个特别重要,如果不设置宽度,在真机上是显示不出来,网页上是可以显示。...; top: 0px; left: 0px; right: 0px; bottom: 0px; } 2.控制向前,向后,重载 当我们单击一个按钮打开一个新网页时候,如何返回前一个页面呢...class="web" src="http://baidu.com" ref='web'> 第三步 增加一个刷新按钮和一个上一页按钮 <div class="page...2DF529C7-2BBF-435C-9E37-1A245027028D.png ---- 接下来还有几个事件要说一下 页面开始<em>加载</em>事件(pagestart) 页面<em>加载</em>完成事件(pagefinish)

98420

微信小程序底层框架实现原理|万字长文

小程序需要打开某个页面的时候,只需要提取页面的者几个属性,注入到预加载html模版中就可以快速生成一个新webview 快速启动 在视图层内,每个页面都是一个webiew,小程序启动只有首页一个...生命周期 onLoad(Object query) 页面加载触发,一个页面只会调用一次,可以在onLoad参数中获取打开当前页面路径中参数。...触发路由行为可以是逻辑层触发,也可以从视图层触发。在视图层中用户可以通过点击回退按钮,或者回退上一页手势等机制触发。...,把直接缓存好数据拿来使用 启动性能优化 控制代码包体积 推荐所有小程序使用分包加载 避免非必要使用全局自定义组件和插件 会影响按需注入效果和小程序代码注入耗时 控制资源文件 建议开发者在代码包内图片一般只包含一些体积较小图标...预拉取能够在小程序冷启动时候通过微信后台提前向第三方服务器拉取业务数据,当代码包加载可以更快地渲染页面,减少用户等待时间,从而提升小程序打开速度 周期性更新能够在用户未打开小程序情况下,也能从服务器提前拉取数据

3.1K10

从“CI搭建兽”到“流水线即代码”操练目的准备工作CI搭建兽辛苦手工工作10行代码搞定“CI搭建兽”全部手工工作部署流水线与单件流

打开命令行窗口,进入上述mobilebanking所在文件夹,执行下面命令, mvn clean test 单独运行自动化Web UI测试 再看看Python自动化Web UI测试程序能否正常运行...;另外如果把浏览器调整到仅占据屏幕一半,那么在运行ACCEPTANCE Stage,会在屏幕另一半看到运行Web UI自动化测试界面 git add . git commit -m "call...Deployment Pipeline视图中,观察整个视图;它会在1分钟内被自动触发,ACCEPTANCE变红,如下图所示; git add . git commit -m "make web ui...,来让这个Job每5分钟执行一次,从而有代码提交,不会与后面配置pipeline-as-code流水线同时执行,以便于单独观察流水线 在命令行中用git命令来提交代码,然后立即在Jenkins首页...Dashboard中点击"pipeline-as-code",来观察这个流水线视图;它会在1分钟内被自动触发,流水线会变绿,如下图所示;如果把浏览器缩小到屏幕一半,那么就能看到屏幕另一半Web UI

1.2K20

最新iOS设计规范九|10大系统能力(System Capabilities)

例如,Siri发起打入电话或音乐播放列表可能会中断您应用音频。发生此类情况,您应用程序响应符合人们期望。对于主要音频中断(例如播放音乐,播客或有声读物),您应用无限期暂停其音频。...尽管在大多数情况下使用主窗口,但是否使用辅助窗口在很大程度上取决于人们在应用程序中打开新窗口要查看内容类型。...避免仅使用辅助窗口来提供可用于主窗口内容选项或工具。 使用辅助窗口中“完成”或“关闭”按钮主窗口显示文档,该窗口通常包含一个“后退”按钮,使人们可以导航到父视图。...提供直观,有益行动。通知详细信息视图最多可以包含四个操作按钮。这些按钮应用于执行省时常规任务,从而无需打开应用程序。 避免提供破坏性行动。在通知详细信息视图中提供破坏性操作之前,请仔细考虑。...如果屏幕上没有可打印内容或没有可用打印机,则有人点击“操作”按钮,不要显示“打印”操作。如果您应用实现了自定义打印按钮,请在无法打印将其禁用或隐藏。 提供增加价值打印选项。

4.2K20
领券