(0923更新) 时间就是金钱,我的朋友.希望这贴能节省你的.....

whocansaveme

鉴于部分Aff对LP的需求，分享一些我平时在WEB端常用到的一些最基础的 工具/lib 集。都经过了公司项目实际产品的检验，并且都是开源优秀工具，基本所有都在github上可以查到。最最最重要的是，在有基础前端技能的前提下，使用非常方便。（对于我个人，这些工具极大地降低了开发成本）

1. bootstrap
中文站 www.bootcss.com. 用来设计、布局pc/mobile的响应式页面，可以做到mobile端自适应，非常强大。推荐！

2. fontawesome
http://fontawesome.io。 做LP没有精美小图标？fontawesome 675个随你挑。使用字体渲染以及CSS来进行图标绘制。意味着你能方便无损修改大小、做特效。推荐！

3. animate css
https://github.com/daneden/animate.css  使用CSS，用最简单的方式，给你的LP加上兼容PC/Mobile端的动画效果，结合fontawesome，神器。谁用谁知道！推荐！

4. fastclick
https://github.com/ftlabs/fastclick  解决移动端手指单击的延迟问题。PC端鼠标click事件与移动端手指点击tap事件不一样，手指tap会有一个百毫秒多的延时。这个库就是为了解决这个问题而存在。属于优化层面，有切实需要的就加上。

5. ismobile
https://github.com/kaimallea/isMobile 移动设备类型检测。简单易用易扩展。

6. hammer
https://github.com/hammerjs/hammer.js 无需jquery的，支持各种手势的js库。属于进阶库，需要特殊交互的LP首选。

7. jquery
这个不用多说了吧？

如果需要自己设计制作LP，以上几个基础工具足够满足99%的需求了。

对于LP，网上现成的各种模板，很多非常好了。实在需要自己搞的，上述几个工具应该能节省不少时间哈。

有啥问题欢迎讨论。
补充1：
1. 针对你的OFFER受众国家以及你的VPS地点，可以选择性的使用上述工具的CDN连接（很多库官方提供CDN连接），如果没有速度理想的，使用专门的CDN提供商的服务，建议选择覆盖国家多的提供商，这样选一家就够了，不贵的。
2. 关于页面打开速度的几点优化，不难搞，但这优化的几十几百K，决定了用户打开LP的速度跟体验。基本的2个方法有：
a. 每一个LP，只选择这个LP必须使用的lib。如果这些LIb是在自己的VPS上，把他们压缩、混淆为一个文件，并且最小化，然后再引入。
b. 务必配置nginx的缓存以及压缩。

PS：珍惜用户的每一次点击。
====0417更新=====
今天更新3个能节省时间的小工具，都是chrome的extension。

1. Alexa Traffic Rank
在浏览网站的时候，一键查询该网站的alexa排名以及相关信息。

2. SimilarWeb
同样一键查询网站流量排名等基本信息，很好用。 一般1 2一起对比使用。


3. Google翻译
这个，不用说了吧？

3个工具都是chrome的插件，获取方式直接在google play上搜索。

==========我又来更新了(自己太懒了....) 20200923========= 这次更新2个在谷歌官方文档中提到的2个网页性能多维度检测工具。需要的同志自取。 1. PageSpeed Insights https://developers.google.com/speed/pagespeed/insights/?hl=zh-CN 2. Google Lighthouse https://developers.google.com/web/tools/lighthouse/ 我记得在近期的一个算法更新上，网页性能的权重被进一步提高了，具体可以看这个博文： https://webmasters.googleblog.com/search/label/speed

zlc000190

#在这里完全不会用啊快速回复#

manzippo

这个先留个名，下次回来再研究，多谢！

whocansaveme

zlc000190 发表于 2017-4-13 21:31
#在这里完全不会用啊快速回复#

不要气馁。有现成的LP就用现成的并且做一些微创新即可。主要精力要放到核心上，个人愚见。

whocansaveme

====0417更新=====
今天更新3个能节省时间的小工具，都是chrome的extension。

1. Alexa Traffic Rank
在浏览网站的时候，一键查询该网站的alexa排名以及相关信息。

2. SimilarWeb
同样一键查询网站流量排名等基本信息，很好用。 一般1 2一起对比使用。


3. Google翻译
这个，不用说了吧？

3个工具都是chrome的插件，获取方式直接在google play上搜索。

xiangwofei

bootstrap虽然很强大，但STM上的大牛却说尽量不要用bootstrap来制作mobile LP,因为bootstrap做出来的LP会比较大

whocansaveme

xiangwofei 发表于 2017-4-18 12:50
bootstrap虽然很强大，但STM上的大牛却说尽量不要用bootstrap来制作mobile LP,因为bootstrap做出来的LP会比 ...

可以针对性的对所需功能做裁剪。如果觉得麻烦，其他库选择也很多。

leonwqhb

非常感谢啊。

第零句对白

很是感谢

whocansaveme

==========我又来更新了(自己太懒了....) 20200923=========

这次更新2个在谷歌官方文档中提到的2个网页性能多维度检测工具。需要的同志自取。

1. PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/?hl=zh-CN

2. Google Lighthouse
https://developers.google.com/web/tools/lighthouse/


我记得在近期的一个算法更新上，网页性能的权重被进一步提高了，具体可以看这个博文：
https://webmasters.googleblog.com/search/label/speed

cloudysky

学习   下次用到再回来看