学习网站设计趋势，我能掌握哪些实用技能提升网站吸引力？

哎呀，聊起网站设计趋势，我这个老友可得跟你唠唠，大体上...。

先说说现在最火的几个大招

别慌，先给你抛个砖。

双色调配色。

听起来高大上，其实就是挑两种颜色来玩。

不对不对，应该是挑两种互补或者同系的颜色，然后把整个页面弄成渐变。

像Spotify那种满屏的蓝紫梯度，你看着眼睛都舒服，摸个底。。

哈哈，这招用得好，访客第一眼就被吸住。

怎么落地？

先选主色和辅色。

主色占70%，辅色20%左右，剩下的留给文字和细节。

别忘了调一下透明度，让层次更丰富。

还有一点——别全站都用同一个渐变，要有点留白，让内容呼吸，小丑竟是我自己。。

分屏布局：把内容一刀两断

分屏设计现在很流行，特别是产品展示页。

把页面划分成左右两块，各自讲自己的故事。

左边放图片，右边写文案，这样视觉冲击更强，好吧好吧...。

害，这里要注意的是响应式。

手机上自然要堆叠，否则用户会抓狂。

实现技巧

Flexbox或者Grid都能搞定。

记得给每块加上最小宽度，不然窄屏会挤在一起，冲鸭！。

摆烂... 再配合一点动画——比如滚动进来的淡入淡出，让页面更活泼。

大胆的字体玩耍

过去大家都怕大字体， 现在恰恰相反——大胆、超大、穿透背景的文字正流行。

踩个点。 比如首页的大标题直接跨过图片，把文字当成装饰品来用。

不对不对，是把文字当成信息承载，又让它成为视觉焦点。

选字体的小窍门

我晕... 无衬线体是平安牌， 但如果想出奇，就可以尝试手写体或者几何体。

关键是要保证可读性——对比度必须足够高，否则用户根本看不清楚。

还有一点——在不同断点下调整字号和行高，让所有设备都有好体验。

PWA 与离线体验

毕竟.… PWA已经不是新鲜事儿了但它真的能提升用户黏性啊！

PWA 让网站像原生 App 一样可以离线访问，还能推送通知，引导回访，也许.…。

PWA 入门步骤

先准备一个 Service Worker 脚本，用来缓存关键资源。

接着写一个 manifest.json，定义图标、启动页颜色之类的元信息。

Simplify it——不要一次性缓存全部页面只挑核心资源就好，省流量也省心。

Lottie 动画：轻量级动效神器

绝绝子！ Lottie 用 JSON 描述动画， 比 GIF 更小、更清晰，还能随时控制播放速度和方向呢！

Lottie 的好处

Lottie 怎么集成？

E‑mail 营销与网站结合的技巧

// 定义主色
$primary:#3498db;
// 辅助色
$accent:#e74c3c;
// 生成双色调渐变
@mixin duotone{
  background: linear-gradient;
}
// 使用
.header{
  @include duotone;
}