首先在这里感谢一下帮我内推的师姐和她的同事，谢谢他们给了我这次尝试的机会。对于我来说其实算是一次很大的挑战，在此期间碰到一些问题，有技术上的也有其他心理方面的因素，所幸是自己坚持下来了，这阵子的一些事情也得到了解决。
趁着现在做完，把最近记录在电脑中的一些任务安排和一些关键思路在这里理清一下，算是对这些天来的一些总结吧！
有关各页面的具体做法会在后面具体梳理，不在这里一一讲述了
【项目开发】
需求--》切图--》重构--》代码实现--》优化
（1）2018.03.13-2018.03.14卡在思考具体需求的问题上
一开始的效果实现思路：
首页开始是点我揭秘（一个链接），接下来的第二页是由于第一页点击下面的箭头来实现的，如果没有点击登录（一个链接），【直接继续点击下拉箭头，就会直接出现第三个页面】（这里很奇怪，第二页没有箭头？），手机端的开发是怎么做的？
确定大概需求：手机端页面，实现滑动一屏效果，在此种加入一些动画效果，具体的逻辑暂不清晰
（2）2018.3.15
【计划】将任务分步，先实现滑动滚屏效果
【完成】暂时使用一些主要图片代替实现了滑动一屏效果
（3）2018.3.16-2018.18卡在布局上，开始查找相关资料，在此期间看了一部分的《响应式Web设计HTML5和CSS3实战》书籍，需要再深入学习有关手机端开发
（4）2018.3.20-2018.3.22重新对任务进行定位和一些效果的实现
【项目需求分析】
1.项目主题：2017进行双十一购物清单
2.设计稿图层分析，多页视觉放到一个网页文档，实现滑动滚屏，伴随着一些动画效果
【开发技能分析】
移动端项目，直接采用html5作为项目的结构层
分析网页呈现形式，直接采用css3完成网页的表现层
特效分析，采用css3完成主要特效，采用javascript控制交互
直接采用原生javascript控制滑屏效果
期间的一些记录
【目前进度】
1.能实现翻页效果
【问题】
不是很清楚移动端的具体布局，布局效果都是根据自己的理解来做，不清楚这样做对不对
【未做】
各种动画效果的实现，同时如何控制翻页后实现各种动画效果（目前的初次想法是通过写好css代码，然后通过动态添加className来实现）
【改进】想把一些可以用css实现的图片用css实现
【猜想】这个应该是关于账单的实现
一开始是出现点我揭秘页面，如果点击后出现登录页面，假若登录后，会根据用户的获取相应数据出现对应的图片效果，如果没有登录发现获取到用户双11购物为0，则出现没有数据效果。
我的猜想：假如用户为花1000元的用户，根据选好的内容进行制作
所以总共有10个页面，分别是点我揭秘、1、2、3、4 、5 、6、结果页面、我也要测页面、分享页面
其他页面应该是需要通过与后台的数据交互来实现根据用户登录的不同来实现不同的效果，感觉应该动画效果都一样，所以就从假定某个客户提交登录后出现的效果来做
【待做】
关于psd上的特殊字体：
方法一：使用图片代替
方法二：使用font-face中来引入相应的字体
问题提出：如何对这两种方式进行比较，以什么标准来选择哪种方式？
以下是相关资源查找：
https://segmentfault.com/q/1010000008296866
关于css3@font-face的使用从调用具体到加载速度的优化：
https://www.cnblogs.com/natureclove/articles/7657290.html
移动端web页面使用字体的思考
https://www.cnblogs.com/mofish/p/4332937.html
移动端h5站如何修改字体
https://www.zhihu.com/question/37615649
网页html中嵌入特殊字体-此法利于SEO
https://blog.csdn.net/a351945755/article/details/51792380
网站特殊字体处理
https://blog.csdn.net/xiaolongtotop/article/details/8482955
图标字体运用以及其优势与劣势
http://www.frontopen.com/1906.html【重要】
目前的认识就是方法二需要将期望的字体包放在web服务器上，造成的缺点：
1. 对用户流量有损耗。
2. 开发成本加大。
【知识的了解】
关于单位：
长度单位包括包括：相对单位和绝对单位。
相对长度单位包括有： em,ex, ch, rem, vw, vh, vmax, vmin
绝对长度单位包括有： cm,mm, q, in, pt, pc, px
（以上还需深入了解）
【关于图片选择】
1.图片的格式
JPEG(JPG)——支持的颜色比较多，图片可以压缩，但是不支持透明，一般使用JPEG来保存照片等颜色丰富的图片
GIF——支持的颜色少，只支持简单的透明，支持动态图，图片颜色单一或者是动图时可以使用GIF
PNG——支持的颜色多，并且支持复杂的透明，可以用来显示颜色复杂的透明的图片
【图片的使用原则】效果不一致，使用效果好的，效果一致，使用内存小的
2018.03.24-2018.03.25
【已完成】部分的布局和动画效果
【问题】page6那里有点问题，暂时未找出来原因
【待解决】page6动画效果，查看一些相关的兼容性问题
2018.03.26
【已完成】实现最基本要求
【问题】进入优化部分
【可拓展】其他也加入动画效果
进入优化等的考虑，以下是查找的资料
https://www.cnblogs.com/liulilin/p/7245125.html
https://www.cnblogs.com/wujindong/p/5442275.html
https://blog.csdn.net/mahoking/article/details/51472697
优化方面的考虑点：
主要是从图片和代码优化方面进行考虑，在图片方面，对图片进行无损压缩，对于应用于背景图片主要是保存为.jpg格式，其他的图片采用.png格式。在使用css实现箭头绘制之前，一开始是打算使用图片来替代的，打算使用雪碧图的制作方式来实现将多张箭头制作成一张，但是后来还是打算采用css来实现，能起到更好的性能优化。在代码方面，编写css代码时，尽量将能重用的代码重用，在编写JavaScript的代码时，尽量将代码使用函数封装调用，这样可以实现代码的复用，减少JavaScript代码。
原本是打算每天都将做的事情都写在博客上的，但是有时会有点懒，就直接记录在电脑的文档中了，趁现在，赶紧做好记录，作为这几天满满的回忆