2018.10.15 LOG：semantic preload vedio

昨天晚上给老婆的笔记本装系统，正兴奋着呢(不知道为什么每次装系统都很兴奋)，妹的断网停机了，不明所以，发现居然是欠费了，是老婆忘了缴费。。。。,手机也停了，网也断了，一时间不知道怎么办了。拨了10000号想问问，居然提示停机后可以按1暂时恢复24小时，得救了。

昨天上午，看了一些html/css的内容，说一下心得体会呗。

video.js是一个H5的播放器库，兼容所有浏览器，包括IE6-8，可以设置播放flash，实现视频的预加载，展示图片，自动播放，自定义屏幕播放按钮，控制播放/暂停/快进/后退，控制视频播放权限，控制视频播放时间，播放器语言等，可以通过CDN加入，也可以下载，还可以npm和bower安装，官网有docs参照。其实呢，很简单，定义了video标签的样式，自定义了很多标签和事件来控制video的播放，我是通过廖雪峰博客上的视频发现这个插件的。

preload/prefetch，这两兄弟，昨天又看了一下，因为最近用过preload，感觉比prefetch提高了不止一个档次，但兼容性不好，IE几乎就完全抛弃了这个兄弟，firefox兼容也不太好。唉，慢慢等发展吧，需要提前加载后面页面的资源，还是先用着prefetch。

semantic html，语义化，我这种不拘小节的人，以前很少触及到语义化的范围。前两天在知乎看到了顾轶灵的回答，又看了他的网站和一些介绍语义化的精华文章，感觉这确实是以后的趋势。记得06，7年，那时候搭建页面全是用table，玩转table是当时还没有被叫做‘前端’的程序员的标志，各种拆分，拼凑。th,thead,tbody,tfoot,caption…这些根本是不会去写的。后面就开始用’div+css’，前端这个职业也开始诞生，再后面就是满篇的div，密密麻麻，看着渗人，但也不愿放弃，因为好用。H5出来以后，尽管有一些新的区域标签和语义标签，但一直没怎么用，因为div，p，span等还是能解决大部分问题。

为了能被更多的设备和应用解析，优化seo，规范团队代码，推动语义化的发展，为了盲人也能顺畅的用你的网站，请语义化吧：

• div，span永远都是最后的选择
• lang，charset不能漏掉
• link，a元素的rel
• 即可以使用div或者P时，尽量使用p
• table里的构造必须补齐caption，head，body，foot，表头要用th
• header是html，articl的页眉，不影响文档提纲生成
• section一般表示和上下文有关联的内容，希望这个内容出现在文档的提纲中
• article一般表示和上下文无关联的内容，可独立的，比如文章，插件等
• em表示强调，strong表示更强调
• blockquote也可以用来表示引用段落
• figure用来表示图片等
• input必须搭配label
• 合理使用p，hr，ol/ul/li，dl/dt/dd，main，time，mark，pre，code，q，cite，address，em，strong，wbr
• 对于class和id，根据它是什么而不是它看上去是什么样子来命名
• 了解microformats，microdata

最后临吃饭了，看到一个好东西，awsm.css，无class/id样式化语义标签，适用快速搭建语义化标签的简单的页面。

---

中午看了会书，《网络是怎样连接的》，说的是生动的讲述网络各种协议过程，看了100多页了，其实很烧脑，小日本的书就喜欢讲很多细节，绕晕你就OK。建议还是看图解系列。。。

---

下午教育了熊孩子，看了一会git的GUI工具，看来看去还是觉得bash好用，就是对比和解决冲突的时候可能会用一下.如果有熟悉的IDE，还是尽量在IDE里使用GUI，其他什么sourcetree没实际使用价值.

晚上给老电脑重装系统，04年的华硕笔记本电脑，4G内存，无SSD。装win7pro。系统用U盘很快装好，考虑了一下，还是不要装重量级的东西，于是选择了wps，ccleaner，avg，抛弃了电脑管家之类的玩意儿，开发类的就装了.net4.5/node/python，java都没敢装，设计类的装了墨刀，pxcook，ps也没敢装，然后就断网了，妹的。。。。