英语怎么学?

去年年底考了英语六级,成绩还不错。朋友问到学英语的方法,于是就有了这篇文章。

 

一、学英语?

开始看下去之前,请你先考虑三个问题:

喜欢英语吗?
学英语干什么?
能坚持下去吗?

如果你对这三个没有明确的答案的话,那么还是放弃吧。学英语很累,一开始还很无聊,不如花时间读读小说,谈谈恋爱来得轻松。你说英语很难?那我告诉你吧,它的确很难,难得要死,不如去学挖掘机,简单易学还炫酷。

如果只是为了通过考试,那么你该去背单词和做真题,相关的经验网上一抓一大把。但是既然你都开始学了,为什么不让目标更远大呢?我觉得,每一个想在某个领域获得深远发展的人,每一个认同终身学习理念,对世界抱有好奇心的人,每一个向往自由的人,都该去学英语。为什么?没有标准答案,我先给出三个:世界上大多数的知识和绝大多数优质的知识都是用英语写的;了解及时的优质的行业信息;不被墙内的媒体和政党误导,了解事实真相。

 

二、怎么学?

再往下读之前,请先了解一下我发明的辉氏高效学习流程图©,下面的内容都建立在这个流程图上面。

 

三、学英语!

下面按照流程图走一遍:

零基础?

是:获得最少必要知识。对学英语来说,开始之前,先背几千个单词。不要用软件,买一本高考词汇,或是四级词汇,采用手抄,听读的方式记忆。采用高强度短时间记忆的方式,主要的原则就是重复。在一个月内完成。背单词是前期迅速提高阅读能力和自信心的重要方法。单词记得差不多了,这时再开始下面的学习。

否:跳到下一个问题。

感兴趣?

是:恭喜你,你有很大的优势来学习英语,而且可以不那么痛苦的达到一个很高的水平。你应该已经有了自己的学习目标和学习计划,并且已经把英语的学习融入到一部分生活习惯里了。如果你是刚刚起步,那么继续往下看。

否:跳到下一个问题。

有目标?

是:有了目标,学习方法就清晰了。比如你的目标想要流畅阅读英文出版物和网络内容,那么你的方法就是:在掌握了基础的几千个单词后,开始阅读英文书。按照循序渐进的原则,安装好查单词的软件,从儿童读物开始,慢慢过渡到青少年读物,然后是成人读物,最终开始阅读你目标内的英文书。再比如你的目标是和外国人畅快的聊天,那么你的计划就得定的长远些,按照循序渐进的原则,你从音标开始学习,每天学5页音标教程,同时听三个英语播客。

否:跳到“用”。

“用”!

用分为主动被动两种。

主动的”用”:使用英语来学习和工作。卸载知乎,安装Quora;用英语来学习其他专业的知识,听公开课、看电影纪录片用英文字幕(暂停查词);使用英文关键词搜索等。

被动的”用”:强迫自己接触英语。比如把电脑,手机等所有电子设备的语言换成英文;安装类似biscuit这样的应用,不定时的从任务栏跳出单词;在洗手间或是书桌前等视线所及的地方贴上单词表。

学习原则

这些原则是安排和调整学习计划的指导原则,可以通过阅读网上的经验和信息来完善它,打造一个适合自己的学习体系。

  • 不求速成,做好长期学习的准备

学习语言是个长期的过程,没有多少捷径可走,即使有也免不了大量的时间和精力投入。

  • 量化目标,制定学习标准,越细致越好

举个例子,目标:每天三个播客,五篇文章;学习标准:查出每一个生词,听懂每一句话。并且把生词记在单词本上,每周末下午复习。建议搭配时间统计和写日总结来督促自己完成目标。

  • 重复!重复!重复!坚持!坚持!坚持!

相对来说,工具不重要,方法不重要,重要的是每天的重复和坚持

  • 让学习变得有趣起来

同样的原因,在漫长的学习路径里,为了让自己更容易坚持下去,尽量让学习变得有趣起来。

  • 阅读材料以现代出版的优先,学习材料以外国人出版的优先,难度上稍稍大于自己的水平

不建议选择名著,尤其是初学者。举个不太恰当的例子,看莎士比亚学英语,就像是让外国人读鲁迅来学中文。难度选择上,以自己大概能看懂,但每页都有十来个生词的书最好。

  • 通过正面的反馈,增强自己的信心

就像升级缓慢的游戏让人觉得无聊一样,没有反馈的学习让人很容易开始厌倦。这时我们应该尽量给自己创造一些正面的反馈,比如说去参加考试。

  • 方法可以灵活多变,但学习不能停,最好还是”用“起来,把英语变成生活的一部分。

学习方法千万种,坚持下来没几个人。但也不是说就得一条路走到底,可以多尝试不同的学习方法和学习材料,但学习本身不能停。在这些尝试中慢慢形成自己的学习系统,找到适合自己的方法。

学习工具箱

工具箱应该是通用的,对所有的学习过程都适用。但也得新加一层关于英语的盒子。这个盒子里的硬工具是各种优秀的教材、词典或APP,从各处整理来的各种方法和经验。软工具可以是保持专注的能力,制定计划的能力,给学习创造乐趣的能力等等。

 

四、我是怎么学的?

故事是这样的。我高中的时候没有好好学习,对英语也没什么好感。后来实在讨厌学校,高三就回家自学了。自学一年,只有英语学得还不错,一度在原来的班里从倒数考到第二(大家当然都很惊讶)。虽然高考还是没有考好,上了个专科。但对英语的学习给我带来了很大的信心。

上了大学后,才开始正经的学起来,期间尝试了很多方法,也接触过不少材料。印象最深刻的是ESLpod和Englishpod出的播客,旋元佑的语法俱乐部,和走遍美国。

上了大学后,还是很讨厌上课,终于在大一下学期成功申请了英语免听。不用再去上课了。然后继续保持学习,大量阅读英文,主要是Quora,Medium上的文章。同时开始学习编程,把英语作为一个工具来使用,看公开课,查官方文档,查Google都用英文。最近每天会听五个ESL的播客(通勤时),晚上有时间会跟读半小时的材料。就这样半学半用,一直到现在。中间考了四六级,四级考了532。六级倒是认真复习,做了十套真题,不过也才考了544,离目标还差了几分。

哈哈,是不是很失望?其实根本就没有什么奇技淫巧,每天学一小时,坚持两年,你也可以到我这个水平。在这个学习过程中,考试只是顺便完成的一个小目标罢了,这个过程让我对自己的学习能力有了清晰的认识,更大的好处是英语给我打开了另一扇大门,一个崭新的世界离我更近了。

 

五、其他

这些链接后的内容可以用来完善你的学习工具箱,找到适合你的学习材料和学习工具。不要在选择材和工具上浪费太多时间,早点开始,学习本身才是重点

方法与原理:

知乎话题:英语学习

知乎话题:英语

豆瓣小站·奶爸的英语教室

豆瓣英语学习整合贴

Quora话题:Learning languages

Quora话题:Learning English

学习材料:

eslpod

Englishpod(和eslpod的区别见这里

《文法俱乐部》——旋元佑

《英语阅读参考手册》——叶永昌

豆瓣奶爸的教室小站分享的资源网盘直达

 

六、结语

啊,既然你已经看到了这里,那说明你想要学习英语的决心很大。尽管这样,我还是要再重复一下,做好长期学习的准备,在学习过程中多给自己找些乐趣,让英语融入你的生活。慢慢的,你会喜欢上它,甚至离不开它。将来的某一天,你会感谢自己今天的决定。

辉氏高效学习流程图©

通过对英语和编程的学习,我逐渐发现了几种高效学习的模式和一些学习原则,然后把这些东西总结成了一个“辉氏高效学习流程图©”。

learning method

辉氏高效学习流程图©

流程图包括三种学习模式,一些学习原则和一个学习工具箱。

这个辉氏高效学习路径图©是我刚刚发明出来的,这是它来到这个世界上的第一声呻吟(哦不,是啼哭)。下面是这三种学习模式的解释和相关示例。

 

一、三种学习模式

兴趣驱动

当你对你所学的东西感兴趣的时候,你会投入很大的热情和精力去学习,即使一开始没有章法,慢慢地也会形成自己的方法。这种学习模式有很高的主动性,只需有高手稍加指点,进步就会很快。

目标驱动

第二种是目标驱动,也就是英文语境下时”learning by doing”。当你有了一个明确的目标需要实现时,学习就成了一个实现目标的条件。这时的学习会更有针对性,你的每一个问题的解决都是一次学习与实践。虽然这样的学习可能不会深入彻底,但这个学习的过程会让你不知不觉就”入了门”,而且可以极大地提高你的自信。

举例来说,学英语时如果以通过某个考试作为目标,那么学习方法就很容易制定,只需要买到相应的真题和单词书,按照自己了解到的好的学习方法坚持下去就可以了。学编程时,以实现某个项目作为目标,那么学习的时候就会去想尽办法来解决遇到的各种问题,在解决问题的同时,你也获得了相应的知识。

生活驱动

当你既没兴趣,又没目标的时候,就”用”。把你要学习的东西融入到你的生活里。一个陌生的领域通常只要掌握一些最少必要知识,就可以逐步运用了。对于英语来说,是基础的几千个单词;对于某一门编程语言来说,是基础的语法。这个概念其实很普通,也没什么可以解释的,就是”用”。把学习融入到生活习惯里,不知不觉就学会了(当然,学好是另一回事)。

 

二、学习原则

它是你学习,或是形成自己的学习方法和学习系统的指导原则。你可以通过阅读和实践不断的完善它。这些原则包括循序渐进,长时间的坚持,勉强完成好过放弃,英文资料优先,纸笔优先,激发兴趣,适当的奖励自己等等。

 

三、学习工具箱

这个工具箱里是各种可以促进学习的工具。这里面有硬工具:各种优质的APP(比如OneNote),网站(比如豆瓣知乎),资源,设备等;也有各种促进学习的知识和能力(软工具),比如成熟的心智,健康的生活习惯,控制时间的能力,搜索信息的能力,作为工具语言的英语等。Coursera上有一门关于学习的课程值得一看,名字就叫Learning How to Learn,也该放到工具箱里。

每个人都该有一个这样的学习工具箱,花一定的时间来打造这个工具箱是值得的,它将使你终生受益。通常来说,软工具需要更长时间来获得,这些工具的背后是大量的优质阅读,长时间的学习思考和大量的实践。而对于硬工具,在经济允许的情况下买最好的。能花钱解决,就不要浪费时间。

下面是一个完整的运用示例:英语怎么学?

impress.js——用HTML“写”幻灯片

一、我做的幻灯片

先看一下我用impress.js做的幻灯片吧!
加载可能会有些慢。如果打不开那就看一下作者的demo吧。
注:文字摇晃的特效使用的是CSSHake,视频用Chomp(ios)制作。

 

二、概述

impress.js是一个免费开源的JavaScript库,可以用来制作非常酷的幻灯片。如果你之前接触过Prezi,肯定还记得那让人赞叹的特效吧。而impress.js就是受Prezi启发做成的。

常见的幻灯片工具有微软的PowerPoint【1】,苹果的Keyword等。不常见的有Prezi等。除此之外,还有一些通过HTML,CSS,JavaScript等前端语言制作的工具,主要有impress.jsreveal.js(这个有时间探索一下),deck.jshtml5slides。其中impress.js最让人印象深刻(impress!),使用它可以你可以制作出许多特效:三维空间的无限延伸,3D效果,任意角度的旋转,任意大小的缩放,把一页幻灯片放在三维空间的任一位置。算了,语言是苍白的,看看作者的demo吧。

虽然效果很好,但impress.js也有一些缺点:比如编辑方式太繁琐(其实是需要学的东西很多……),尤其是想要获得一些特殊效果时。总的来说,impress.js比较适合以演讲内容为主的展示(参考高桥流简报法),单页只放一个名词或句子,或是一张图片,这样会带来比较出众的效果。可以用它来做一个词云图,前提是演讲水平够好。

先泼一盆冷水,工具是为内容服务的,如果你没有什么好的内容——要么是有质量,要么有意思,那么幻灯片做的再炫也没什么用。当然,如果你只求酷炫,那当我没说。

 

三、前提要求

需要一些HTML和CSS的基础知识(会JavaScript更好),没有的话花几个小时到w3school中文)或MDN上了解一下。

按照作者在代码注释里说的,你不光得有HTML和CSS的基础知识,还得有设计的眼光。因为impress.js没有默认的风格或样式,一切都得你自己来。而且作者不希望所有的impress.js展示都像demo一样,所以,明白了方法就自己从头做起,你会体会到很大的乐趣的!

英文好的还是去看源代码吧。作者的注释很详细,也很有趣。

 

四、文件的使用

新手可能会对文件有些疑问,所以在这里说明一下。不需要可直接跳至下一节。

下载

你可以到项目的Github页面下载文件,或者直接点击这儿下载。解压后会得到一个文件夹,双击打开根目录下的index.html就可以看到作者的demo了。

 

主要文件组成

impress:

  • js
    • impress.js(JavaScript文件,提供特效支持)
  • css
    • impress_demo.css(CSS文件,提供样式支持)
  • index.html(HTML文件,幻灯片的入口,也是你写入幻灯片的地方)

 

如何“制作”幻灯片

你要做的就是创建一个HTML文件(使用文本编辑器比如Notepad++),demo对应的HTML文件就是根目录下的index.html。然后把CSS文件和JS文件引入你的HTML文件里(见“初始化”),接着把你的幻灯片按照一定的属性设置写进HTML文件里(见“创建幻灯片”)。最后用浏览器把这个HTML文件打开就可以了。

 

五、初始化

头部(head

先把文件下载下来,然后创建一个HTML文件,把下面的head放上去:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />    
    <meta name="viewport" content="width=1024" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>impress.js</title>
    <link href="css/impress-demo.css" rel="stylesheet" />
    <link rel="apple-touch-icon" href="apple-touch-icon.png" />
</head>

头部信息经过删改。

 

错误反馈

接下来是一个错误反馈的class,当浏览器不支持时会显示,可以改写错误信息的内容。也可以不加。

<body class="impress-not-supported">
<div class="fallback-message">
    <p>Your browser <b>doesn't support the features required</b> by impress.js, so you are presented with a simplified version of this presentation.</p>
    <p>For the best experience please use the latest <b>Chrome</b>, <b>Safari</b> or<b>Firefox</b> browser.</p>
</div>

 

编辑幻灯片区域

创建一个id为impress的div,待会所有的演示文稿都要放在这个div里:

<div id="impress">
</div>

 

操作提示

下面这两段分别用于在电脑和移动设备上提示用户怎么控制幻灯片:

<div class="hint">
    <p>Use a spacebar or arrow keys to navigate</p>
</div>
<script>
    if ("ontouchstart" in document.documentElement) {
        document.querySelector(".hint").innerHTML = "<p>Tap on the left or right to navigate</p>";
}
</script>

 

调用JS文件声明

这两行放在文件的最后。声明对impress.js的引用,并且初始化impress.js。

<script src="js/impress.js"></script>
<script>impress().init();</script>

别忘了关闭上面的几个标签:

</body>
</html>

点击这儿看完整的模板文件。

 

六、创建幻灯片

impress.js创建了一个三维空间,所有的幻灯片都有各自的位置坐标(x,y,z)。整个空间的中心是原点(0,0,0)。其他的幻灯片或文字都是相对于这个原点来设置位置的。(中心不一定是第一张幻灯片)

像之前提到的,所有的幻灯片都要放在一个id=impress的div里。而且所有幻灯片都使用一个div。设置幻灯片的各个参数如下:

id(可选)——可以用来表示幻灯片的顺序,格式是id=“step-N”,(比如id=”step-2″,序号为2)。如果不指定id的话,幻灯片按照代码从上往下的顺序出现
class(必须)——通常有两个值,“step”表示一个步骤,元素透明显示,“step slide”有幻灯片白色方框。

其他的调整选项都以data开头。

位置属性

data-x——表示x轴坐标
data-y——表示y轴坐标
data-z——表示z轴坐标

坐标的设置,如图所示。需要注意的是Y轴向上是负值。简单的理解就是:往右(x),往下(y),往上(z)是正值;相应为负值。

坐标

坐标方向

常用效果

data-rotate——表示旋转,分别有data-rotate-x,data-rotate-y和data-rotate-z(同data-rotate),值表示旋转的度数。正值表示按照相应的轴顺时针旋转,负值则是逆时针。
data-scale——表示幻灯片的大小,如data-scale=”4″表示比其他幻灯片大四倍

 

不常用属性

data-transition-duration——幻灯片切换的时间,默认为1000,单位为ms(1000ms=1s)

data-perspective——表示视角,设为0则取消3D效果。默认为1000。更改前最好知道你在干什么,详情见:https://developer.mozilla.org/en/CSS/perspective

 

示例

第一个div创建了一个有白色底框的幻灯片,位置在第四象限,沿x轴顺时针旋转90度。文本是100px大小的“Hello, world!”。

    <div class="step slide" style="font-size:100px" data-x="0" data-y="0">
        <q>Hello, World!</q>
    </div>

 

第二个div创建了一个透明的幻灯片,位置在第一张幻灯片的右上方,绕z轴旋转90度。

    <div class="step" data-x="2000" data-y="-2000" data-rotate-z="90">
        <q>Hello, You!</q>
    </div>

第三个div创建了一个透明的幻灯片,位置在第二张下方。

    <div class="step" data-x="2000" data-y="-2000" data-z="-5000" >
        <q>Hello, Boy!</q>
    </div>

第四个div创建了一个透明的幻灯片,位置在第三张绕y轴旋转90度的地方,2倍大小。

    <div class="step" data-x="-2000" data-y="-2000" data-z="-5000" data-rotate-x="180" data-scale="2">
        <q>Hello, Girl!</q>
    </div>

点击这里查看这四张幻灯片的效果。

 

全景图

最后一个div是一个全景图:

    <div id="overview" class="step" data-x="3000" data-y="1500" data-scale="10">
    </div>

以上这些属性可根据需要调节,只有xy坐标是必须的

 

七、插入媒体问题

使视频和音乐在进入幻灯片时自动播放

html5可以使用<video>和 <audio>标签插入音视频,控制方式有三种:

controls

显示视频控制条

loop

自动播放,循环播放

autoplay

 自动播放

代码如下:

<video width="320" height="460" autoplay>
    <source src="video/test.webm" type=video/webm>
</video>

音频的代码类似,只要去掉宽高设置,更改文件的type就可以了。

在impress.js中,把视频标签放入DOM限制了媒体的autoplay。这时我们可以在impress.js中插入这段代码:

var videoStep = document.getElementById("video-step");
var video = document.getElementById("video");
videoStep.addEventListener("impress:stepenter", function(){
    video.play();
}, false);
videoStep.addEventListener("impress:stepleave", function(){
    video.pause();
}, false);

代码解释:

1~2行:设置了两个变量,分别代表幻灯片和视频文件,后面分别填上相应的id。
3~5行:监听当前幻灯片上的事件,如果进入幻灯片就执行相应的函数(即播放视频文件)
6~8行:同3~5行,这次是设置离开幻灯片时执行的函数(即暂停视频文件)。

然后把有视频的那张幻灯片的id设为video-step,视频的id设为video。

<div id="video-step" class="step" data-x="-50000" data-y="2000" data-z="-60000" data-scale="6">
    <video id="video" width="420" height="340" autoplay>
        <source src="video/IMG_1254.webm" type="video/webm">
    </video>
</div>

这样视频就可以在进入到那张幻灯片时开始播放,进入下一张幻灯片时就自动暂停了。

 

一张幻灯片里放入多个视频或音频

以放两个视频为例:

第一步:
在上面那段JS代码里定义两个视频文件的变量(比如video1,video2):

var video1 = document.getElementById("video-1");
var video2 = document.getElementById("video-2");

第二步:
进入幻灯片时执行的函数变更为:

videoStep.addEventListener("impress:stepenter", function(){
    video1.play();
    video2.play();
}, false);

离开幻灯片时执行的函数相应修改;

第三步:
HTML文件设置相应的id。

 

在不同幻灯片里分别放入视频

以在三个幻灯片中放置视频为例:

  1. 在impress.js重复插入三个上面那段代码;
  2. 改掉变量名称(videoStep和video);
  3. 相应地更改其他位置的变量名;
  4. 修改相应的id名称(video-step和video);
  5. html文件设置相应的id。

插入音频的方法,以此类推。

 

背景音乐

上面的方法只适合在某一页幻灯片上放置媒体,而如果想要全程播放背景音乐的话,就可以把audio标签放在整个编辑幻灯片(id为“impress”)的div之外。同时,你还可以在任一页控制背景音乐的暂停与播放。方法相同,也是插入上面那段JS代码,更改相应的变量和id,然后设置相应的操作,具体见上面那段代码的解释。

 

编辑JavaScript

我还没开始学JavaScript,能给的建议就这几点:

  1. 保持相同的缩进;
  2. 语句后加上分号;
  3. 变量名不能重复;
  4. 另外,HTML里的ID也不能重复

 

八、头脑风暴

把impress.js和其他的前端工具搭配使用,你会获得更加有趣的效果,比如reveal.js的作者推荐的许多有趣的前端项目。再比如CSShake(可以让文字或图片实现各种摇晃效果),参考我之前写过的介绍示例页面。或者是做出一个词云图来,都是很好的创意。当然,你得会演讲。

impress+word cloud

impress+word cloud

像demo里说的,唯一的限制就是你的想象力,快去探索吧!

 

九、Last but not least

把作者的最后一大段注释翻译过来吧:

“现在,完成你第一个impress.js幻灯片的所有知识,你差不多都有了。但是在你开始之前……
啊,你已经从Github复制了代码?
你已经打开编辑器粘贴了上去?
快停下!
幻灯片不是这样做的。这些只是代码。实现这些创意之前你得在心里完成它们。

如果你想做出好的幻灯片,就拿出铅笔和纸。关掉电脑。打个草稿,写写画画,通过头脑风暴把你的创意在纸上展现出来。试着把你想展示的东西做出个思维导图。这会让你离待会你要用impress.js实现的排版越来越近。只有当你把你的展示在纸上做好了,再回到代码前。太早写代码没什么用,因为那样你只会把你的时间浪费在和没用的点坐标搏斗上。

如果你觉得我疯了,那么请你把你的手放在一本叫做《展示的哲学》(”Presentation Zen”)的书上。这本书完全是关于如何创建让人赞叹和着迷的幻灯片的。

好好想想,如果你没有什么有趣的东西要表达,impress.js可能帮不了你什么。”

 

十、附录

作者的Twitter:@bartaz
项目Github地址【https://github.com/impress/impress.js

 

注释

1】因为大部分人都会用“PPT”代称幻灯片,可是“PPT”本身指的是用微软的演示文稿工具PowerPoint做出来的幻灯片(其生成的文件格式默认为ppt),而英文里这个在做展示/报告(Presentation/Slide Show)时用的东西一般称作Slide,翻译过来是幻灯片或是演示文稿。本文统一称为幻灯片。

我目前为止做的最好的幻灯片

花了两周左右的时间做了一个幻灯片。这周四终于要展示了,很兴奋。

这是一门建筑材料课,最后一次课是两个班分成若干组,各小组把课题调研结果做成幻灯片展示。恍恍惚惚两节课,像是在用幻灯片做演讲稿的朗读比赛现场。等啊等,终于轮到我们组了。按照之前预演过的程序,我离开座位,靠窗的同学帮我拉上窗帘,我上前关上所有的灯,连接电脑,氛围就绪!

因为幻灯片里放了很多录音和视频,我就没有站在讲台上,拿着任天堂的小键盘在下面当了放映员。看着自己做出来的东西,听着身后响起的一阵阵掌声和欢笑,真是开心又感动。

观看提示:

  1. 这个幻灯片的主题是吊顶材料。
  2. 里面出现的人物都是我的舍友和小组成员(感谢陈中华和董淑松的支持!)。
  3. 关于制作这个幻灯片的细节,见做个有趣的幻灯片用HTML写幻灯片

Addition Notes:

  • 幻灯片:http://greyli.com/slides/2016-building-material(包含大量视频,考虑到网速和浏览器支持情况,建议直接看视频)
  • 幻灯片使用 Impress.js 制作,混杂了很多效果,比如 CSShake,其中的动画用了 iPad 上的 Chomp。用 AHK 做了启动放映的快捷键。因为想做成一个类似动画的东西,所以严格来说不算是演讲。关灯后用蓝牙键盘在第一排控制放映。现在来看,有些内容大概有些恶趣味……><。放映的现场效果很好,可惜没有录像。

做个有趣的幻灯片

我觉得一个好的演讲通常有这么几种情况:

  • 你做了特别厉害或有意思的事情,要把经验或是成果分享出来(比如说苹果的发布会);
  • 你有很独特的或是值得思考的想法(比如各种TED演讲);
  • 你特别擅长带动现场气氛(当然得有一个好的内容做前提);

一般来说,只要你具备了上面任意一种情况,那么不论你用不用幻灯片,用什么幻灯片都没关系了。但如果你以上几点都不具备,你还可以做个有趣的幻灯片来补救。不能让大家思考,那就让大家发笑。只要你要演讲的主题不是“弘扬XX主义河蟹价值观”这样无聊的话题,总可以让幻灯片变得好玩起来。

从大一开始,我做过几次展示。用到幻灯片的有三次,这三次都没有制作常规的幻灯片。一是因为我对PowerPointKeynote等主流工具不熟悉,二是这三次做的展示更适合用这些特别的幻灯片。

第一次,是一个创业项目的展示,我用了Prezi,反响热烈,很多人问我用什么做出来的。内容倒也没有多出彩,但效果的确很棒。第二次,我用了PPT(指微软的PowerPoint),不过使用的是“高桥流简报法”,简单地说,就是简化内容,用超大号的字体。因为字体和PPT版本问题,也有自己演讲水平的原因,并没有达到预期的效果。第三次,我用了impress.js,非常成功。算是目前为止做的最好的幻灯片,现场反响也最热烈。

一、Prezi

prezi

prezi编辑界面

Prezi是一个在线制作幻灯片的工具(也提供本地程序),主要的特点是使用了完全不同于普通幻灯片的缩放用户界面(ZUI),可以让用户放大或缩小幻灯片元素(文字,图片,视频等)。这是官方的示例,这是一个中文的示例。网站提供了功能受限制的免费账户,同时有限定试用期的本地程序可以使用。主要的缺点是对中文的支持不太好。另外这个网站(Prezibase)上提供了一些免费的模板。

 

二、高桥流简报法

高桥流简报法(日语:高橋メソッド,英语:Takahashi Method),是日本Ruby协会会长高桥征义发明的一种简报技法。

在2001年的一次演讲中,因为恰巧没有简报工具,于是高桥使用了与一般主流简报方式完全不同的方法:他使用HTML制作投影片,并用极快的节奏配上巨大的文字进行简报,带给听众有如与日本电视动画新世纪福音战士》(新世紀エヴァンゲリオン)相同的视觉冲击。”——维基百科

高桥流幻灯片示例

这是我用高桥流简报法做的幻灯片的一页,字体用的是A-OTF Gothic MB101 Pro B

YouTube上的这个视频可以帮你快速了解这个方法。而这个是作者使用中文做演示的视频。作者使用的是日文字体极太明朝字体,但是这款字体有些字显示不出来,可以试试别的字体。我觉得字放大了以后,繁体字加粗更美观一些。这种幻灯片要求你的演讲内容要紧凑,结构清晰,PPT上应该都是你要讲的内容的主要论点或是关键词。

 

三、impress.js

先来参观一下我的作品吧!

impress.js是一个免费开源的JavaScript库,可以用来制作非常酷的幻灯片。另外也可以看一下作者的demo,或是这个非官方的示例。类似于Prezi(本身就是受Prezi启发),但是使用HTML来编辑,没有客户端的限制,可以自己利用前端技术扩展效果(比如这个网站上推荐的许多前端项目)。缺点之一就是编辑方式太繁琐,有一定的技术门槛。我写了一篇使用教程,感兴趣的朋友可以了解一下。

 

四、词云/标签云

词云图

词云图示例

词云图,顾名思义,就是把词语像一片云一样堆起来。事实上,你可以把一堆字堆成任意的形状。英文里叫Word CloudTag Cloud。一般没有人单用这一张词云图来演讲,通常是用来做幻灯片的其中一页。制作词云图的工具一般有Tagxedo

 如果有机会,我想尝试一下只用这张词云图演讲。假如我用它来演讲的话,那么话题应该有专题性,内容应该由有许多关键词组成。单页的词云图不够生动,假如内容再没有多少吸引力的话,很容易变成催眠大会。假如能用Tagxedo搭配上impress.js,再使用高桥流简报法的话……哈哈,我自己都开始期待起来了。

 

五、总结

工具是为内容服务的,所以选择什么样的工具得先看你的演讲主题和场合。同时还是推荐大家去认真学习一个常规的幻灯片软件(PowerPoint或是Keyword),并且逐步提高自己的演讲和写作能力。好的演讲,我觉得有两个重要的指标,要么让人思考,要么让人欢笑。同时做到这两件事,才算是一场完美的演讲。

 但是无论用什么工具,请不要粘贴黑压压的一大段文字在幻灯片上(有时候可能是五颜六色的……)。然后演讲就变成了读幻灯片,偶尔还夹着几句生硬的套话。这个世界已经有太多糟糕的东西了,如果你不能认真的做个漂亮的东西出来,不能自然的讲话,世界也不会温柔对待你的。

浏览器使用技巧

很多人觉得浏览器没有什么技巧,不就是个上网的工具嘛。但事实不是这样,拿用电脑来说,会开关机,上网,玩游戏是第一层;懂得各种技巧,熟悉各种操作是第二层,理解操作系统原理和硬件运行机制,进而运用原理更好的使用电脑是第三层……我今天要谈的就是对浏览器的第三层应用。当然,上面还有很多层:)

其实这篇文章的重点不在技巧,而是对网页和浏览器原理的实践。这些技巧都是建立在对这些原理的理解上。文章分三部分。分别是对构成网页文件的介绍、在浏览器中访问这些文件的方法、技巧示例。同时,这篇文章也形成了一个完整的学习过程。也就是:理解基础知识——尝试和实践——探索和应用

提前剧透一下这篇文章能教会你什么

  • 不使用客户端在大多数音乐网站上下载音乐(比如豆瓣电台,百度音乐盒,酷我等等)
  • 破除网络课离开页面自动暂停视频的限制
  • 破除网页弹窗强制登记手机号的限制
  • 破除网页的文本复制和图片保存限制
  • 修改网页内容

事实上,知道了原理,你能做的事情远不止这些。

 

一、网页

假设你有一台电脑,安装了某个浏览器。你打开浏览器,在地址栏里输入了google.com,按下Enter,显示访问不了。好吧,这不好笑。换个例子,你又重新输了个网址:withlihui.com,也就是我的博客。按下Enter后屏幕上显示出了我的博客的主页。这中间发生了什么?(域名服务器之类的内容就先跳过,跟这篇文章没有太大关系,有机会再写一篇介绍一下。)

总的来说,你输入的地址其实可以看作是一个文件地址(脑海中浮现资源管理器地址栏),只是这个文件存放在我租用的服务器上面。你告诉浏览器要访问的文件地址,然后它读取了这些文件并显示出来。

一般的网页是由HTML文件、CSS文件以及JavaScript文件组成的,这三个文件共同合作,分别负责实现网页的基本内容(content)、页面样式(style)、功能效果(function。按照知乎用户胖胖小的说法,如果把网页看作一个句子的话,HTML是名词,CSS是形容词,JavaScript是动词。好了,知道这么多就可以了,想知道的更深入一点可以去看w3school中文)或MDN的文档。

 

二、浏览器

浏览器其实可以看作是一个文件查看器,事实上,它确实也可以读取本地文件,支持mp3mp4txtpdf等文件。只不过一般用它来它读取构成网页的文件(HTMLCSSJavaScript等),你在地址栏输入了一个文件地址(网站地址),浏览器找到那个地址上的HTML文件,然后读取相应的CSSJavaScript文件,把网页显示出来。更重要的是,你还可以通过浏览器查看这些文件,也就是源代码。我下面讲到的技巧都是基于这一点上的。

本文以Chrome为例,其他浏览器方法大致相同。在浏览器界面按下F12,或是右键点击检查( Ctrl+Shift+I (Windows) 或 Cmd+Opt+I (Mac)),这时就会打开开发者工具(DevTools),如下图所示:

devtool

Chrome开发者工具(devtool)

几个下面示例会用到的标签含义:
ElementsHTML代码(上半部分)和CSS代码(下面的Styles
Resources:网页文件所用到的资源,包括文件、数据库等。
Network:网页的加载情况,包括加载网页的各项请求和下载的资源,以及相应的时间。

标签左边的两个图标:
箭头:按下这个图标后,再在网页上点击一个元素,会查询到相应的HTML代码。(上图红色圈出)
移动设备:按下这个图标进入移动设备显示模式。

 

三、技巧示例

保存图片

大多数时候下,我们使用右键另存为来保存图片。可是有的时候,网站为了保护版权或是其他原因而“遮蔽”了这个功能,比如500px上的照片。

500px

500px上的图片

这时我们可以在开发者工具里用小箭头选择这个图片,找到相应的代码位置,在图片代码上点右键选择“Open link in new tab”,然后就可以下载了。

 

pic code

图片对应的html代码

另外,在ResourcesImages项里,还可以找到网页上加载的所有图片(大部分不是全尺寸原图)。

所有图片

网站用到的所有图片

去除文字复制限制

有些网站限制了右键和选择文字的功能,这主要是通过JS代码来实现的。使用开发者工具,可以很容易的破除这种限制。比如在这个网页上,相关的功能都被屏蔽了。打开开发者工具,选择下方Styles标签旁边的Event listener。可以看到下面有很多被监听的事件,其中contentmenu代表右键菜单,selectstart代表选择文字。

event listener

event listener

把这两个事件下面的document去掉(点击remove),这时页面就恢复正常了。

 

保存网页为pdf

有时候我们想把网页存成pdf打印,但电脑又没有连接打印机,刚好也没有安装相应的插件,这时开发者工具就派上用场了。

打印示例

打印我的博客主页示例

在想打印的页面按下Crtl+P,在预览页面上右键打开检查,找到图中的src属性,复制src的值(比如图中的chrome://print/4/0/print.pdf),然后粘贴在地址栏里打开就可以下载了。

 

保存音频

有时我们想下载某个音频,网站却没有提供下载选项,除了下载插件,也可以使用开发者工具来完成。在播放音乐之前,打开开发者工具中的Network标签,然后刷新一下页面(F5),开始播放音乐,这时可以看到加载的资源里有一条时间线很长的记录,那个一般就是你要找的音频文件。照旧,在那条记录上点击右键,选择“Open link in new tab”,会开始自动下载和播放。

 

音乐下载示例

下载豆瓣FM音乐

对有些使用特殊方法来引用资源的网站无效,目前测试成功的有豆瓣FM、百度音乐、酷我音乐、谷歌翻译录音。

 

修改网页信息

我们可以在本地修改网页上的信息。打开开发者工具,使用查询箭头点击页面上你要修改的字段,比如说百度首页的“百度一下”,定位到右边HTML代码中相应的位置。

修改百度首页的字段

修改百度首页的字段

双击“百度一下”字段,修改它,然后按下Enter键,就变成了下面这样:

效果展示

修改后

再比如,定位到搜索框上面的图片,然后修改图片的src属性,将后面的值修改成google首页的图片地址(如果想要修改为本地图片的话,可以把网页下载下来,不细说了)。按下Enter就成这样了。

效果2

当然,除了和别人开玩笑外太大用处。一刷新就没了。

 

破除网络课离开页面暂停视频限制

一定有人很期待这个功能吧。如果课很好还是认真听一听(比如周海宏的音乐鉴赏)比较好,很烂的话就往下看吧。方法同样很简单,打开开发者工具后,依然是通过小箭头选择工具选择视频元素,定位到代码。然后清除id的内容,再按下回车就成功了。

video example

双击红圈中的id值,删除后回车

原理就是,通过清除id,切断了页面元素(视频)和控制它的代码的联系(JavaScript),具体下一小节。另外要说明一下的是,刷新后网页代码会还原,所以需要再重新清除一下

 

去除叠加窗口

这条还是很有用的,有了前面的基础知识,我们已经知道了网页的基本构成,也学会了如何查看网页的源代码。那么有一天我们想在某网站上下载一个文件,越过层层的障碍,注册了账户,添加了各种信息,结果回到下载页面又让我注册手机号……而且还没有关闭窗口的按钮,太流氓了。不仅如此,还定期显示这个窗口。

窗口示例

某网站上跳出的窗口

我是不会让流氓得逞的。定位到相应的HTML源代码,这些窗口在HTML是一个块(div),通过相应的classid连接到对应的JSCSS代码,我用小箭头工具选择填手机号的小窗口,然后发现整个窗口对应(最外层)的class是PhoneCertificationModal,清除掉,按下enter就会发现窗口不见了(如果无效可以再把id的值也清除掉)。

去掉窗口

去除窗口

其实窗口并没有去除,只是因为没有了JSCSS代码的支持,它就失去了页面效果,变成一堆字扭在一起,跑到页脚去了。

去除样式的效果

失去了css和js支持的孤单的html代码

可是网页这时是一片灰色,遮住了想要点击的内容。这时再用同样的办法,点击小箭头选择这个叠加的窗口,把相应的class清除清空。这时页面就恢复正常了。

和上面的更改网页信息一样,修改了之后只要点击刷新,网页就会恢复到原来的状态,所以不要害怕会玩坏:)

 

去除WordPress插件限制

比如说显示文章概要的插件会限制你readmore字段的字号,假如你想要设置的话就得花钱升级。这时可以在字段里插入HTML代码,自己设置字号大小。

去除插件限制

去除文章概要插件的字号限制

很多论坛的评论就支持少量HTML代码,再早一些,有些网站没有限制评论支持的HTML代码,导致很多搞笑的事情出现,比如说占满整个屏幕的大字……

 

后记

以上这些内容建立在我现有的知识水平上,所以讲得还不够完善,欢迎指正。希望这篇文章能给感兴趣的人作一把小小的梯子(如果帮到了你,请告诉我)。你可以从下面的链接开始新的学习路程。

 

进阶

这些地方会给你提供更多帮助:
Chrome DevTools 文档【https://developers.google.com/web/tools/chrome-devtools/
MDN(Mozilla 开发者网络)【https://developer.mozilla.org/zh-CN/w3school【http://www.w3school.com.cn/index.html

 

文章写作格式规范

因为没有统一的格式,前面的文章看起来有些乱。网上没找到合适的格式规范,主要是些有利于SEO的格式建议,大多都有些迎合读者的意思。所以我打算自己做一个。这篇文章本身也是格式规范的示例。这份规范会持续更新和完善,暂时命名为BWF1.0(Blog Writing Format)吧:)

 

一、文章格式

标题与正文

  1. 标题尽量简单,突出内容要点;15个字符以内。(标题示例见参考链接第三个)
  2. 使用中文全角标点符号。
  3. 二级标题加粗,字号16;有顺序关系的主题前面加中文数字和顿号。
  4. 三级标题加粗,字号14。
  5. 二级标题之间空两行,三级标题之间空一行。
  6. 正文字号12。
  7. 引用独立成段,斜体。

 

内容

  1. 开头第一段为总结性文字。
  2. 一个主题一段。
  3. 使用二级标题和三级标题来分解主题和步骤。
  4. 语言尽量口语化。
  5. 尽量用图表和列表来代替描述。
  6. 尽量安排每段第一句为中心句。
  7. 重要内容使用粗体。
  8. 为相关内容嵌入链接。
  9. 删除多余的词句,尽量保持句子简洁易懂。

 

链接

  1. 有文章标题或关键词的内嵌到标题。
  2. 没有标题的写出完整链接,用<>括住。
  3. 重要的链接。写出完整地址,用<>括住。
  4. 文末给出参考链接,“参考链接”字号14,斜体。
  5. 参考链接表面文章标题或网站名,并附上完整链接。
  6. 文中注释通过“【1】”标注,文末格式同参考链接。

 

图片

  1. 配图是因为内容需要,而不是为了装饰或吸引读者。
  2. 图片不放在文章开头,放在概述文字之后。
  3. 格式使用JPG(体积小,速度快)。
  4. 图片大小不超过300K。
  5. 图片都应该加上合适的ALT属性,配上包含文章关键字的文字说明。
  6. 图片和说明居中显示。
  7. 图片使用缩略图,点击查看大图。
  8. 第三方图片注明出处,链接用“<>”括住。

 

翻译文章

  1. 文章标题前加“<译>”前缀。
  2. 需在文章结尾处注明原作者,原标题,并给出完整链接。

 

 

二、笔记格式

(笔记包括读书笔记,课程笔记等。)

主要项目

  1. 书籍或课程介绍,放入相关链接;
  2. 主要内容总结;
  3. 我的思考和评价;
  4. 摘抄和截图。

 

内容

  1. 摘抄内容加上章节标题或自定标题。
  2. 谈话用引号括住,斜体。
  3. 重点内容用粗体。

 

参考链接:

  1. 月光博客博客写作编辑规范 <http://www.williamlong.info/archives/1775.html>
  2.  The Elements of Style <http://www.crockford.com/wrrrld/style.html>
  3. 7 Wildly Popular Post Formats You Can Use in Your Blogging <http://www.struto.co.uk/blog/7-wildly-popular-blog-formats>

《笔记本圆梦计划》笔记

 

概述

这本书是高中的时候在豆瓣上发现的,放在待读清单里一年后买下。读了之后照着书里介绍的方法做笔记,但却并没有给生活带了很大的改变。想起来也好笑,一个普通小县城里的高中生,凭着笔记本能给自己带来多少机会和改变呢?没多久,鼓捣很久的笔记本就放在了一边。直到最近,整理柜子时发现了这本书,准备把它清理掉,就顺手整理了一下笔记。

作者的一个主要观点就是把梦想在笔记本上写下来(梦想笔记本),然后把梦想细化成年月周日的目标(行动笔记本),同时记录对实现梦想有用的信息和思考(思考笔记本)。其他的大多数观点就很普通了,比如通过多任务并行来节约时间,给任务设立Deadline等等。大部分都是一些提高效率的常识,在知乎或是Quora上都可以找到一大堆这样的小技巧。这本书可以用来了解时间管理上的常识和笔记本的使用方法,但现在看来,并不推荐购买,如果感兴趣可以先看看我整理的章节要点。不过作者书后附录的梦想金字塔和未来年表倒是值得试着做一下(见文末附录)

书中也有一些我看来不合适的观点。比如作者把所有的资料全部打印成纸质,分类收集。这样并不利于检索,不如把资料都放进OneNote或是其他笔记软件。另外,有些不太实用的章节就没有整理出来。总之,多思考,多实践,不要迷信笔记本的力量,更不要掉进追求完美工具的怪圈(多少人把时间都花在了选择工具上)。

虽然没有完全按照作者的方法做笔记,但未来年表和梦想金字塔我倒是认真做了。我目前主要使用OneNote来收集整理资料、做笔记和写总结等。平时会配合使用一个小的纸质笔记本来记录日常任务、短期计划和一些杂乱的想法。日记则有专门的日记本。

 

章节要点

一、记事本的使用方法将决定你的人生

  1. 把梦想写进记事本,随身携带。
  2. 借由书写的仪式感加强情感。
  3. 使用笔记本来分担大脑的压力。
  4. 使用活页记事本和自动铅笔,圣经大小(FILOFAX牌)。

二、没有梦想,就无法让美梦成真

  1. 长远思考自己的目标,梦想,想做的事,列出“想做的事清单”。
  2. 不必被世俗的眼光约束,自由的写下所有想做的事。
  3. 给清单分类,共六类,见文末附录。
  4. 做未来年表,把清单填入年表,以5年为一单位。
  5. 认清现实,衡量差距,细化目标。尝试将目标转化为习惯。
  6. 目标可以延期,但不能放弃。

 

三、三种笔记本,让梦想都实现

  1. 梦想笔记本,让梦想具体化(描述,图像),列出实现的必要条件,转换成目标(年月日)。
  2. 制作进度确认表,监控完成率。
  3. 行动记事本,核心是中长期及短期计划行程表。
  4. 收集自己觉得重要的句子,分类整理。时常抽出来,放在日程表里,或是书写思考。
  5. 制作执行清单,设置优先级,收录临时任务。
  6. 思考笔记本,用确认清单来组织整合项目,或做头脑风暴思考。标注具体方法,注意事项等。

 

四、我的工作术与读书术

  1. 没有期限的工作是无法期待成果的
    不管是多么细微、无趣的工作,只要给它一个期限(deadline),突然间对这个工作的态度就不一样了。
  1. 将所有的目标数据化(无法数据化的目标,根本就称不上目标)
    将目标数据化有助于养成好习惯,“一个人的习惯会造成他的人格,人格将会左右一个人的命运”。
  1. 把“重点是什么”当作口头禅。
    经常在心里默念,“重点是什么?现在最重要,最要紧的是什么?”
  1. 无法解决的问题,是不会发生在你身上的。
  2. 终身学习。学会运用知识。
  3. 先沉住气,找到最短距离后再向前冲。
    “对于任何事都不马上付诸行动,首先思考最有效率的方法,才开始进行。”
  1. 积极找机会与大人物接触。
    重要的是要保持与人邂逅、得到鼓励的心情,将“想要碰面听听您的意见”的热情传达给对方。
  1. “人们对言行得体的人没有攻击力。”
    “比起任何事,礼仪都是最重要的,与人相处时敞开心胸,让对方也接受我。应该要顾及对方的心情,不要有引起对方不快的行为。”

    我的公司的三条社训:一、要大声的与人打招呼。打起精神来。二、展现你的笑容、让心情快乐。三、对人要有礼貌,尊敬他人。

  1. 无法心怀感激的人只会斤斤计较。

        心得:

  1. 好运的人,现象也很好。给人一种光明、温暖的感觉。不责备他人。有活力。心怀感恩,早起,明朗。
  2. 不开朗的人心里有许多杂念。要去除这些杂念(讨厌的想法、憎恨、痛苦),必须把心从最原始的地方开始整理。
  3. 最基本的是要对双亲怀有感恩、感谢的心。这样人们才会重视他。没有感恩之心的人只会以利益为前提与人交往。

        努力养成心怀感激的习惯:

  1. 人的心若是放任不管,就很容易陷入负面的情绪当中。

    举例来说,当你觉得不是那么喜欢某个人时,很快地就会有这个人很讨厌或不好对付的感觉,这是人心自然的发展。所以,我们就要努力抑止人心自然的发展。不论这个人让你觉得讨厌的理由为何,在那之中一定有值得学习的地方。总而言之,不要去批评别人的缺点,而是养成只看好的一面的习惯,就会自然而然产生感谢的心情。

    与此同时,因为自己以感谢的心情待人接物,对方也会因此改变。

    越是对人怀有感谢的心情,就越会加深心里的平静。

五、我的信息收集与信息整理术

  1. 使用笔记本记下所有重要的事情边
    与人谈话边记下要点
    为重要的人设立资料专区
  2. 一件事情整理在一张活页纸上
  3. 收集信息的三种利器:梦想、红笔、比较
    以梦想为出发点去收集信息会提高信息的质量
  4. 报纸要先看再读
  5. 利用杂志、书籍的空白处
  6. 网络是最有效的信息收集工具
    与”思考“工作相关的信息,能够“打印成纸本”是最好的。
  7. 整理信息的三种利器:记事本、电脑、A4档案夹
    所有的资料限定为笔记本大小(圣经尺寸)和A4
    信息要整理的有条理,方便查阅

 

六、我的时间创造术

  1. 多用“同时进行”的活动
  2. 投资时间

        不论是什么场合,我都会考虑“是否可以用金钱来换取时间呢?”

        举例:

  • 不论价格便宜或贵,消耗品一次大量购买;
  • 坐头等舱,换取优质的工作环境;
  • 感兴趣的书,立即买下,省去犹豫的时间。
  1. 善用手机,增加时间
    (多部)手机依功能分开使用,提升时间的效率。(比如边打电话,边看信件)
  1. 排除会打断集中思考的要素
    我建议最好一开始就排除可能会出现的打扰。当我想集中精神在工作上时,会事先把其他细微的杂事或是与人相关的工作统一处理好。
  1. 有条不紊,不再东翻西找
    把东西整理好,制造出一个自己使用起来十分顺手的环境,就能减少很多找东西的时间。(可以把合适的衣服搭配拍下来贴在衣柜上)
  1. 说话要开门见山
    社内沟通的基本要求就是“只看主题”,“结论优先”。这是不浪费自己及他人的时间的方法。

    为了让人际关系更加圆滑,必要的场合下,我自己也会有意识地空出一段时间跟他人闲扯。

  1. 有效的处理电子邮件
    基本上靠打电话可以解决的事情就用打电话的方式处理。
  1. 休息时要拼命地休息、玩乐
    我认为,因为拥有休息时间而有余裕享受与工作不同的充实感,也是成功人士不可或缺的能力。
  1. “灵感”多在休息时间迸发

七、我的经营&管理核心

  1. 比获利更重要的东西
    经验公司最大的目的绝对不是在追求营收、获利,而是让经营者的梦想及感动,与员工、顾客、股东、合作厂商等人共同分享。

    经营者若不能抱着想与所有事业相关的人共同实现梦想的想法,终究是无法得到最佳成果的。

    下面几个小节的内容没有什么新意,主要是注意细节,求胜心理等话题。有一节的标题为:政策制定的标准为“笑容”和“感动”,倒是值得思考一下。

 

八、格言

  1. 与别人做一样的事情,是无法赚钱的。
  2. 发明其实是一种组合。就像附有橡皮擦的铅笔。
  3. 绝对不会消失的基础建设事业,能够产生稳定的收益。
  4. 一个人的习惯会造成他的人格,人格将会左右一个人的命运。

 

九、梦想金字塔&未来年表

IMG_1311

梦想金字塔

三种笔记本

三种记事本与内容索引

笔记术

圆梦笔记本范例

未来年表

未来年表

 

 

 

生活的秩序

许多人的生活已经失控了,而他们不知道。他们的每一天都被其他人支配着,各种各样的碎片信息,填补着永不满足的欲望。一无所长,却异常忙碌。游戏,音乐,电影,新闻,网站,APP,无穷无尽。他们不知道自己需要什么,什么才是重要的事情,即使知道,也无力从这些无数的快感和欲望交织的信息洪流里抽身。只能在休息的间隙感叹一下时间的流逝,青春不再,一事无成。这时,又会有一打的怀旧青春烂片来喂饱他们。

人的生活是他内心的缩影,大多数情况下,也和他的房间或书桌一样,杂乱或有序。有尊严的高雅的生活,应该是和谐有序的。内心高贵的人,不会纵容自己去沉溺在无用的肤浅的碎片信息里,不会去关心哪个明星有了外遇,哪个厂商新出了手机。

想要控制自己的生活?恐怕得先学会控制自己。现在的网络和应用设计时都考虑到利用人的弱点,闪烁的图标,瀑布流式的界面,雷人的标题,暧昧的配图。一切都变得更容易让人上瘾。做不做得到不浏览任何应用的推荐消息,只关注自己应该关注的内容,不点开无关的链接,不浏览社交网站推送的动态?做不做得到只在限定的时间内上网和游戏?不要自欺欺人的说,我在利用社交网络学习。真想学习,要么去搜索各个大学的公开课,要么去找相关的书来读。对于小白来说,豆瓣小组和大学里的社团有什么区别?知乎的答案最多也只是个参考,而不是学习材料。

在这样糟糕的互联网环境里,要做到控制自己的设备是有门槛的。换掉能换的国产软件,换不了的找国际版;退订网站的邮件推送,关闭应用的通知栏推送;清理开机启动项,关闭软件广告推送;安装浏览器广告过滤插件,买VPS翻墙使用Google和维基百科(使用Bing也行,总之不用百度)。花了那么大力气完成这些,你也只是刚刚脱离社交网络和媒体的控制而已,对整个生活来说,冰山一角。

时间是你要相处一生的朋友。记录每天的时间开销,设立娱乐时间的限额和每日目标的时间量,这让你逐渐取得对时间的控制权(或是与之和谐相处的能力)。生活里,有人嫌时间过得太慢,有人嫌时间过得太快,有的人会反思每一天是否过得充实而又价值。既没有开怀大笑,也没有学到知识,这样的一天不论快慢,都不太值得。当你发现自己在期盼下一个假期或是周末时,你的生活就有问题了,假如你做的事情使你乐在其中,哪里需要去期盼假期呢?

控制了时间,还要控制你的房间。你身边的环境既反映着你的心境和习惯,也反过来影响你的生活。你的书桌,衣柜,硬盘和手机都是你的心灵的外延和缩影。应该尽可能的保持整洁有序,每一件物品都应有一个合适的位置,定期清理无用或不需要的物品和应用。送给别人,让它去创造更大的价值。只买喜欢、需要且适合的东西。

房间的问题,归根到底是人的习惯和价值观问题。一个人的习惯影响着人格,而人格又左右着命运。多少人对自己的坏习惯安之若素,甚至觉得那是自己的特性。说到底还是因为无知和懒。一个心智成熟的人会不断培养好的习惯,同时反省改掉坏的习惯。而心智成熟从哪里来,从父母?从学校?从社会?恐怕都靠不住。唯一靠得住的只有阅读和网络了(但常常因为选择而充满了不可靠的因素)。怎么恋爱,怎么做爱,怎么和讨厌的人相处,怎么处理心理问题?在这个学校和家长教育缺位甚至会带来误导的大环境下,这些问题都要靠自己解决。看言情小说还是《爱的艺术》?看BBC的性爱纪录片还是劣质夸张的毛片?看心灵鸡汤畅销书还是心理学入门读物选择决定了生活的质量,也决定了人生。

搞定了上面这些问题,你应该会有一个美好的生活了。可是事情还没有完。一个糟糕的社会反过来会影响每一个生活在其中的人。在这一点上,个人的力量太渺小了。我们没有网络的自由,没有言论的自由,没有维护人权的自由,没有揭露和报道真相的自由。但面对社会上那么多的不平不义,每个人都有能够做出的努力:看到家庭暴力,儿童乞讨可以报警(110);看到井盖下沉,路灯坏了可以打市政热线(12345);遇到不公平的待遇可以到政府网站上投诉。我们有争不来(我相信总有一天会争来)的自由,但至少,不要让自己成为冷漠的路人,无知的看客,沉默的帮凶。

在我看来,完成这些,才算得上是一个精神自由,人格独立,有高雅情趣的人。

《奇特的一生》笔记

 

概述

 

bookcard

从一排旧书里取出这本书页发黄的小册子,借书卡上记录的最后一个借阅者是1989年化工专业的陈秋民。书里面还夹着他的一封叠起来的家书,不知道为什么没有寄出。已经过去快三十年了呢。还是要感叹一下,生活真奇妙。

这本薄薄的小册子讲了柳比歇夫和他的时间统计法。他的时间统计法说来也简单,就是在记事本上记下每一件事情花费的时间,然后每个月,每一年做出详细的总结和分析。这样的时间统计,他坚持了五十六年。在这五十六年里,他发表了七十来部学术著作,五百多印张各种各样的论文和专著。还有其他数不清的成就。

我推荐每一个想在某个领域内有所成就的人都尝试进行时间统计,这也暗合了《异类》中所提出的一万个小时理论。(推荐使用aTimeLogger来进行统计,参见我的介绍

像是书里说的:“如果每个人都知道自己能干些什么,那生活会变得多么美好!因为每个人的能力都比他自己感觉到的大得多,也就不会有那么多的人感叹自己因能力有限而一事无成”。他用自己的人生做了一个实验,希望我们不要辜负他,也不要辜负自己的潜能和才华。

 

摘录

(依照阅读顺序排列,段落标题自取)

屁股

我说,他的坐功当然是极好的。坐功好,不也是某些天才的特点么。说起来,这种本事在昆虫学之类的专业中颇为普遍,同时也是必需的。柳比歇夫自己就说过,他属于这样一类的学者,给他们照相,不该照脸,该照臀部。

 

时间感

多年来经常看表的结果,柳比歇夫肯定形成了一种特殊的时间感。在我们集体深处滴答滴答走着的生物钟,在他身上已成为一种感觉兼知觉器官。

他借助一种内在的注意力,感觉得到时针在表面上移动——对他来说,时间的急流是看得见摸得着的,他仿佛置身于这一急流之中,觉得出来光阴在冷冰冰地流逝。

 

自我解剖

做这样的分析(此处指分析自己的日常时间花销),比作忏悔需要更大的精神力量。在上帝面前坦白,总要比在凡人面前坦白容易些。把自己的弱点、恶习、空虚等等统统暴露在众人面前和自己面前,是需要勇气的。德鲁克说的对,只有让-雅克·卢梭或托尔斯泰这样的人,才能严格无情地解剖自己。

 

时间下脚料

“我在一天之内是怎么安排读书时间的?清早,头脑清醒,我看颜色的书籍(哲学、数学方面的)。钻研一个半到两个小时以后,看比较轻松的读物——历史或生物学方面的著作。脑子累了,就看文艺作品。”

“在路上看书有什么好处?第一,路途的不便你感觉不到,很容易将就;第二,神经系统的状况比在其他条件下良好。”

工作越深入,面也越宽。先是需要认真研究一下数学,后来又轮到哲学。……已经晚了,但他终于明白,他不懂历史不懂文学是不行的;不知道为什么,他还需要懂得一点音乐……

 

纯时间

应该挖掘一切时间潜力。明摆着,人不能老是每天工作十四五个小时。应当正确利用工作时间。从时间中找时间。

“工作中的任何间歇,我都要刨除。我计算的是纯时间。纯时间要比毛时间少得多。所谓毛时间,就是你花在这项工作上的时间。”

“工作经验表明,约有十二三小时毛时间可以用于非标准活动,诸如上班办公、学术工作、社会工作、娱乐等等。”

 

有效时间

计划的复杂性在于如何安排一天的时间。他决定,用去的时间应该同他从事的工作相称。也就是说,比方写一篇有独特见解的论文吧,占用的时间既不能太少,也不能太多。

计划就是挑选时间,规定节律,是一切都各得其所。头脑清醒的时候应该钻研数学,累了边看书。

应当学会不受环境的干扰,用在工作上的三个小时应当是真正做工作的三个小时,不干不相干的事,不听同事的谈话,不听铃声和笑声,也不听收音机……

这个方法之所以能够存在,是依靠经常的计算和检查。没有计算的计划是盲目的计划,就像某些研究所一样,光会做计划,却不去操心着计划能不能完成。

应当学会计算一切时间。

他把一昼夜中的有效时间即纯时间算成十个小时,分成三个单位,或六个“半单位”,正负误差不超过十分钟。

除了最富于创造性的第一类工作外,所有规定的工作量他都竭力按时完成。

要采用这种方法,必须知道一切有效时间,洞察时间中一切曲里拐弯的地方和空白点。这个方法不承认有什么不能利用的时间。所有的时间一视同仁,一样的宝贵。对于人,不应当有什么坏的,无用的,多余的时间。也没有休息的时间。所谓休息,是两种工作的交替,就像是正确的田间轮作制。

 

计划的制定

结算同时也是对计划的总结。一总结马上提出下个月的计划。

制定年度计划或月计划时,不得不依靠过去的经验。例如我计划要看一本什么书。根据老经验我知道我一小时能卡看……我就根据这个老经验来定计划。

“所有看过的东西,我都要仔细研究。怎么研究?如果一本书谈的是我不大了解的新东西,我就尽量做摘要。凡是比较重要的书,我都尽量写一份评论性的简介。”

除了年度计划,柳比歇夫还把他一生的时间制订成一个个五年计划。每过五年,他把度过的时间和干过的事分析一通,可以说是做个总的鉴定。

 

观察自己

做年度总结,要求进行自我分析,自我研究:效率有什么变化,什么没有完成,为什么……

柳比歇夫以他的总结作为镜子。这面镜子的水银有点儿特别:它找出来的不是人现在的面目,而是他过去的面目,才过去不久的。

柳比歇夫的总结公正客观的反应了过去一年的历史。柳比歇夫的方法,以它细密的网眼,抓住了变化无常的、老想溜掉的日常生活,抓住了我们没有察觉到的、损失掉的、不知去向的时间。

 

心境

个人的悲剧仿佛没有波及他的工作精力,在日记、总结和计划中没有留下任何痕迹。

私生活和心境不能妨碍工作。心境及其它的喜怒哀乐自有它们的时间,统统放在“家务”栏里。

 

精神面貌

人的精华中,最值得称道的、最牢固的,是精神价值。一年年过去,学生们没有一点遗憾,若无其事地换了导师、师傅、老师,换了头头,换了心爱的画家和作家。但是,谁要有福气遇见一个纯洁的、精神世界很美的人,你恨不得把心都掏给他这样的一个人,——谁要是遇见了这样一个人,就没有什么可换了。因为人不可能长进得超过身量或真诚。

 

衣着

稍有些故作“癫狂”,并不坏:小市民会对你有些讥讽嘲笑,这是一种有益的心理上的锻炼,能让你我行我素的精神……

 

科学家的文化修养

这些人的文化修养,广度和深度都比得上文艺复兴时代的意大利人和法国的百科全书派。当时,科学家兼是思想家。科学家善于使本学科与整个文化之间保持和谐一致。科学与思想携手并进。如今,这种友好合作关系被破坏了。

 

分类与整理

对一位科学家来说,整理和组织材料的过程本身,就是一种享受。即使这一工作没有什么重大的意义,例如坐坐复制品的卡片目录,但从事这一工作时,感到很愉快。这种快感,实际上就是意义本身。

这种为科学家和分类学家所独具的想法,在柳比歇夫身上也可以找到。每个科学家在某种程度上都有一种特性,那就是要把混乱的东西归纳成体系,发现其内在的联系,总结其规律性。

 

特别的事业

在我们的时代,决心献身于一种旁人看来极不严肃的工作,是需要有一定的勇气的。需要勇气和热爱。当然,每一个真正的科学家总是热爱自己那一门科学的。特别是当科学研究的对象本身是很没的时候。不过,除了星星、蝴蝶、云彩、矿物而外,还有美的东西,不过这种美,除了专家,谁也看不见。这大部分还是抽象的东西,如数学、力学、光学。

一个上了年纪的、仪态端庄的人,突然无视身旁的行人,跨过水洼去追一个甲壳虫,一个人要做到这一点,必须有婴儿般的纯洁和不顾一切的品质。他说,人们把昆虫学家看成是傻瓜,这又是反而是一件好事,因为这样,昆虫学家们就可以毫无危险地闯入最富“掠夺性”的地点,反正人们会把他们当作无害的怪物加以嘲笑的。

 

深入与全面的矛盾

有这么一句古老的谚语:一个医生,如果他仅仅是一个好医生,那他就不可能是一个好医生。对科学家当然也可以这么说。一个科学家如果他仅仅是一个科学家。那他就不可能是一个大科学家。当想象力和灵感消失时,创造性的源泉也就枯竭了。创造性的源泉也要求兼及旁骛。否则科学家就只剩下追求事实了。

了解一个人——这就是要看到他的矛盾之处。

他常说:谁要是同现实妥协,谁就是对未来没有信心。

几条守则

除了时间统计法之外,他还有几条守则:

  • 我不承担必须完成的任务
  • 我不接受紧急的任务
  • 一累马上停止工作去休息
  • 睡得很多,十小时左右
  • 把累人的工作同愉快的工作结合在一起

他几乎从未抱怨过自己没有时间,我早就注意到,善于工作的人,时间总是够用的。不,最好还是用另一种说法:他们的时间要比别人多些。

 

时时考虑时效

他对时间就象对不可或缺的生活口粮那样重视。“消磨时间”——这是不可能在他头脑中产生的念头。任何时间对他来说都是宝贝。时间是进行创造的时间,认识事物的时间,享受生活乐趣的时间。他对时间满心崇敬。原来,一生完全不象通常人们所认为的那么短暂。这里问题不在寿命长短,也不在工作安排得满腾腾的。柳比歇夫的经验在于充分使用一天中的每一个小时,一小时中的每一分钟,时时考虑实效。一生的时间是极长的时间,在一生中可以把工作干个够,可以读大量的书籍,可以学会好几种语言,可以出门旅行,可以饱听音乐,可以教育子女,可以在乡下居住,也可以在城里居住,可以栽培花园,可以培养青年一代……
如果我们自己慢慢吞吞,那么生活就不等人。

我们好象只能使用经过精选的时间。我们记得的只是一生中最精彩的时刻。半个小时对我们来说不算时间。我们只承认整段整段的时间,只承认不受客观环境和偶然事件干扰的大段时间。只有在这样的时间里,我们才打算大显身手。短一点的时间,我们马上会借口外界干扰、借口客观条件而认为不适用。啊,不依我们意志为转移的客观条件,具有充分权力和理由的客观条件真是威力无比!把责任往它们身上互推,那是多么轻而易举啊……

我们没有注意到,这些借口是怎样在削弱和腐蚀我们的灵魂……

他不去为出版自己的著作而钻营,不到编辑部去奔走,他也不去讲情求告……
他舍不得把时间耗费在这些事上。
他避免必要的串门和喜庆活动。

 

写信的原则以及为何写信

“紧急的书信,我立即答复,其它的书信,则暂缓作复。在写重要著作时,除紧急者外,一切书信都搁置一段时间再作回答。
“我力求答复每一封信,因为我的书信来往,数量适度,从中我得到一种满足,还因为通信不但并不妨碍我的基本目标,相反,还在很大程度上有助于达到这些基本目标。”

写信是柳比歇夫实际能够给予人们的一种小小的帮助。由于有可能帮助人,他变得十分慷慨,他忘掉了时间,不惜一切,全力以赴。他的评语实际上是一篇非常详细的评论。他无私、无偿地做这些事。他分析错误,找出可疑之处,进行论争;他还做编辑的工作——改正错误、指出问题、提出建议。不太认识的人、完全不认识的人来向他求教,他也不拒绝。

 

争论

柳比歇夫利用每次机会去寻求真心诚意和摆事实讲道理的论争,他要求双方都能容忍不同的意见。他属于那么一种罕见的人,当人们同这种人争论时,感到很愉快。当他开始同强有力的对手争论时,他力求理解透彻对方正确的一面。

 

物质

时间统计法为他创造了高度理智和健康的生活。他的时间统计法,使他如此繁忙,以致他很容易忽视很多日常饮食起居方面的不利条件。它使他轻松地、宽宏大度地去忍受人们所做的一些蠢事以及公务中的例行公事和杂乱无章,而不去同人怄气。因此他心神安宁、神经健全。

他需要的东西极有限:有一个放书的地方和工作的地方,有一个宁静安详的工作环境就够了。当然,宁静安谧这一个要求不算低。在我们的时代,宁静安谧是奇货。不过柳比歇夫需要的宁静安谧是最简朴的一种——只要寂静和摆脱紧张任务就是了。

 

能力

他不是按照自己的能力去衡量任务,而是按照任务去衡量能力。他认为,有一种精神上的义务,要比保持心灵上的安全感好。

德漠克利特有句话:决定人的精神品质的,不是他的行为本身,而是他的意图。过去我不了解这个想法,也没有接受它。

柳比歇夫有很多事没有来得及做——没有搞出成果,但对我来说,主要的是他想做的事,他的意图:他这个人精神上的吸引力正是来自他的意图。

柳比歇夫通过他的时间统计法对自己进行了研究和试验:试验在写、读、听、工作、思索各方面,他到底能干多少?干多少?怎么干?他不让自己负担过重,力不胜任;他总是循着他能力的边缘前进,他对自己能力的掂量愈来愈精确。这是一条永不停顿的自我认识的道路。他为什么这样做?是为了自我修养?是为了最大限度的自我献身?还是为了大显身手?

如果每个人都能知道自己能干些什么,那生活会变得多么美好!因为每个人的能力都比他自己感觉到的大得多。他会变得比自己想象的更为勇敢;他会变得更坚韧、更有力,更能适应环境。

 

激情

他深信,“一种、然而是一种炽烈的激情”会排除和谐的发展。激情妨碍人全面发展——这倒是一个令人惬意的处世秘诀。最好没有激情,这样要保险得多。什么都要有一点。似乎一切为人称道的志趣的总和就构成了和谐。似乎真的存在着没有激情的和谐一致的人。

可能这对某些人很相宜,很符合愿望,但不知为什么作者经常想起我们一些伟大的作家、科学家、艺术家的范例——他们既是学识渊博的人,又是具有炽烈激情的人,有时甚至过了头。

然而他们的激情不是狂热,而是忘我的热情,是创造性精神不可或缺的热情。

柳比歇夫既全面发展,又具有他必不可少的、独一无二的激情。两者之间的不相协调并没有妨碍他——他放弃了青年时代立下的禁欲主义的誓言,这是有道理的。

 

对待时间的态度

大多数人对时间都持有自己的态度,各不相同,而柳比歇夫对时间的态度格外与众不同。他的时间不是取得成就的时间。他摆脱了赶过别人,夺取第一,超越什么,获得什么……的愿望。他热爱时间,珍惜时间,不是把它当作工具,而是把它看成是进行创造的条件。他对时间十分虔敬,同时又体贴入微,他认为时间对人们如何使用它并不是无所谓的。时间不是个物理概念,不是时针的转动,而好象是个道德概念。在他看来,浪费时间就好比夺走科学研究的时间,就好比滥用和抢走他服务对象的时间。他坚信,时间是最宝贵的财富,不能乱用到怄气上,不能乱用到竞争角逐或满足虚荣心上。在他看来,对待时间的态度是个道德问题。

一个人在什么地方有权使用自己一生的时间,在什么地方无权滥用。在这方面,柳比歇夫为自己订出了一些道德上的禁令,规定了使用时间的道德限度。能干的人和有计划的人使人感到他们是时间的主人。当作者随心所欲地支配自己的时间时,他体验到一种解放的幸福。这样的时间充满了光明和安宁。一天全部的时间都吸取着最重要和最本质的东西,如同绿叶的表层吸收阳光一般。

对宇宙时间或世界时间——作者不敢妄加判断;至于人类的时间,他深信人可以学会去感觉的,甚至能听到它潺潺的流逝声。时间弯过来,首尾相接,结成一个圆圈,过去的时间追过了现在的时间,如同在阿丽丝漫游的奇境中一样。在作者眼前,不断流过浪费了的、溜走了的时间,流过了白白荒废的、曾经充满了青春活力和希望的年华——这是空虚的、被吮干了的时间的残骸。

 

延伸阅读

道:

《幸福之路》
《少有人走的路》

术:

《把时间当作朋友》
《高效能人士的七个习惯》

器:

aTimeLogger官网

其他:

三个目标(时间统计法的应用)
我的GTD方法论2.0
aTimeLogger2 使用心得

 

Python入门书评价与总结

从开始学习Python以来,读了几本入门书,在这里做一些总结,给需要的人做个参考。

几个个人观点

视频/书?

一开始看了UdacityPython入门课程,虽然也了解了一些基本概念,但最终还是没有什么具体的收获(但认识到了Python的神奇……)。因为视频不会仔细的讲语法,也没有具体的指导。视频更偏向于实现项目,而不是语言的细节。所以,一开始建议还是从书开始。

 

电子书/纸质书?

iPad上看了《ThinkPython》前十章,最后却把书打印出来重看了一遍。电子书虽然有好处,便携啦,方便查词啦,但弊端太大。比如摘录不方便查看,做笔记也不方便。所以,一开始建议从纸质书开始。

 

译本/原版?

一开始可以暂时阅读译本,了解的差不多后就该看原版书了。一来译本的质量常常很差,二来平时查google都是英文内容,一些关键的词汇中英文混淆会导致概念理解不清。所以,一开始建议从译本开始,但要尽早脱离译本。

 

评价与总结

(按阅读顺序排列)

A Byte of Python》(《Python简明教程》)

评价:概念初认识

网站:http://python.swaroopch.com/

第一本Python书(中文译本),写的很简单,没有过多涉及细节。也许是因为这是接触Python的第一本书,所以读起来不是很顺畅。很多东西看得云里雾里。

 

Learn Python the Hard Way》(《“笨”方法学Python》)

评价:入门的练习册

网站:http://learnpythonthehardway.org/book/

看这本书时,已经看完了《Python简明教程》,但对Python还是没有什么具体的了解。这本书是在网站上读的。对于新手来说还不错,它借由大量的誊写代码而实现对Python语法的记忆和掌握,作者给的一些建议也都很中肯。虽然最后几课的作业我没有完成,但是命令行游戏倒是完成了,收获了不少乐趣。

 

Core Python Programming》(《Python核心编程》)

评价:大而全的参考书和习题集

网站:http://corepython.com/cpp2e (不提供在线阅读)

我做的习题答案:https://github.com/lihuii/CorePythonProgrammingExercise-

亚马逊买的第二版中文译本。书中错误比较多,大部分不影响阅读,少数几个课后题目让人无法理解。开始看这本书,才有了一些豁然开朗的感觉。也许是因为看了前两本书的缘故,书里的内容大部分都可以看懂。而且一些之前的困惑的都在这里找到了答案,比如说sort方法不返回整理后的列表,“if __name__ == ‘__main__:’”的意思等等。这本书目前还没有看完,一边做题一边看,目前看到了第十三章。

 

Think python

评价:进阶必备的思考书

网站:http://greenteapress.com/wp/think-python/

这本书是和《Python核心编程》一起看的,当时坐在回家的车上,半天就看完了前几章。英文原版读起来很顺畅,作者有时很幽默,有时也会有思考。本书的副标题是“How to think like a computer scientist”,书中普及了很多通用的编程思想,而且每一章节后面都有debugger和术语解释。很多容易被忽略的或是关键的细节作者都会提到,要是早些看这本书,我会省下不少力气。

待读:

Dive into Python
invent with python

 

推荐阅读顺序

  1. Learn Python the Hard Way(肌肉记忆)
  2. Think Python(思考课)
  3. Core Python Programming(思考+实践+延伸)

 

另外,编辑器推荐使用PyCharm,超好用!

pycharm

pycharm

CSShake——元素摇晃特效

效果演示

所谓的摇晃特效,就是当你把光标移到文字上的时候……我可以轻微的晃慢慢的晃猛烈晃疯狂晃,甚至左右晃上下晃旋转着闪烁着 ……

摇晃的驴子

光标移到驴子身上就可以摇晃它

 

前段时间在家没事做,突然想到之前看到的CSS特效,觉得文字摇晃很好玩。google了一下,原来是一个开源的css包。心血来潮,便想做个网页试一下。

下面是css shake的用法介绍,整理翻译自github页面的介绍:
首先在html里声明包含css文件,最简单的方法是通过CDN加载(你也可以将https://csshake.surge.sh/csshake.min.css下载到本地然后加载):

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/csshake/1.5.3/csshake.min.css" />

然后通过添加class来使用不同的效果:

<div class="shake">Foo</div> 
<div class="shake shake-hard">Bar</div> 
<div class="shake shake-slow">Baz</div> 
<div class="shake shake-little">Qux</div> 
<div class="shake shake-horizontal">Egg</div> 
<div class="shake shake-vertical">Ham</div> 
<div class="shake shake-rotate">Snake</div> 
<div class="shake shake-opacity">Apple</div> 
<div class="shake shake-crazy">Orange</div>

还可以通过增加class来控制动画的状态(比如一直摇晃,还是光标放上去摇晃)

<!-- Freeze the animation at that point when :hover --> 
<div class="shake shake-freeze">Hello</div> 
<!-- Continuous animation instead on :hover --> 
<div class="shake shake-constant">Hola</div> 
<!-- and stop when :hover --> 
<div class="shake shake-constant shake-constant-hover">Halo</div>

另外,还可以自定义摇晃类型,具体的用法请参考https://elrumordelaluz.github.io/csshake/