编写排版工具的基础

排版工具，首先需要做什么？第一步，确认你需要的标签，以html为基础。第二步，确认每一个标签需要的变化。第三步，筛选出最基础的排版元素。第四步，搜索现成的，不会因为标准改变而变迁的类库或者插件。第五步，确定编程的工具和插件工具。第六步，画一张基本版的蓝图。排版工具，首先需要做什么？第一步，确认你需要的标签，以html为基础。

基础的排版工作，一般是分三大件：

文本

图片或视频等可视固态对象

框架或者框架嵌套

其中文本类常见的定义标签有（注意，排版里面，一般是不会用input元素的，因为input实现的统一性太差）：

span

font

p（段落）

pre（格式化）

注释

这里要注意的是超链接元素在html里是单独存在的，但很多时候，你也可以用转义的方式定义，这样就避免了很多书写工作。

另外还有一些是排版性质的标签，如列表，引用等，和单修饰的标签，如加粗、斜体等。

这里要注意的是，好像没有竖排文本的控件。这是因为简体字改成横版后的影响。其实从定义标准实现的技术很简单（比后期开发排版容易的多）。其实这也是一种讽刺，自认中国正统的地区，是唯一排挤古代竖排文字的地区。

固态对象的标签最常用的就是Image。在普通排版工作里基本就只需要图片。而网页上还有视频，canvas等。

框架主要用来定位版块的，当然顺带也可以做背景或者边线修饰。常用的有

div

table

其他

第二步，确认每一个标签需要的变化。

首先说框架的变化。框架主要有内外留白，边线，或者边线的角等元素的变化。因为边线框显示与否经常会变，所以内外留白应该提前设置好，免得届时尴尬。比传统的排版方式，还要多处一个，按照比例分配现有的共有留白宽度。其实比例是排版之中最长考虑的元素。但是软件实现起来却经常差强人意，反而像素的定位精确的很多。这是因为计算机里没有真正的小数，只有模拟小数。虽然很多程序员在学习的时候，都是按照计算机是能够计算小数来认识的。但在排版的时候，不停的修改，小数的精度会慢慢丢失殆尽。所以聪明的排版程序里，经常会保留最初的设定值，否则改过几回后，你不得不手动修改。渐渐的，你也不会确定哪个数值更符合你的要求。

而块级的文字标签的规范经常大同小异，可能不同软件支持的细节特性上会有点差别。但是在表现大部分文字的时候，并不需要考虑那么多。文字常见的可变元素是字体（大小、颜色、着重与否、风格等）。

第三步，筛选出最基础的排版元素。

上面我已经列出了比较重要的元素。你也可以根据情况进行添加修改。比如table现在使用的场合比较少，大部分情况下是使用div配合css代替的。但论起可读性，table还是很好的，尤其是在定位上，比较容易找到table里每一个单元格的内容。只不过在排版的时候，table的优势不明显。据说它在网页上的呈现有点差强人意。其实table的下载体验比较慢，应该属于过去式了。过去的网速慢客户端机器渲染也不快，table就有一点迟滞现象。但今时今日，table的速度已经不是理由。它的特点是书写呆板，很多没有严谨习惯的人不爱使用。其实table有很多优势div不能替代。但是话又说回来，在排版的时候，table的最大局限性也是布局有点呆板，拿来设计页面，有时候工作量比div大很多。比较聪明的办法是，使用table结合js来呈现效果，可以减少很多书写工作量，并且减少错误发生的可能性。

可互相替代的标签里，到底使用哪一个，取决于个人的熟练程度。

第四步，搜索现成的，不会因为标准改变而变迁的类库或者插件。

这几年除了各大主流类库或者插件在更新，也有很多小众的替代品出现。但是所有的类库或者插件，经常都会存在两个毛病：

互相依赖度高，且有时候互相有所影响。

功能细化程度不过，太杂不够专业。

第五步，确定编程的工具和插件工具。

使用什么语言，什么平台，什么ide编程，什么插件，都是从个人的习惯和产品的目标出发。尽量选类库插件来源好，自己也很熟练的语言来开发，这样工作量维护量都很小。

第六步，画一张基本版的蓝图。

做任何事情，都要先做好计划，确保不会在工作中不停修改，慢慢的忘了初衷甚至弄乱了架构。写软件尤其需要，先打下一个比较确定的基本框架，在这个基础上考虑动工。先做基本版的目的，是为了让产品的功能性减少交叉和互相覆盖或者依赖，让产品更方便维护和拥有更好的体验。当基本版完成后，不妨测试一段时间，才考虑谨慎的开发扩展功能。如果盲目的对产品不停的增加功能，会让客户面对这些多功能无所适从，慢慢变得使用困难，而不得不放弃。