编辑导语：产品经理在日常工作中涉及的业务很多，除了对整个项目进行把控之外，对于技术的一些了解和把握也需要更深一步，才能在工作中更加游刃有余；本文作者介绍了产品经理的一些技术产生常识，我们一起来看一下。
近期因为业务需要在做类似自助建站的工具，在做这一工具的过程中加深了前后端开发知识的了解；本文将从做这个工具的全过程出发讲对自助建站的一些理解，涉及到一些前后端开发知识，适合初级阅读。
我们对自助建站典型的应用场景应该并不陌生，电商大促的时候，在各大电商app能看到很多H5活动页面，这么多H5活动页面，每天都在变，都是技术人员开发实现的吗？有些朋友想创建个人网站无奈不懂代码，通过wix、凡科、起飞页等工具，不需要写一行代码就可以创建一个漂亮的网站，这是怎么做到的呢？
Q1：电商的H5活动页面，都是技术人员开发实现的吗？电商大促要上很多活动，全都由技术人员开发并不现实，很多页面是由产品、运营等技术小白用自助建站工具搭建而成的。
自助建立网页的工具适用于以下几种情形：
项目时间紧张，上线时间短；页面相似度高，功能相近；研发性价比低；不懂专业开发技术；适用人群是产品/运营等技术小白，核心需求是快速搭建承载业务功能的页面，适用场景是工作中遇到项目时间紧迫需要快速上线的情况，如电商大促活动时间紧凑；或者无网站制作经验，希望简单套用模板；不懂代码的人员也可以通过简单的操作配置页面，实现页面快速上线。
Q2：不写一行代码创建一个漂亮的网站是怎么做到的呢？在此之前，我们先来了解web的基础技术知识。
一、技术知识点1：建设网站的流程和必需品
传统建设网站的流程如下：
网站建设需要至少三样东西：域名、服务器和程序。
1）域名：在数据传输时对计算机的定位标识，不用去记住能够被机器直接读取的IP地址数串。域名具有唯一性，让别人找到网站；就像名字是我们身份识别的一种方式，帮助区分不同的人，域名就是网站的名字。
不同之处在于，世间同名同姓的人很多，但域名与IP地址是一一对应的，具有唯一性。
域名备案：比如我们需要到公安机关办理身份证，网站域名也需要进行备案，方便网络安全管理。
2）服务器/虚拟主机：用户需要在网页上请求数据（get），或者向网页传输数据（post），需要一个数据存储的地方，服务器能处理复杂的业务逻辑并对数据进行存储管理。
3）网站程序：用户可以使用云凤蝶、wix等第三方模板工具建立网站程序。
自助建站工具把域名和服务器的步骤都节省了，用户不用自己买服务器，在网站程序这一步中提供了各种设计好的模板。
二、技术知识点2：网页是如何构成的
用户对自助建站感知最强的地方是网站程序这一步，无需手写代码，通过拖拉拽的方式搭建一个网页，所见即所得。这又是怎么做到的呢？我们先了解传统网页是如何构成的。
HTML，CSS，JavaScript共同构成了我们看到的所有网页展示和交互；HTML是超文本标记语言，CSS是级联样式表，JavaScript是脚本语言，用于前端页面的DOM处理。
我们用chrome开发者工具（F12或ctrl+shift+i）可以看到这三者是如何作用的。
HTML：定义页面内容和结构，HTML格式文件存储在服务器上，当客户端向服务器请求页面资源时，就会解析呈现出用户看到的页面。
点击Elements就会看到HTML文件，查看并修改元素的代码（editasHTML）时，可以直观感受到HTML是如何定义页面内容和结构的；比如通过左图定位到了同花顺