网站技术开发的三个原则：

　　当我们力求做好一个优质网站时，自然需要将网站建设的每一个环节都做到最好，甚至要在上一个环节之下实现更深层次的提升，在技术环节上同样如此。

　　基于网站建设的三大思维(产品、数据、增长)，我们提炼出了足以指导我们

　　进行技术开发的三个原则：

1. 　　100% 还原度
2. 　　用户体验舒适
3. 　　实用且便捷

　　1.1 力求 100% 还原度

　　很多企业在技术开发时会遇到一个非常常见的问题：为什么设计稿和网站成品差距甚远。最终前端所呈现出来的网站，才是真正的一个“产品”，因此，还原度尤为重要。这是技术开发重要的第一步!

　　除去过于浮夸导致技术无法实现的需求外，技术最为基础的原则就是竭尽全力100% 还原所有需求，例如基础的字体、颜色、页面排版，尺寸大小等等。

　　如果无法实现最基础的还原，那就更不用追求流畅度、用户体验等其他非本质需求的东西了。

　　1.2 用户体验舒适

　　用户体验是个老生常谈的话题了，从网站建设三大思维中的产品思维来讲，以用户为本是核心， 因此，在网站开发阶段，对于每一个交互，每一个点击、切换、刷新，每一个动作，都需要尽可能更加贴合用户思维和行为习惯，确保良好的用户感受，追求舒适的体验。

　　这方面是初级技术人员会忽视的，“跑起来就行了”这是错误的想法。网站不仅为我们的访客群体所设计，还需要为内部人员考虑，比如网站运营人员上传内容、更新内容，也同样是用户。

　　1.3 安全稳定

　　我们在上网的过程中，经常会不小心就进到一些赌博、色情网站，明明我们点击的不是这种网站，其实这是因为很多企业网站没有做安全防护，黑客攻击篡改页面挂载了病毒，导致网站被非法劫持。

　　为了确保网站能够正常使用，我们在技术开发时，需要对网站进行加密处理，安装安全防护软件等，在上线前进行安全检测，修复存在的网站漏洞。在质检时，需确保所有安全防护质检项目都能通过。

　　以这三个点为原则，即可正式开始网站的技术开发，基本的流程为：前端开发(可视化)> 后端开发(数据联动)> 测试(BUG 修复优化)。

　　测试方面这里不过多讲解，基本是以内部人员进行使用测试，记录网站存在的 BUG 或者不合理的地方，之后再进行优化即可，核心还是在前后端开发上，也是技术开发最为基础的两部分。

　　前端

　　2.1HTML+CSS+JS

　　前端工程师要根据网页设计师交来的设计稿，实现页面重构和页面逻辑跳转，优化网站浏览体验，以及网站界面交互动效与功能的制作。

　　从广义上来说，所有用户终端的产品与视觉交互有关的部分，都是前端工程师的专业领域。简单来说，前端开发就是将前端界面呈现给访客的过程，目前常规的网站前端技术配置是 HTML+CSS+JS 代码的组合。

　　简单来讲，这三种代码主要以三种不同形式进行表达，负责不同的功能，从而实现网站前端的展示和使用。

　　HTML- 结构：html(超文本语言)作为一种标记语言，主要作用是表述网站页面的信息和信息之间的关系，使网站形成一个整体，目前主流的版本为HTML5。

　　CSS- 表现：CSS(层叠样式表)是一种用来表现 HTML 或者 XML 等文件样式的语言 , 也就是网站的信息呈现出来的外观形式主要都是由 CSS 来实现。

　　JS- 行为：JS(JavaScript)是一种解释型的脚本语言，主要作用在于为 HTML 页面提供交互行为的实现，这也让目前的网站开发更加多样化，可玩性更高。

　　代码是技术的基础,作为网站建设的负责人起码需要了解其中的基础逻辑，只有了解这些才能理解前端工程师的工作，以便更好地配合他们。

　　2.2 自适应与响应式

　　(1)自适应与响应式区别

　　自适应和响应式在网站建设领域应该是一个老生常谈的话题 , 经常会混淆，因为本身在命名上就较为模糊,很多情况下只有追溯本质技术才能分得清。我们可以把响应式网站看作是流动的，而自适应网站则是固定分割。

　　以用户体验来讲：

　　自适应：需要开发多套界面，对不同分辨率屏幕进行判断，进而分配不同页面进行适配。

　　响应式：只需开发一套界面，对不同分辨率进行代码处理(缩放)，实现不同布局和内容适配。

　　基于用户体验，如果你选择自适应开发，技术人员需要起码开发三套界面，分别为电脑端、手机端、平板端，根据预先设置的判断标准范围进行适配。自适应网站在同一分辨率范围下的变化，更多是以宽度缩放为主，像大多数的平台网站、商城网站都使用自适应技术进行开发。

　　如果你选择响应式开发，技术人员只需开发一套界面，在代码中嵌入一些布局的判断，通过检测不同分辨率，代码自动进行处理，实现布局变化、尺寸缩放等，适配每一个分辨率下的屏幕。响应式网站根据不同分辨率的变化不只是简单的宽度放缩，更像是流动的网格，在布局上也会进行变化调整，拥有液态网格和液态图片技术。

　　(2)自适应与响应式怎么选?

　　目前主流的企业网站都是响应式，不管是开发还是运维，响应式更加简单、快捷，并且具备良好的用户体验。如果追求极致用户体验的话，自适应是更优的选择，但是后续需要进行修改的话，基本是每套界面都需要进行调整，时间成本和繁琐程度都较高。

　　如果在移动端以及电脑端进行网站推广，建议双端分离。电脑端以响应式为主，移动端再单独开发一套界面，可以是自适应也可以是响应式，都是以创造良好的用户体验为目的。其实本质就是双端分离，提升适配度，确保更为优质的用户体验，从而提高我们的广告转化率。

　　以下是目前市面主流的分辨率、浏览器，需要进行兼容性重点检查：

　　分辨率：2560×1600、2560x1440、2048x1152、1920×1200、1920×1080、1680×1050、1600x900、1536x864、1440×900、1440×960、1366×768、1280×800、1280×720、1024×576、 800x600、414x896、393x873、375x812、360x800、360x780......

　　浏览器：Chrome、Safari、Firefox、Microsoft Edge、搜狗、360、猎豹、百度、QQ、Opera、UC、遨游、IE......

　　后端

　　3.1 语言 + 环境 + 数据库

　　前面说到，前端开发是用代码将网站页面呈出来，属于无法进行数据调用调配等交互的“静态页面”，因此，后端开发就是让网站的服务器、数据库、系统程序实现交互，最直观的体现就是网站后台管理系统。

　　比如，商城常用的会员系统，需要通过注册、表单填写等获取信息，收入数据库之后为登录调配数据，实现数据动态交互，运营人员可以从后台进行查看会员信息：又比如我们通过企业网站后台上传资讯文章等，都是由后端来完成。

　　常规的后端技术包括「开发语言」、「部署环境」、「建立数据库」。

　　目前主流的开发语言有 java、php、python 等，常规的网站后端使用 php会更加高效快捷，安全系数较高的是 java，一般银行、政府、大型平台和办公系统用的都是 java， 之后采用 Apache、Nginx、Linux 等进行开发环境部署，以及建立 MySQL、sqlserver 等数据库，实现网站数据存储。

　　3.2 网站后台 - 内容管理系统

　　网站后台是网站非常重要的一部分，后续的网站运营中使用后台的频率非常高，例如常规的新闻资讯栏目的文章上传和更新，页面信息修改等，都需要在后台进行操作。

　　网站后台主要以下面三点为中心进行开发：

1. 　　安全稳定
2. 　　简单实用
3. 　　功能强大

　　安全稳定是基础，简单实用是目的，功能强大是为后续网站优化和营销推广提供帮助。在功能上，我们可以按实际需求进行功能开发，比如与一些统计工具的联动，实时获取网站流量信息、用户行为等，或者与第三方功能进行对接，实现营销自动化。

　　这里要特别注意网站的 SEO 和后台 SEO 设置功能。

　　04.网站SEO

　　SEO 即搜索引擎优化，是一种利用搜索引擎的搜索规则，进而提高网站在有关搜索引擎内的自然排名的方式。

　　时至今日，SEO 已成为建站的标配，企业在建设网站时，不仅要考虑用户，还需要考虑到搜索引擎的抓取，需要满足搜索引擎的搜索规则。

　　基础的 SEO 规范质检表：

　　网站的 SEO 规范是一个需要注意的重要课题，除去网站后台的页面基础TDK 设置功能之外，我们在开发时还需要注意网站框架、内容元素、代码等是否符合 SEO 规范。确保符合常规的搜索引擎的抓取规则，才能为后续的网站 SEO 提供牢固的地基，也能让 SEO 效果更加显著。

　　总结

　　其实还有许多前端技术类型没讲，像视差滚动、3D 动效等等，都是目前较为主流的交互技术，感兴趣可以参考我们过往的案例，当中都有讲到。

　　事实上，技术开发是网站建设中非常考验技术含量的一环，就如开头讲到的，技术开发的还原度、用户体验和安全性是技术考核的关键点。不仅是产品经理、设计师需要懂得产品思维、数据思维、增长思维，技术人员同样需要了解，这样才能实现网站建设全过程同频，最终才能达成统一目标。

延伸阅读

• 网站开发技术全景解析

  随着互联网的飞速发展，网站已成为企业、组织、个人等展示形象、交流信息的重要平台。作为一个极为活跃的行业领域，网站开发涉及许多不同的技术，其中包括前端开发、后端开发、数据库管理、...

• 网站开发技术的新趋势

  随着互联网的发展，浏览者已经不能仅仅满足浏览信息这么简单了。浏览者开始要求有更好的服务，更好的体验，要求信息的及时性和趣味性。这样就对开发者提出新的要求:如何能更好地满足客户体...

• 网站开发技术的选择

  今的网络中，各个大大小小的网站一般都是通过3种技术开发的:ASP、PHP和JSP。这里只能称它们是技术，而不能叫语言。因为每个技术都是结合了很多种的前台后台技术组合而成的。通过...

• 网站开发技术有哪些?响应式网站优势是什么?

  网站技术开发的三个原则当我们力求做好一个优质网站时，自然需要将网站建设的每一个环节都做到最好，甚至要在上一个环节之下实现更深层次的提升，在技术环节上同样如此。基于网站建设的三大...

• 网站开发技术

  在众多纷纭的计算机的岗位中，其中有一个岗位叫做“web服务器开发”，就是我们经常说的web后端;也许有过一些工作经验的开发者对于这个web服务器的开发已经很熟悉了，对于他具体需...