网页编辑工具Expression Web简介

一、背景

需求一：有如下图一所示的网页素材，将其中红色方框内的”Clean Blog”修改为”GCDDalian Workshop”。

此时，如果有一个所见即所得的网页编辑器，兼具编码及浏览的功能，那是最好不过的。十年前，答案可能是Dreamwaver；现在，微软提供的免费软件Expression Web则是最佳选择之一。该软件可支持多种界面语言，包括中文。

图一 网页素材

二、使用方式

用Expression Web打开上图网页文件index.html，界面如下

图二 Expression Web及其Split模式

如图二左下角红色方框的标签所示，该软件有三种模式：Design、Split和Code。Design是直观的网页设计模式，不涉及对代码的直接修改；Code则只显示网页代码，而不能直接看到网页效果；Split模式可同时显示代码和网页实际效果。点击标签可在三种模式间进行切换。

现在要实现如前所述的修改网页上的"Clean Blog"为"GCD Dalian Workshop"，方法：

找到网页上的"Clean Blog"，直接修改为”GCD Dalian Workshop”，这种修改方式当然比在代码里找到”Clean Blog”然后再进行修改要快。这是Expression Web的好处之一。

需求二：作为初学者，我想学习网页上某种元素的实现方式。比如，怎样往网页里添加图片呢？同样以图二为例，要了解其中的图片插入代码，点击网页上的图片后，可以在代码去看到其对应的代码：

通过已有的网页，学习其实现方式，这是Expression Web的好处之二。

作为软件巨头微软的产品，Expression Web当然不只以上两个特点，就请大家在日常使用中多多探索吧。