2024年纯静态网站制作 篇1
你说的模板引擎应该是指后端模板引擎。从网站全栈开发程序员的角度来看：从前，前端[不考虑原生app]只要“哄好”浏览器（包括微信内嵌的、app内嵌的）就可以了，服务端都是Nginx/Apache/IIS + php（大部分程序依赖于php-fpm[不能常驻内存]，少量运行在CLI[也就是命令行]），大家都用MVC, 都在热烈讨论视图文件与模板引擎的“家长里短”。后来，前端爆出了“微信小程序”，不少前台页面“弃暗投明”，好在后台页面/对/浏览器/“忠心耿耿”。再后来，swoole异军突起，php可以常驻内存、运行速度“风驰电掣”，同时开发方式大变[大部分运行在CLI]，比如：echo会输出到终端而不是浏览器---然而，模板引擎都是用echo输出动态数据到浏览器的---这就尴尬了。
现在，访客的客户端既有小程序，又有浏览器。小程序的页面只能由js渲染，php模板引擎对小程序页面无可奈何。php接口不得不设计为API，以便返回json给小程序，这种API倒是可以加以包装，这样，浏览器那边的前台页面可以继续使用模板引擎。后台页面，直接使用模板引擎。
一但用上swoole，要是坚持使用模板引擎，由于模板引擎将视图文件(view.html)翻译成模板文件（tpl.php），都会用到“echo”，（如果用到的视图文件都没有修改过，就直接）include tpl.php之后，为了防止输出到终端，使用ob_get_clean(), 再使用swoole的接口输出到浏览器，
倒也是可以。
结论：
后端模板引擎，只是开发一时爽，不适宜团队合作，适合全栈开发者，缺点：
应变能力差：使用全新装修的话，后端开发就要套页面，繁琐。
浪费人力资源，加重后端团队的负担：前端折腾完html页面，后端需要经手一遍。不得不提一点：分页条。thinkphp框架的分页条是写在php的page类里面，如果分页条样式变了，前端写完html代码，后端要誊写一遍。
如果需要翻译视图文件，则后端负担相对较重，用户等待时间相对较长：比如：编辑数据的页面。php从数据表里边拉取到数据，已经仁至义尽了，却还要翻译html文件，即使不用翻译，也需要查看用到的视图文件是否修改过。
后端模板引擎的渲染是一次性的，而前端模板引擎可以反复渲染，利于沉浸式体验。同一段html代码，要么由后端模板引擎循环处理，要么由前端模板引擎循环处理。举个例子：进入购物车页面（/cart/index），对某个商品重新挑选促销方案后，该商品需要挪到新的分组，再次计算受影响的组的优惠、赠品，然后再次计算总优惠。（后端更改促销方案, 不应由/cart/index处理，不然就“千人排、万人坑”，越来越“牵一发而动全身”。） 假设是由/cart/selectPromotion处理， 如果使用前端模板引擎，即便反复挑选，页面也无需刷新，不会打断沉浸式体验，否则，等待转圈结束，页面还要需要刷新，页面无论如何都是要经历空无一物的白色，反复刷新几次，真的沉浸不下来。由于css样式的影响，部分php错误信息未能及时发现，直到：打开控制台，查看源码，偶然看到额外的html元素直接查看网页源码，看到额外的html元素js出错：比如说，取不到指定html元素，json字符串转换成对象失败。
好处：
共同的html可以抽出来作为公用文件，用php加载公用文件。
可以用php读取静态文件的上次修改时间，引入静态文件时，将这个时间作为版本号，静态文件有变化则重新请求，否则使用本地缓存。调试过程中，不需要同时按shift + F5, 也不需要手动更改版本号，比较省事。
纯静态页面+ajax：适宜团队合作，也适合全栈开发者，应变能力强，不会浪费后端的人力资源，php负担相对较轻，用户等待时间相对较短，体验更好，除了开发时繁琐了点。
2024年纯静态网站制作 篇2
不请自来
(1)首先你要明确网站的主题是什么？然后知道网站色系
(2)设计一个草图出来，主要的网站排版，想展示什么东西
(3)写网站就离不开html+ css+js这些
当然如果你想写一个纯静态的网站html+ css就可以了，网上很多这样的教程，入门简单快速
如果你想增加一些特效，那么就要用到js
最后如果你想更好的管理你的网站，那么就需要一个后台管理平台，就需要一门动态交互的语言，php, python 入门简单快速，上手容易
2024年纯静态网站制作 篇3
首先要确认需求，你做的网站是要做什么，然后选取一套适合的前端框架，毕竟现在前端十分的火热。其次，才依据框架做开发。
建议：如果是后台管理方面的，例如对公众号会员管理的，可以选用layui，简单、高效。如果是其他门户网站的，可选的框架也很多，百度一下“前端框架”，可以出来一大片。
2024年纯静态网站制作 篇4
静态页面，即静态网页，是实际存在的，无需经过服务器的编译，直接加载到客户浏览器上显示出来。静态页面需要占一定的服务器空间，且不能自主管理发布更新的页面，如果想更新网页内容，要通过FTP软件把文件DOWN下来用网页制作软件修改（通过fso等技术例外）。常见的静态页面举例：.html扩展名的、.htm扩展名的。
优缺点
首先静态页面的优缺点与动态页面的优缺点是相对的。
动态页面是一对多访问。通过一个页面。可以根据若干参数返回其不同的数据。但是静态页面因为是静态所以是一个页面对应一个内容，也就是一对一的关系。他的优点就是无论你如何访问都只是让服务器传数据给请求者。并不做脚本计算及读取后台数据库。从而大大的提高了访问速度及降低了部分安全隐患。
采用静态页面的方法可以将数据库及后台系统与前台划分开。两者间没有绝对的联系。从而从提高站点的安全。
以上就是静态页面的最大的优点。速度快，可以跨平台，跨服务器。
同样静态页面也拥有相等与优点的缺点。今天的静态页面已经不是单纯的用FrontPage或DreamWeaver来一张张做。然后发布到网上了。他已经是动态与静态结合的产物。通常静态页面的制作流程是这样的：
第一步：发布信息到数据库
第二步：选择页面的模版
第三步：程序读取模版 +数据库信息 = 静态页面
第四步：发布索引页面（如首页，引导页等）
完成
静态页面的生成至少需要上述几个步骤才能完成，所以模版是关键的。因为静态页面无法在你调整后自动更新，必须再次创建，数据量大的话，这个更新的时间也相当可怕。所以你会发现有些大的网站新的文章与旧的文章不是长一个样子。再加上静态页面本身因为不具备动态页面的特性，也就无法做一些WEB应用，最明显的一点搜索。
生成特点
动态网页的概念是在服务器中运行的程序、网页等，它们会依据不同的客户和不同的时间回到不同的网页上去，它们是以网络中的数据库为依据的。动态页面的功能主要是把储存在数据库中内容以动态的形式展现在客户面前，并把客户的数据存储在数据库中留在以后使用。所以说网站中后台运行的数据库存储的信息更新的速度比较快。在网络网站中全部程序的操作都是在服务器中执行的，通过网络发送给客户的只是在这些程序中得到的结果，对客户的服务器的要求比较低，然而服务器在完成客户的请求的时候需要从数据库中找到和客户要求相对应的一些数据，所以需要占用很大的服务器的资源，而且随着后台的数据库储存的内容不断的发展和访问的人数不断的增多，会不断增加服务器内部的压力，页面加载的速度就会变的很慢。 在客户端运行的程序、页面、插件什么的都是静态页面，静态的网页不需要在服务器中访问数据所以浏览器在浏览静态的页面的时候就直接把这些静态的信息发送到客户的浏览器上了，因此相比较而言静态网页则不需要像动态网页那样需要访问数据库，减少了系统的消耗，对服务器的压力也就小了。因为静态网页使用的都是一个直接的网页。而且如果使用了静态的网页网站就不需要通过数据库就能够打开，因此运行的速度也就比较快了，自然而然的也就提高了网页打开的速度了。从网站优化的方面思考搜索引擎比较适合使用静态网页，因为静态网页可以提高搜索引擎对客户信息的存储和网站的排名。而在安全方面考虑，静态的网页能够提高网站的安全性减少不良代码的攻击，所以说静态网页比较不容易受到病毒的进攻。而从网站的稳定性能来思考，在有程序或者是数据库出现错误的时候，静态网页不会影响网站的正常运行，不会因为错误的程序损失网站内的数据，影响网站的正常运行，而损失用户对网站的使用，影响客户对网站的信任。所以通过一些技术来达到网页的静态有非常重要的价值和意义。我们需要讨论的就是怎样生成静态网页的技术和方法。 在一个网站中有动态网页也有静态网页主要是因为需要体现网站的功能和提高网站浏览的速度，动态的网页能够完成数据内容的更新，但是浏览的速度就比较慢，在一些特殊的网站中我们可以使用动态的网页进行内容的更新静态的网页进行浏览。这种结构就是静态网页生成技术。完全把动态网页生成静态网页是不可取的主要是因为把动态的网页生成静态的网页之后会使服务器的负担增加，需要维护的工作量也增加了，而且静态的网页需要读取大量的动态内容。
区别
静态网页和动态网页的主要区别在于在服务器上是否运行程序，运行在客户端的程序、页面等等都是静态页面，它们是一直不变的。静态网页和动态网页有着不同的特点，一个网站使用什么样的页面要看这个网站有什么功能和网站中的内容有多少，假如这个网站的内容变化不是很快，网站的功能也没有那么复杂，可以使用静态的网页对网站运行也比较简单。而相反则必须要使用动态的网页来完善一个网站。 一个网站建设的基础就是静态网页，而静态网页和动态网页之间也不是互不相容的，为了提高网站内搜索的速度，就是使用动态网页技术的网站，也能把网页的内容转变成静态网页运行，把网页转变为静态化是网站发展的一个非常好的方法，能够提高网页打开的速度。
2024年纯静态网站制作 篇5
网站的URL被分为动态和静态两种，因为程序语句不同，动态的URL也分为三种，第一种是ASP，第二种是PHP，第三种是JSP。静态的URL却只有一种，那就是.html。所以，我们经常通过网址来查看该网站是动态还是静态的。
虽然网站被分为动态和静态两种，但是针对SEO来说，搜索引擎会经常对网站进行爬行。如果访问动态网站就需要通过访问服务器上的数据库，然后进行数据库的转移才能展现。而静态页面却不需要通过这样繁琐的操作。对于SEO优化来说，静态网站的优化往往更加有利于优化。
1、为什么要静态化
由于在很长一段时间搜索引擎的技术有限，加上动态网站的负荷较大，所以从最开始的收录来说，搜索引擎都是针对静态网站而言的。这并不是说搜索引擎不会收录动态网站，只不过收录的动态网站因为点击之后访问速度以及其它原因，导致排名较静态网站而言更加靠后。有了这样的习惯后，越来越多SEO人员就记住了这样的规律。搜索引擎更加倾向于静态网站的URL收录。
之所以网站要使用静态化，主要体现在一下几个方面：更加方便搜索引擎的抓取。当用户访问网站的时候，因为是静态网站更方便用户记住，并且通过分享进行传播。静态网站因为只是一个单独的静态页面，并不需要通过访问服务器上的数据库进行转义，只有十几KB的大小，所以静态网站的打开速度往往更快。静态网站并没有漏洞存在，一般来说漏洞的存在都是因为代码不够严谨造成的，而静态网站多是以HTML的形式展现，所以并不会出现漏洞。
2、纯URL静态网站
正常来说是没有纯静态的网站。因为网站是需要维护管理和运营的，如果是纯静态网站，没有一个合适的管理后台，那么工作量是非常巨大的。当然任何事都没有绝对的，纯静态网站也是存在的。这种网站一般适用于接触前端人员，他们不懂程序和数据的衔接，更加不懂如何搭建合适的网站后台，只是通过前端代码DIV+CSS进行排版，之后上传到FTP上。
优点：网站页面简单，没有漏洞，只需要会前端代码就可以了。
缺点：管理困难，不利于优化，更加不利于后期的维护和更新。
3、开源自带伪静态URL网站
现在很多网站都是.html为后缀的网站，这种类型的网站通常会让用户错误认为是静态网站，其实这种网站被称为伪静态。因为凡是与程序相关的网站都是需要结合数据库的，而涉及数据库的网站就是动态网站。这是为了方便后期的网站优化，所以使用程序的办法进行了伪静态的操作。
优点：操作简单，学习一些DEDECMS教程就可以快速上手，直接伪静态利于优化。
缺点：需要有一定的前端代码基础和PHP基础，漏洞太多了，被攻击的可能性较大。
4、动态URL实现静态URL的方法
主流的开源系统除了DEDECMS在设计之初就实现了伪静态之外，其它常见的开源系统都属于动态网站。这种网站类型并不利于优化，所以，我们在做这种类型网站的时候，就需要通过一定技术来实现伪静态这种效果。
优点：模版风格清晰，管理方便，安全性高。
缺点：代码要求高，一般性修改比较困难。
2024年纯静态网站制作 篇6
听你的意思是想做个静态页面做一个网站吧。
单纯想用HTML做一个网站是可以的，但是纯粹用HTML写网页真的丑...
想做出一个漂亮的现代网页CSS少不了。
先大白话说说HTML、CSS、JS的作用，再说HTML做网页吧。HTML：
1.告诉计算机页面里有什么。
2.各种元素的前后关系、父子关系。
3.根据所用的元素判断元素占一行还是行内元素。
4.告诉浏览器需要加载什么脚本（script）、样式（css）等等。
6.head元素内，可以告诉浏览器或者爬虫，网站使用的语言（英语还是中文等），做一些移动端兼容设置，title就是本页面的标题。CSS：
css是在HTML给出一个抽象的脸的前提下让每个五官精确定位，它也像是在整容或者化妆，让界面更符合现代人审美。
1.定位属性，position，left，top，block等。
2.装饰属性，color，background，border，shadow-box等。
3.动画属性，transition等。JS：
JS代表着进一步自由，你能做更多的操作，它能做的事情说不完。
1.你可以利用JS与服务器后台沟通，当然HTML的form元素也能做到，但是form提交会刷新整个页面。
2.你可以设置大量的事件监听，如鼠标点击、鼠标移动、页面滚动等，当这些事件发生时你可以做一些事情。
3.利用一些浏览器接口额外做些事情，例如保存数据至本地，更强的图形化，例如利用webgl做动画片或者游戏。如何用HTML制作一个简单网页？
1.如果你的网站只是展示简单的信息又想外观还过得去，我建议你使用Bootstrap可视化布局系统来生成页面，简单的拖拽元素后，你只需要将生成的代码复制到html文件里的body内就好。
2.如果你很懒的话，也可以用纯粹的HTML写页面，学习的话推荐菜鸟教程。
题外话：如果你很有野心的话，建议学习下前端框架VUE，上手也挺简单，官网上和网络上案例多，学习曲线不怎么陡峭，使用element组件库或者ant的组件库，页面体验将会得到炸裂级的提升。