【网站制作教程_二：网站制作技术】页面结构|布局|设计

网站制作教程（二）网站制作技术

网站制作通俗的来说就是网站通过页面结构定位，合理布局，图片文字处理，程序设计，数据库设计等一系列工作的总和，也是将网站设计师的图片用HTML方式展示出来，属于前端工程师的一项任务，前端工程师任务包括：网站设计、网站用户体验、网站JAVA效果、网站制作等工作。网站制作是应用各种网络程序开发技术和网页设计技术，为企事业单位、公司或个人在互联网上建设站点，并提供域名注册和主机托管等服务的总称。

1、网站搭建原理

一、虚拟空间。虚拟空间是用来存放网站文件的。网站文件包括图片信息，html文件，php文件等。虚拟空间相当于一个存在于网络上的硬盘空间，这个空间可以被互联网用户以网址或IP地址的形式访问。
二、域名解析。域名可以理解为网站的地址，可以将多个域名对应一个主机IP地址。但通常还是一个IP对应一个域名。
三、数据库支持。传统的静态网站无需数据库支持。数据库这是用来存放网站数据的空间，这里的数据并非指网站的html文件、图像信息等，而是指网站访客提交的留言，个人信息等数据。

2、前端开发语言

Web前端开发技术包括三个要素：HTML、CSS和JavaScript。但随着RIA的流行和普及，Flash/Flex、Silverlight、XML和服务器端语言也是前端开发工程师所应该掌握的。随着时代的发展，前端开发技术的三要素演变为今天的：html5，css3，jquery。Web前端开发工程师既要与上游的交互设计师、视觉设计师和产品经理沟通，又要与下游的服务器端工程师沟通，需要掌握的技能非常多。这就从知识的广度上对Web前端开发工程师提出了要求。如果要精于前端开发这一行，也许要先精十行。
HTML（Hyper Text Markup Language），中文名称为，超文本标记语言，用于网站内容的描述。目前最新的HTML技术是HTML5，HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准的 HTML 标准版本，现今仍处于发展阶段，但大部分浏览器已经支持某些 HTML5 技术。
CSS（Cascading style sheets），层叠样式表，用于表示网站外观、样式的呈现。每个网站都有着相当规范的布局排版，美观得体，div+css的布局技术，相较于table布局、xml的布局更加简单灵活、代码更加简洁。
Javascript，则是一种可以使得网站更加生动活泼的程序语言，用于实现网站的交互行为。
HTML、CSS、JavaScript这三种前端开发语言的特点是不同的，对代码质量的要求也不同，但它们之间又有着千丝万缕的联系。HTML应用于结构层面，CSS应用于表现层面，JavaScript用于行为层面。还有诸如PHP等脚本语言，能使网站呈现出丰富的动态效果。

3、美工技术

简单说来就是photoshop技术，一个优秀的网站不必可少的就是动人的UI，如网站的banner设计、logo图片、图标设计等都离不开优秀的美工。掌握好对photoshop的使用，能为网站增加许多动人的效果。

4、SEO优化

制作网站的目的不仅仅是为了展示自己，更直接的目的是为了获得良好的搜索引擎排名，这样才能被更多的互联网用户看到，将网站推广出去。SEO优化包括网站结构的优化、代码优化、关键词布局等。

5、编辑能力

内容是网站的第一生产力，要求会写文章的简单编辑能力比不可少，但如果想让网站更有吸引力，则需要优秀的文字功底。的，标准可以涉及到正确的页面布局的可读性，以及确保适当地关闭了编码元素。

6、总结

前端开发的入门门槛其实非常低，与服务器端语言先慢后快的学习曲线相比，前端开发的学习曲线是先快后慢。所以，对于从事IT工作的人来说，前端开发是个不错的切入点。也正因为如此，前端开发领域有很多自学成“才”的同行，但大多数人都停留在会用的阶段，因为后面的学习曲线越来越陡峭，每前进一步都很难。另一方面，正如前面所说，前端开发是个非常新的职业，对一些规范和最佳实践的研究都处于探索阶段。总有新的灵感和技术不时闪现出来，例如CSS sprite、负边距布局、栅格布局等；各种JavaScript框架层出不穷，为整个前端开发领域注入了巨大的活力；浏览器大战也越来越白热化，跨浏览器兼容方案依然是五花八门。为了满足“高可维护性”的需要，需要更深入、更系统地去掌握前端知识，这样才可能创建一个好的前端架构，保证代码的质量。

一位好的Web前端开发工程师在知识体系上既要有广度，又要有深度，所以很多大公司即使出高薪也很难招聘到理想的前端开发工程师。现在说的重点不在于讲解技术，而是更侧重于对技巧的讲解。技术非黑即白，只有对和错，而技巧则见仁见智。以前会Photoshop和Dreamweaver就可以制作网页，现在只掌握这些已经远远不够了。无论是开发难度上，还是开发方式上，现在的网页制作都更接近传统的网站后台开发，所以现在不再叫网页制作，而是叫Web前端开发。Web前端开发在产品开发环节中的作用变得越来越重要，而且需要专业的前端工程师才能做好，这方面的专业人才近两年来备受青睐。Web前端开发是一项很特殊的工作，涵盖的知识面非常广，既有具体的技术，又有抽象的理念。简单地说，它的主要职能就是把网站的界面更好地呈现给用户。

如何才能将前端开发工作做得更好？
第一，必须掌握基本的Web前端开发技术，其中包括：CSS、HTML、DOM、BOM、Ajax、JavaScript等，在掌握这些技术的同时，还要清楚地了解它们在不同浏览器上的兼容情况、渲染原理和存在的Bug。
第二，在一名合格的前端工程师的知识结构中，网站性能优化、SEO和服务器端的基础知识也是必须掌握的。
第三，必须学会运用各种工具进行辅助开发。
第四，除了要掌握技术层面的知识，还要掌握理论层面的知识，包括代码的可维护性、组件的易用性、分层语义模板和浏览器分级支持，等等。

可见，看似简单的网页制作，如果要做得更好、更专业，真的是不简单。这就是前端开发的特点，也是让很多人困惑的原因。如此繁杂的知识体系让新手学习起来无从下手，对于老手来说，也时常不知道下一步该学什么。代码质量是前端开发中应该重点考虑的问题之一。实现一个网站界面可能会有无数种方案，但有些方案的维护成本会比较高，有些方案会存在性能问题，而有些方案则更易于维护，而且性能也比较好。这里的关键影响因素就是代码质量。CSS、HTML、JavaScript这三种前端开发语言的特点是不同的，对代码质量的要求也不同，但它们之间又有着千丝万缕的联系。

网站制作