由于IP地址在使用的过程中难于记忆和书写，人们又开发了一种与IP地址对应的字符来表示地址，这就是域名。

   各版块之间以空白区分隔。同时，为使各版块区 分明显，还可为其设置不一样的背景色或加上边框。

  19寸电脑显示器常用的屏幕分辨率为1280像素×1024像素；17寸电脑显示器常用的屏幕分辨率为1024像素 ×768像素；平板电脑显示屏常用的屏幕分辨率为768像素×1024像素；智能手机屏常用的屏幕分辨率最低为 480像素×800像素，最高能够达到1920像素×1080像素。此处的数字表示显示器横向和纵向的像素（Pixel） 数，如屏幕分辨率1024像素×768像素表示将显示器横向分成1024格、纵向分成768格以后，在各个格内分 别赋予颜色从而形成图像。

  Flash是由Adobe公司推出的交互式矢量图和Web动画制作软件，用于设计和编辑Flash文档。近年来，由 于能耗和安全问题，Flash插件已经被很多浏览器所放弃和屏蔽，所以不得不逐渐退出网页制作领域。

  网站建设流程从整体上来说可以分成3大部分，分别是网站设计、网站制作和后期维护，如下图 所示。在这3部分中，本书着重介绍的是网站制作部分，强调3个要点的讲解：设置站点、搭建 网页整体的结构层、搭建网页样式层。

  网页中的 元素按功 能可分为 站标、导 航条、广 告条、标 题栏和按 钮等。

  一般情况下，网页中除了包含网页文件（扩展名为.html、.asp等）外，还有图像文件（扩展名 为.jpg、.gif等）、脚本文件（扩展名为.js）、样式文件（扩展名为.css）以及视频文件（扩展名 为.avi、.flv等）等。

  Adobe Photoshop，简称“PS”，是由Adobe Systems开发和发行的图像处理软件。Photoshop主要用 于处理以像素构成的位图图像。在网页制作中，使用Photoshop能够实现效果图制作和图像素材处理工作。 Photoshop存储的图像文件格式有JPEG，GIF，PNG和TIF等，而在网页中使用的图像文件格式通常为JPEG， GIF和PNG。

  要根据网页和浏览者的特性，以合适的屏幕分 辨率为基准来设置网页尺寸，以使浏览者更加 便利地浏览网页。如游戏爱好者大部分都使用 高配置系统，所以游戏网站的网页尺寸大都在 1024像素×768像素以上，如下图所示。

  对于网页尺寸，是没有硬性规定的。目前常见的网页宽 度有1000像素、1190像素和1200像素3种，例如新浪 是1000像素、淘宝和京东是1190像素，当当是1200像 素。若需要兼容不同浏览器尺寸，现在比较流行的做 法是做成响应式的，即根据不同分辨率显示不同的尺寸， 不过这样工作量要大很多。网页高度可根据网页内容来 定，一般别超过3屏。

  网页就是我们上网时在浏览器中打开的一 个个画面。网站则是一组相关网页的集合。 一个小型网站可能只包含几个网页，而一 个大型网站则可能包含成千上万个网页， 如新浪网就包括新闻、财经、科技、体育、 娱乐等多个板块，而每个板块又包括很多 网页。

   HTTP：超文本传送协议，它负责规定浏览器与服务器怎样互相交流。  浏览器：是务的客户端浏览程序。使用它可以向万维网服务器发送各种请求，并对从服务器发 来的超文本信息进行解释和显示。

  HTML是HyperText Markup Language（超文本标记语言）的英文缩写，是用于设计网页的主 要语言。用HTML编写的超文本文档称为HTML文档，扩展名为“.html”，也就是网页。 CSS（Cascading Style Sheets）中文名为“层叠样式表”，用于设置网页中各标签的样式。 “样式”是指网页中各元素的样式，比如文本的大小、颜色以及图像的边框、位置等。“层叠” 是指当在HTML文件中引用多个样式文件时，浏览器将依据层叠顺序处理，以避免发生冲突。

  了解网页设计与制作岗位工作职责——网页设计基础 企业网站建设基本流程——网站建设基础

  本案例中，将粗略地介绍网页和网站的基本 概念、网页的构成元素及网页的本质。

  在浏览三器、中网单击页右的上本角质的“工具”按钮 ，在弹出的菜单中选择“文件”“另存为”菜单，打开

  “保存网页”对话框，在“保存类型”下拉列表中选择“网页，全部（*.htm;*.html）”，将网 页保存到磁盘中，便可看到网页的组成文件，如下图所示。

  设计页面：网页设计师与客户沟通， 了解客户的基础要求后，制定网站 建设方案并使用Photoshop等图像 处理软件进行页面效果图设计。页 面效果图最重要的包含网站首页效果图 和各频道首页效果图，右图是“中 国忆达集团”网站的首页效果图。 将效果图设计好后交给客户查看， 客户查看后提出修改意见，设计人 员按照每个客户意见做修改，最终确 定网页页面效果图。

  在网页制作中，HTML属于网页的结构层部分，用来确定网页的内容和结构；CSS属于网页的表 现层部分，用于设置网页的样式，最重要的包含各种标签的外观、大小和位置等。

  网页是由HTML代码组成的。从广义上来说，制作网页文件有两 种方法：一是使用记事本直接输入HTML代码；二是使用可视化 编辑软件进行可视化制作。

  本案例首先介绍网页设计中网页颜色的选择与搭配、 网页版式及网页尺寸的设计。最后通过案例实施，简 单了解网页设计与制作的岗位工作职责，以使初学者有更 明确的学习方向和目的。

  常见的可视化编辑软件有 Dreamweaver，Frontpage等，目 前使用Dreamweaver的居多。 Dreamweaver是由美国Adobe公司 推出的一款专业的网页编辑软件，它 集网页制作和网站管理于一体，并提 供网页的可视化编辑和HTML代码编 辑两种操作界面。

  效果图切片：在效果图得到客户认可后，设计师可使用Photoshop等图像处理软件中的 切片工具将效果图切割并保存为JPEG、GIF或PNG格式的小图像，将它们作为制作网页的 图像素材。

  设置站点：从这一步骤开始步入到 网页制作阶段。首先在本地磁盘创 建网站根文件夹及子文件夹，并将 制作网页需要的素材资源分类放置 在各文件夹中，之后在网页制作软 件Dreamweaver中定义站点。右图 是“中国忆达集团”网站的本地文 件目录及在Dreamweaver中的站点 结构。

  步骤 05 制作网页：网页的制作可大致分为结构层制作和样式、行为层制作两部分。 结构层制作就是使用HTML代码搭建网页的整体的结构，如文字、图像、超链接等，可以直 接编写代码来实现，也可以在Dreamweaver的可视化界面中操作。在结构层制作好后， 就能够正常的使用CSS（层叠样式表）及JavaScript（动态脚本语言）来制作网页的样式层及 行为层，完成网页的布局和外观设置。

  确定主题：可大致分为分析策划和资料收集两个部分。制作网站前，第一步是要分析网站的 功能及建站的目的，确定网站的用户群和网站内容，即确定网站的主题。在确定主题后， 可绘制出网站架构图，并搜集建站所需的有关的资料和素材，下图是“中国忆达集团”网 站的架构图，包括8个频道（栏目）。另外，可要求客户提供与公司相关的文字及图像 等资料，如公司介绍、产品图像等。

  （1）网页背景颜色最优选择白色或黑色（大部分网页均选择 白色），这样颜色搭配最灵活。

  （2）可根据网站性质确定网站主色调，并且该主色调应贯穿 于网站中的全部网页。

  （3）设计网页时恰当利用同类色、邻近色和对比色，可增强 网页的层次感、丰富网页的色彩或突出某些重要内容（如导 航条或版块标题）。

  对于网页设计与制作初学者来说，提前了解一下网页设计与制作岗位的职责，可以在今后的学

  习中有更加明确的方向和目的。登录智联招聘、中华英才网等招聘类网站，搜索职位“网页设

  单击要查看的职位，可以打 开该职位的详情信息页，查 看职位描述和公司介绍等信 息。

  Internet的全称是Internetwork，中文称为因特网，是集现代计算机技术和通信技术于一体，基于TCP/IP协 议将全世界不同国家、不一样的地区、不同部门和不一样的计算机、国家骨干网、广域网、局域网利用互联网互 联设备连接而成的、全球最大的开放式计算机网络。

  在学习制作网页之前，首先了解一下与网站建设相关的基 础知识，并从整体上认识一下其制作流程，对后面的学习 将是非常有利的。本案例主要介绍与网站建设紧密关联的 基础知识及网站建设基本流程。

  设计网页前应事先规划好站标、导航条、广告条和各 版块位置。此外，一些基本的元素要贯穿整个网站中 的各个页面，如网页上部的站标、导航条和网页底部 的网站信息区。

   最好为导航条和各版块标题区设计一组形状别致、 颜色突出的背景图像，以方便网页浏览者快速找到自 己需要的内容，并使网页看起来更精美别致。

   WWW：World Wide Web的缩写，中文称为“万维网”，也可简称为Web，它是网络上的一个资 料空间，在该空间中，任何资源都由“统一资源标识符”（URL）标识，并利用超文本传输协议 （Hypertext Transfer Protocol，HTTP）传送给使用者。  URL：统一资源标识符，也称为网址，是世界通用的负责给万维网上的资源（如网页）定位的系统。一 个完整的URL由通信协议名称、域名或IP地址、资源在服务器中的路径和文件名4部分所组成，如下图所示。

  步骤 01 启动IE浏览器，在“地址栏”中输入“当当”网址“”，然 后按回车键在浏览器中打开“当当”网站首页。 导航条