网页中这 10 种字体的运用方式,不会让人觉得 Low

WhatsApp注册流程逆向分析:从协议解析到风控对抗实战 移动应用安全分析的核心在于理解客户端与服务端的交互协议与验证机制。通过逆向工程,可以深入剖析应用的数据加密、传输与身份验证原理,这对于构建安全模型、进行自动化测试和风控策略研究具有重要技术价值。在即时通讯、金融支付等高安全要求场景中,掌握应用注册流程的底层实现是评估其安全性的关键。本文聚焦于使用动态分析工具如Frida进行Hook和流量抓包,结合设备指纹识别与模拟器检测技术,详细解析了大型应用的注册风控体系,为安全研究人员和开发者提供了从环境搭建到实战对抗的完整方法。 阅读详情

简评:字体特效非常多,有目的地选取合理的特效是让它们发挥效果的诀窍所在。好的字体排版是不需要辅助就能被识别的,否则这个设计是失败的。

本文转载自 UISDC,如需转载请联系他们。

对于设计师而言,在日常的平面和 UI设计中,给字体增加特效一直都是一件恼人的事情。客户提出的浮雕特效或者大阴影的需求,但是直接按照要求来设计可能会毁掉整个设计。更多时候,你需要的是一些相对优雅但是又足够吸引人的字体效果,让整个设计项目的走向更加合理。

字体特效非常多,有目的地选取合理的特效是让它们发挥效果的诀窍所在。好的字体排版是不需要辅助就能被识别的,否则这个设计是失败的。

值得一提的是,最好的字体特效往往是润物细无声的,近乎无形,但是对于整个设计在视觉和质感上都有所提升。

1. 有目的地运用阴影效果

无论你使用什么软件做设计,都不要使用默认的阴影效果,这个经验里面包含了太多血的教训。

正如前文所说,好的阴影特效有着较高的融入度,几乎是「隐形」的。在部署阴影特效的时候,不要为了创建而创建,而是要借助阴影来构建前景文字和背景之间的层次感,这种对比恰到好处即可。

这种「隐形」的阴影设计对于设计师而言通常是不难识别出来的,不过普通用户通常不会太注意到它们。这些柔和的阴影,功能只是用来营造对比。

相对较为硬朗的阴影,会给人以更加复古的感觉,在较粗的、笔触平整的字体背后使用这样的阴影效果会比较好。

2. 使用双重曝光效果

双重曝光效果在网页设计和平面设计当中是非常流行的设计技巧。在文本字体中使用双重曝光效果能够让它看起来复杂而有趣,尤其是在双重曝光的图片选取得比较精妙的时候,效果看起来会非常惊艳。

3. 描边特效

对于较粗的字体使用描边特效,往往能够让字体的轮廓更加清晰,也增加了整体复古的感觉。在上面的案例当中,设计师就借助霓虹色字体和描边特效创造出了独特的氛围。

4. 使用多彩字体

多彩字体本身就包含有多样的色彩属性,甚至含有阴影、渐变、透明度甚至纹理。你可以使用多彩字体来让文本拥有远超传统字体的时髦值。

当大量的色彩共同来构成一套字体的时候,字体本身的视觉吸引力就已经达到极致了。现如今明亮大胆的字体是一种设计趋势,这样的配色本身并不会冒犯用户,因为用户正在越来越适应这样的设计。

当然,在色彩的搭配上需要协调且有目的性。

5. 适当地融入一些动效

从来都没有规定文本必须是静止的,在网页的文本中加入动效能够提升它的视觉吸引力。

不过,在为文本添加动效的时候,尤其要注意保持文本字体的可读性:

运动轨迹应该是有意识地设计的;
字母的运动不应该太快;
滚动或者自动播放的文本应该可以被停止;
无论屏幕大小,文本内容应该始终保持可读。

6. 模仿一些标志性的元素和特征

这两年的 Netflix 的热门美剧《怪奇物语》中,就模仿80年代经典的电影,融入了大量当时的元素,创造出让许多影迷共鸣的设计。

最典型的就是霓虹色的运用,充满80年代风情的 LOGO 成为了该剧最具识别度的元素。这种模仿的基础在于近年来80年代复古元素的疯狂流行,以及霓虹色等设计风格的回潮。

在模仿这些标志性的风格和元素的时候,度的把握很重要,恰到好处的模仿让人觉得亲切,而拙劣的复制则会显得很 Low。

7. 引入图形

引入图形或者其他的多媒体元素,在文本中加入一些额外的东西,也是不错的手法。使用图形或者其他的元素来替代一个或者多个字母,这样的设计还是很抓人眼球的。

这种技法的诀窍在于,图形的外观要和字母的风格、形状相匹配。很明显,如果不这么做的话,会让内容难以阅读。

在上面的 Kasra Design 的网页当中,视频的触发按钮和图标很好地融合了起来。

8. 增加纹理

有些字体风格本身就显得复古、粗糙,设计师能够通过自定义增加纹理来强化这种感觉。纹理本身能够让文本更加突出一些,也能够强化文本的质感,营造出独特的氛围。

在上面的案例当中,设计师通过两种不同的方式来赋予文本以纹理:

通过切割出来的细节来赋予文本以纹理;
通过半透明的效果让字体透出背景,从而拥有纹理。

9. 创造自定义的文本字体

在进行品牌 LOGO 设计的时候,自定义的文本字体是最常见的元素之一。基于特定的字体来进行自定义设计,通过标志性的细节来营造令人难忘的视觉体验,是自定义字体的主要目标之一。

这并不是一件容易实现的事情,自定义文本字体不仅需要足够扎实的技术,而且需要在具体设计的时候,足够小心谨慎。在绝大多数时候,最好是要同专业的字体设计师合作,以达到最好的设计效果。

10. 让字体本身发挥效果

有的时候,最好的文本效果,就是不要加其他任何特效。在形状、大小和色彩具有足够对比度的情况下,文本元素和背景会自然地构成前后景的对比,自然分离。

缺少其他效果的加持,设计师需要精心地控制所有的辅助性的元素,确保所有的元素能够完美的协同工作。加粗字体,深浅对比,是比较合理的组合方式。

The University of Essex 这个网站就在较暗的背景上采用了加粗的白色字体,视觉上足够突出,也足够清晰。

结语

文字特效的使用还需要特别注意设计趋势的存在,过于突出的特效可能会显得过犹不及,而趋势的流行周期也是设计师需要尤为注意的问题。微妙的设计总归是拥有更加持久生命力的。

原文:10 Tips for Using Text Effects That Don’t
Suck

机器人控制入门 机器人控制入门 对于工科领域来说,脱离实践的学习都是肤浅的,对于控制这种强调经验的技术更是如此。如果去问一个程序员怎么学习一块技术,他必然让你去多编程。机器人领域也是。如果想把基本功打扎实,那么实践更是必不可少了。 机器人控制有三个元素:控制器(算法),执行器(电机),传感器; 控制的本质就是将规划系统的指令作为输入信息,将传感器探测得到的状态信息和导航系统的定位 阅读详情

相关推荐

Telegram 担保交易系统搭建指南:安全可靠的交易流程实现

本文介绍了基于Telegram Bot API搭建担保交易系统的完整方案。该系统通过第三方资金托管机制解决买卖双方信任问题,支持"付款后发货"和"收货后放款"的交易流程。文章详细阐述了系统架构设计,包括Telegram Bot交互层、后端业务逻辑层、数据库层和支付接口层。核心实现步骤涵盖:1)订单创建模块处理交易信息;2)支付处理模块集成Stripe Escrow实现资金托管;3)确认收货模块完成资金划转。系统采用PostgreSQL存储交易数据,并通过FastAPI

jingpide9527的博客 1948

h5字体同时添加描边,渐变,阴影效果

css给字体同时添加描边,渐变色和阴影效果

greatwo2的博客 1268

【Unity】Pico VR 开发实战:从环境搭建到交互实现

本文是一份详细的Unity Pico VR开发实战指南,涵盖从环境搭建到核心交互实现的全流程。详细讲解了如何集成Pico Unity Integration SDK与XR Interaction Toolkit,配置开发环境,并重点解析了手柄输入处理、射线交互以及VR UI操作三大核心模块的代码实现与优化技巧,帮助开发者快速上手Pico VR应用开发。

rice5的博客 1174

html5中外描边怎么写,css如何设置文字描边效果?

css如何设置文字描边效果?下面本篇文章就来给大家介绍一下使用CSS设置文字描边效果的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。想要使用CSS给文字添加描边效果,主要有两种方法:使用text-stroke属性或text-shadow属性。方法1:使用text-shadow属性text-shadow属性用于向文本添加字体边框或阴影。text-shadow是实现Web描述效...

weixin_31763817的博客 536

别再只用LSTM了!用Temporal Fusion Transformer (TFT) 搞定多变量时序预测,附PyTorch实战代码

本文介绍了Temporal Fusion Transformer (TFT) 在多变量时序预测中的优势,并提供了PyTorch实战代码。TFT通过三重注意力机制解决了LSTM在特征交互、静态特征处理和解释性方面的不足,显著提升了预测精度和可解释性。文章详细讲解了TFT的核心组件构建、数据预处理、模型训练技巧及可解释性分析,帮助开发者快速掌握这一先进时序预测技术。

weixin_33712987的博客 279

【企业微信自建应用-前端篇】企业微信自建应用开发流程详细介绍

最近接到需求,需要我在企业微信端自建一个应用,用来接受PC端派发的工单,告警,公告等内容。这里写一个帖子汇总一下我经历的全流程开发,当然这是基础的流程啊。因为功能要求也不高。后面如果开发更多的东西再补充。

weixin_44265726的博客 9399

在HTML5中,为文字设置描边效果可以使用CSS的`text-shadow`属性

属性设置为四个偏移量,分别为-1px、0px、1px和0px。这样可以使文字在水平和垂直方向上产生描边效果。在HTML5中,为文字设置描边效果可以使用CSS的。在这个示例中,我们创建了一个名为。

[Blog][Domain] programb.blog.youkuaiyun.com 3933

OpenClaw 在 Docker 容器中的部署实战——零配置启动

本文介绍了OpenClaw在Docker容器中的快速部署方法,对比了本地部署与容器化部署的优势。通过官方镜像和Docker Compose两种方式,5分钟即可完成部署,并详细讲解了配置管理方案(挂载配置文件和环境变量)。文章还提供了飞书集成配置方法,以及生产环境下的日志管理、资源限制、健康检查等优化建议。最后包含常见问题排查指南,帮助开发者快速实现OpenClaw的容器化部署。

刘一说的IT专栏 904

查看某网页上的字体大小和字体

查看某网页上的字体大小和字体

m0_69550224的博客 2万+

ARM功耗管理软件之DVFS&AVS

思考:功耗管理软件栈及示例?WFI&WFE?时钟&电源树?DVFS&AVS?

AI-安全-功耗 1230

【毫米波混合波束成形】第3章 深度展开网络:将迭代优化嵌入计算图

相位提取算子 $P_\phi: \mathbb{C}^N \to \mathbb{C}^N$ 定义为逐元素相位归一化 $P_\phi(z) = \exp(j \cdot \angle z)$。该算子在复数域非全纯(Non-holomorphic),标准反向传播需扩展至Wirtinger微积分框架。对于复数变量 $z = x + jy$,Wirtinger导数定义:相位提取算子的Jacobian矩阵在极坐标下具有稀疏结构。

VectorShift的博客 406

html手机端最小字体,手机端h5页面字体大小适配

为解决适安卓手机跟苹果手机字体大小和高度不一致的问题;首先设置初始字体:由于浏览器默认(因为1em=16px,所以0.625em=10px);设置初始字体大小为62.5%;然后根据不同的屏幕尺寸计算相对应的百分比;代码如下:html,body {//安卓默认360width: 100%;font-size: 62.5%;}@media only screen and (min-width: 320...

weixin_42236014的博客 4297

手把手教你学Simulink--基础微电网场景实例:基于Simulink的混合交直流微电网架构仿真

本文基于Simulink构建混合交直流微电网仿真模型,通过交流子网(风电+交流负荷)和直流子网(光伏+储能+直流负荷)的协同控制,实现系统效率提升8.5%。重点介绍了混合架构原理、下垂控制策略及Simulink建模方法,包括核心模块实现、协调控制器代码和仿真参数设置。通过三种工况测试验证了系统性能:功率转移响应时间<0.5s,电压波动<5%,显著优于传统独立子网架构。文章还提供了进阶优化方向和完整代码清单,为微电网仿真研究提供实用参考。

MHD0815的博客 129

太Low了,网页居然还用这么老掉牙的特效!

太Low了,网页居然还用这么老掉牙的特效!弄个粗体字,下划线就是突出重点了?真是一股浓浓的乡村风扑面而来;弄个图在页面飘来飘去就是动画效果了,你要这么认为的话那我只能保持沉默了。在HTML5占领着整个互联网之时,想透过网页抓住所有人的眼球,因循守旧是行不通的。因此,有你不能不知道的HTML常用代码。只有熟悉掌握了常用的HTML代码,你才能在编写网页的时候做到行云流水,用处处流露着细腻和创意的动效细

zhongshish的博客 337

最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版

Part-E1-SDIO-Specification-Ver4.00-Final-120220.pdf:最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版,包括SDIO 接口的外设,SDIO 接口官方协议等。

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

【有利可图网】干货!10个高大上的字体效果设计方案!

对于设计师而言,在日常的平面和 UI设计中,给字体增加特效一直都是一件恼人的事情。 有些客户直接提出的要什么浮雕、大阴影,你要直接图层样式那么一勾,那真是要有多low有多low。 字体特效非常多,有目的地选取合理的特效是让它们发挥效果的诀窍所在。好的字体排版是不需要辅助就能被识别的,否则这个设计是失败的。 值得一提的是,最好的字体特效往往是润物细无声的,近乎无形,但是对于整个设计在视觉和质感...

有利可图网 615

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

android设计常用字体,界面设计必备!全方位科普常用的字体规范

编者按:90后UI设计师的最新干货!应广大群众要求,今天@Micu设计同学不说高大上的教程,来点即学即用的干货,从界面中文字的使用规则到字体颜色的选择,都有具体细致的说明,非常适合基础不扎实的同学。想一次性搞定字体这个关键点,马上学起来 >>>小哥的教程合集:好长时间没发帖,净想过年了,过年哈,倒腾工作总结和年货是大事。这几天有人问我说:“最近看了好多教程,都老高大上了,但是老...

weixin_32375369的博客 2086

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

界面设计过程中的常用字体规范

好长时间没发帖,净想过年了,过年哈,倒腾工作总结和年货是大事。 这几天有人问我说:“最近看了好多教程,都老高大上了,但是老弟我做不到呀,想学点直接能拿来用的,这个要求过分吗……” 这个,好吧,那就直接说说能用的知识:字体字号。 也许你会说:字体字号?也太Low了吧,这个谁不知道重要呀。 对于这个问题,我想说:会和熟练,是两回事。一个App,不同部分的字体字号你能准确地说出来吗...

616

php 画low poly,五分钟教你明白高大上LOW-POLY风格图片生成术

有没有看到看到效果高大上的图片,觉得离自己很远,望而生畏?今天给大家介绍一种名为LOW-POLY的风格图片,让所有人都一起来LOW-POLY一把,高大上一把!感谢新浪微博朋友@创意农民 授权分享。本文提到的下载地址(长按文字可以复制)神器下载:http://vdisk.weibo.com/s/CcdgCyAPRyDGWlowpoly风格的背景图片下载:http://matthew.wagerfie...

weixin_34620163的博客 679

中文网字计划:免费开源中文字体库的终极解决方案,完美兼容Google Fonts

你是否曾经为网页中文字体选择而烦恼?Google Fonts虽然提供了丰富的英文字体资源,但中文字体却寥寥无几。中文网字计划正是为解决这一痛点而生的开源项目!这是一个专门收集免费可商用中文字体的Web字体库,让你轻松实现中英文混排的完美视觉效果。 ## 为什么你的网站需要专业的中文字体? 在当今全球化的互联网时代,网站设计的美观性和专业性至关重要。然而,大多数开发者都面临一个共同挑战:如何找到

gitblog_00538的博客 755

教你创建高大上的多边形字体

低多边形(Low-Poly)字体设计是目前最新、最火的一个设计趋势。低多边形字体设计主要是基于有少量多边形的3D网格,同时结合一些渲染技术和灯光效果,使这些网格看上去像纸工艺或折纸作品。 低多边形通常需要使用3D软件来实现,但这篇教程将教会大家如何使用基本的PS工具来实现它的2D简化版,同时为了使低多边形效果更加精美,我们会用到一个非常简单的App- Image Triangulator Ap

sinolzeng的专栏 1036

UI字体规范

作为一个UI设计师,界面规范真的很重要,我们也许能把ios各个模块数据如数家珍,但是字体呢,正文字体多大字号?标题多大字号?哈哈,别发蒙,今天小编给大家带来满满的的干货,原文来自@王铎(MICU设计)带来的界面设计常用字体规范,大家看完果断收藏。 作者:王铎(MICU设计) 好长时间没发帖,净想过年了,过年哈,倒腾工作总结和年货是大事。 这几天有人问我说:“最近看了好

hushanpa的专栏 1484

字体排印发展史 | 笔墨、铅字与像素:文字形态的演变历程

……

u013669912的博客 451

Work Sans字体扩展字符集深度评测:支持100+语言的多文种排版方案

Work Sans是一款基于早期Grotesques风格开发的无衬线字体家族,2018-2020年间完成重大更新,新增斜体样式、可变字体文件,并将字符集扩展至Google Latin Expert glyph set,实现对越南语及100+种语言的全面支持,成为多文种排版的理想选择。 ## 🌟 字体家族概览:从Thin到Black的18种样式 Work Sans提供从Thin到Black的9

gitblog_01002的博客 458

Fontsource 字体档案:Crete Round——为网页而生的暖调石板衬线体

Crete Round 是 Fontsource 仓库中收录的一款由 TypeTogether 设计的开源石板衬线(slab serif)字体,本文以其官方描述 [description.en-US.md](https://link.gitcode.com/i/f38720fc67371a5b455d0ac26fb97228) 为主体,结合同目录下的 [family.json](https://l

gitblog_00088的博客 549

Fontsource 字体档案:DM Sans——为小字号排版而生的几何无衬线字体

DM Sans 是 Fontsource 收录的一套低对比度(low-contrast)几何无衬线字体,由英国 Colophon Foundry 设计,专为小字号正文排版场景打造。本文基于 Fontsource 仓库中 DM Sans 的官方描述文档及其配套元数据([description.en-US.md](https://link.gitcode.com/i/bc056d38d7a49b1a9

gitblog_00795的博客 27

快手爬虫,解决粉丝数,关注数等字体加密!python快手爬虫

想拿一下粉丝数 关注数 描述等 发现字体是加密的 elements是这样的 源代码里是这样的 找了找js 原来是用 &#xed69;&#xe34c;&#xf149;&#xf6d6;&#xf19d; 1 这些玩意 去 这个ttf里一一对应 然后用 js + css画出来的 找到问题所在,就fuck掉它 把js扣出来?用execjs去执行?太LOW了 既然做python 那就用python去重写 首先用re去拿这个ttf的url (因为...

pythonlaodi的博客 1411
上一篇: 如何估算文章阅读时长?
下一篇: 「案例」让房东在 Airbnb 上展示他们的热情好客
极光推送
博客等级 码龄14年 109粉丝 108原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值