web密码尝试工具
接下来是一些工具的组合,您作为开发人员或设计人员可以尝试下一个项目。 该列表绝不是详尽无遗的,也不是任何事物的“前十名”,而只是对那些寻求新事物的人的建议。 我希望您喜欢上面提到的工具。 让我们开始吧!
1. 检查
Inspect是一款可在您的设计文件和工具之间完美同步的应用程序。 它可以帮助您轻松地在Sketch,Inspect和InVision之间维护设计文件,并且只需单击一下即可使所有文件保持同步。
检查可以弥合设计师与开发人员之间的鸿沟。 在设计时生成工作代码,提供真正的度量,颜色和设计资产,并与消息传递系统协作,同时保持最新的项目信息和注释。
首先,您需要Sketch 。 安装Sketch之后,您还需要Craft 。 Craft是一套插件,可让您在设计时牢记真实数据,并允许在InVision和Sketch之间进行同步。 从InVision创建一个新项目,然后切换回Sketch 。 我还建议您看看InVision Studio 。
2. 原型
原型是使数字字体设计变得容易的设计。 它可以使用最佳做法在浏览器中实时使用Google字体,例如创建一致且可重复使用的模块化比例尺和基准网格。
使用原型设置的所有样式都会生成易于开发人员使用的代码。
通过允许用户导出到CSS或Sketch,更改和更新是即时且易于共享的。 您还可以下载用于设计的所选字体集。 使用您的Google帐户保存项目,然后随时恢复工作。
3. Probot
如果您使用版本控制,从事开源项目或在团队成员中进行代码审查,则Probot可能是您的化身。 Probot是一组社区驱动的应用程序,可通过GitHub自动化和改善您的工作流程。
您可以浏览所有开源应用程序或构建自己的应用程序。 目前提供的一些应用程序是陈旧的 ,对项目过程中积聚的自动关闭陈旧的问题,并引入请求,或提醒 ,为您的项目问题和团队成员创建的提醒通知。
专注于您要构建的内容。 一个简单的API(基于最新的ES6 JavaScript功能构建)隐藏了您不需要使用GitHub和Node.js的详细信息。
4. PSD素描
您是否曾经收到过PSD,并希望将其转换为Sketch文件? 好吧,你很幸运。 Avocode(也可以尝试使用的另一个有趣的工具 )已经足够好,可以为社区提供免费的工具来完成这项工作。 浏览到URL并上传您的PSD。 以下是路线图和转换过程支持的功能列表 。
还请记住,Photoshop和Sketch是截然不同的工具。 它只能转换可以在这两个设计应用程序中创建的设计元素。 素描和Photoshop。 它无法转换或模仿Sketch应用程序中未包含的Photoshop功能。
5. Cloudinary网站速度测试
优化图像可以大大缩短网页加载时间,从而提高用户保留率和满意度。 网站速度测试是一种图像分析工具,可以扫描具有实时URL的任何网站。 它提供了有关图像尺寸,格式,质量和编码参数的更改如何提高页面加载速度的详细优化见解。
结果可以共享,并且分析完成后,结果中记录的每个图像都可以优化格式或其他格式替代文件(例如webp或jpeg-xr)下载。
6. 阿尼米斯塔
Animista是一个您可以在其中玩弄一组预先制作CSS动画的地方,对其进行调整并仅获得您实际使用的动画。 复制生成的代码或下载单个CSS文件以使用。
7. 英雄模式
Hero Patterns是可重复使用的SVG背景图案的集合,供您在Web项目中使用。 您选择的每个背景图案都将转换为可重复的背景,并以base64编码,以在您选择CSS文件中使用。 在做出设计决策时,请调整各个属性,例如前景色,背景色和前景色。
目前,该应用程序可让您在87种不同的模式之间进行选择,考虑到所提供的模式很少,因此有多种选择。
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><g fill-rule="evenodd"><g fill="#000"><path opacity=".5" d="M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z" /><path d="M6 5V0H5v5H0v1h5v94h1V6h94V5H6z" /></g></g></svg>
8. 靠垫
靠垫为经营自己的自雇人士带来安心。 它有助于提供更好的见解,并“使自由职业者的日常过山车镇定下来。”
它提供14天的试用期 (无需信用卡),并且如果您在试用期间被迷住,则计划起价为每月5美元; 也称为“月球计划”。 此应用程序可在您需要时帮助满足您的需求:
- 项目计划
- 费用追踪
- 电子表格导出
- 开票
- 发票追踪
- 月收入视图
- 和更多…
Cushion正在考虑面向未来的移动应用程序,但由于专注于构建功能全面的Web应用程序,因此目前不提供该应用程序。 如果您特别想寻找银行帐户集成服务(这对您来说是个大难题),不幸的消息是该应用程序没有银行供稿,但是您可以将银行对帐单作为.csv
文件导入。 让它自己运行,您不会有任何损失。
9. Launchy
Launchy是一个可访问的模式窗口。 它也是jQuery免费的,只有27.7 KB 。
关于此工具的几个值得注意的功能是:
- 启动时,键盘焦点转移到模式窗口容器
- 模态窗口通过可选的模态标题描述
- 激活/可见时将键盘焦点锁定在模式中
- 按下
esc
键关闭窗口 -
click
叠加鼠标时关闭窗口 - 将键盘焦点设置回关闭窗口时的启动器元素
- 添加您自己的自定义关闭控件!
- 添加您自己的自定义控件,这些控件会将焦点发送到页面上的其他位置!
- Windows高对比度主题的透明边框
也发射 在其生成的元素上有许多CSS类可用于自定义样式。 查看style.scss文件中的类名,以及有关如何设置模式窗口样式的示例。 该项目还可以通过npm软件包获得: npm i launchy-modal-window
。 确实正确地完成了一个可访问的模式窗口。
10. Formcore
Formcore是Filament组的一个开源项目(称为“轻量级且经过验证的表单”),并且是一组表单模式,例如显示/隐藏密码,字符计数器,信用卡输入和验证,多行文本输入随着用户类型的扩展而扩展,以及更多。
还集成了许多其他功能,例如规范<input type="number">
表单字段的行为,可以强制执行maxlength
属性,并且还可以解决Safari 6和Firefox中带有<input type="number">
。台式机提几个。
如果您要在网络上构建表单(我敢打赌),那么下一个涉及表单输入的项目可能是一个不错的尝试。
结论
现在我们已经到达列表的末尾,您对此有何想法? 有没有人激发您的注意力点燃您的尝试意愿? 您没有留下深刻的印象,还有其他建议吗? 在下面的评论中让我们知道。 祝大家网站建设愉快!
翻译自: https://webdesign.tutsplus.com/tutorials/10-tools-to-try-with-your-next-web-project--cms-29910
web密码尝试工具