如何做一个网站?
预计时间: 4分钟
有不少对Web开发技术感兴趣的人,不知道如何做一个网站。
这里列举出建设一个网站可能用到的知识和学习路径仅供参考。
如果你是初学者,建议按照从前到后的顺序阅读。
准备学习环境
MDN 在 安装基础软件 中提到了一些可供选择的软件列表,这里推荐安装如下
- Chrome 浏览器
- Visual Studio Code 简称 VSCode
- VSCode 插件: Live Server
目标1:制作一个网页
理解 HTML CSS Javascript 三者之间的关系
网页技术 | 用途 | 说明 |
---|---|---|
HTML | 定义网页内容 | 呈现文字、图片、视频等内容 |
CSS | 定义网页外观 | 网页版面布局与网页元素外观 |
Javascript | 定义网页行为 | 动态控制网页元素行为 |
HTML参考资料
HTML关注点:
- HTML标记
- HTML语义化
- HTML表单和校验
- HTML基本的SEO
CSS参考资料
CSS关注点
- 选择元素
- 布局
- 响应式
Javascript参考资料
Javascript关注点
- 基本语法
- Document Object Model (DOM)
- Fetch API
目标2:发布一个网页
让网民可以在互联网上看到你刚刚制作的那个网页,需要先执行如下几个步骤
- 购买域名
- 购买域名证书,或者申请免费域名证书
- 购买云服务器,或者轻量应用服务器
- 解析域名
- 网站备案
完成以上步骤后,需要在 Linux 服务器上安装 Apache 或 Nginx,并将网页上传到服务器。
目标3:静态网站
学习一个CSS框架,如
- Bootstrap
- Bulma
将网站内的页面分类,一般分为首页、列表页、详情页、专题页......
为每类页面制作一个页面,做为模板,渲染不同的内容。
目标4:动态网站
粗略地说,一个服务器可以提供静态或者动态的内容。静态意味着保持原样地提供。静态的网站是最容易建立的,所以我们建议你制作一个静态的网站作为你的第一个网站。
动态意味着服务器会处理内容甚至实时地从一个数据库中产生它。这个解决方案提供了更多的灵活性,但是技术堆栈变得更难去处理,让建立网站更惊人地复杂。
有许多现成的可免费商用的系统如博客或内容管理系统可用来制作动态网站,自己开发的话要学习服务器端编程相关技术。
网站功能
图片
评论
搜索
统计
扩展知识
HTTP
浏览器的工作原理
效率工具
最后更新时间为2022年04月23日