互联网与浏览器:从打开第一个网页开始¶
浏览器不是一个“输入网址就自动变魔法”的黑盒子。本教程从连接 Wi-Fi、认识地址栏和搜索框开始,带你完成一次网页访问、保存一份资料,再逐步观察网页请求、理解登录状态并排查打不开的问题。
第一次独立使用电脑时,很多“网页问题”其实不是一个问题:可能是电脑没有连上网络,可能是域名没有找到,可能是网站拒绝了请求,也可能只是浏览器保存了旧的登录状态。它们在屏幕上都可能只表现为“打不开”,但处理方法完全不同。本教程要做的,是把这层模糊感拆开,让你知道每一步应该观察什么、下一步为什么这样做。
你不需要先背下 HTTP、DNS 或开发者工具的定义。我们会把浏览器想成一位负责取件的快递员:地址栏提供地址,DNS 帮它查到门牌,请求和响应记录取件过程,Cookie 和缓存保存途中需要重复使用的信息。掌握这张地图后,遇到陌生网页、下载失败或登录异常时,你就能从现象回到证据,而不是反复刷新或随意修改设置。
📖 关于本教程¶
| 项目 | 内容 |
|---|---|
| 适合人群 | 会使用手机上网,但第一次在电脑上独立处理网页问题的学生 |
| 预计时长 | 快速阅读约 40 分钟;完整跟做按设备和网络情况安排 |
| 适用版本 | Chrome、Edge、Firefox、Safari 当前版本;开发者工具界面可能变化 |
| 维护状态 | 维护中 |
| 最后更新 | 2026-08-14 |
| 反馈入口 | GitHub Issues |
🎯 学习目标¶
- 能连接一个可信 Wi-Fi,并区分电脑没联网、网站故障和账号问题。
- 能拆解网址,理解域名、路径、参数和 HTTPS。
- 能在开发者工具中找到一次请求、状态码、资源类型和耗时。
- 能理解 Cookie、缓存、下载文件和登录状态的区别。
- 能在不泄露隐私的前提下记录网页故障并寻求帮助。
📋 前置要求¶
- 会打开浏览器、文件管理器和系统网络设置。
- 准备一个公开网页和一个不含个人信息的练习页面。
先完成一个小目标¶
全课都围绕同一件事展开:打开一个公开网页,确认它来自哪里,找到一次加载记录,保存允许下载的资料,并写下网页打不开时你观察到的现象。你不需要先背下 DNS 或 HTTP;每个术语都会在它真正帮助你判断问题时出现。
第一次练习建议使用 Windows 11 或你最熟悉的系统。找不到按钮时,先记录系统、浏览器和当前页面,不要为了跟上步骤随意安装插件或修改安全设置。
🗺️ 学习路线¶
| 章节 | 主题 | 你会得到什么 | 预计时长 |
|---|---|---|---|
| 第 1 章:连接网络和使用浏览器 | Wi-Fi、浏览器、地址栏和标签页 | 能打开并保存一个网页 | 15 分钟 |
| 第 2 章:网址与 DNS | 域名、IP、路径和解析 | 看懂一个网址的组成 | 15 分钟 |
| 第 3 章:请求与响应 | HTTP、HTTPS、方法和状态码 | 找到网页加载失败的线索 | 20 分钟 |
| 第 4 章:开发者工具 | Elements、Console、Network | 观察一张图片如何加载 | 20 分钟 |
| 第 5 章:Cookie、缓存与下载 | 登录、缓存、权限和文件 | 区分登录问题和网络问题 | 15 分钟 |
| 第 6 章:网页问题排查 | 证据、复现、隐私和求助 | 写一份网页故障记录 | 20 分钟 |
🚀 开始前准备¶
第一次练习优先使用公开网页,不要在开发者工具里操作银行、校园账号或他人的登录页面。截图前检查地址栏、Cookie、邮箱和个人资料是否露出。
📚 延伸阅读与资源¶
建议按“先建立地图,再看协议,最后动手排错”的顺序阅读:
- MDN:Web 是如何工作的 —— 从 URL、DNS、TCP/IP 到 HTTP,解释一个网页如何抵达浏览器。
- MDN:HTTP 概览 —— 查请求、响应、状态码、缓存和认证等概念。
- Chrome DevTools 官方文档 —— 对照练习 Network、Console、Elements 和性能排查。
- Cloudflare Learning Center:什么是 DNS? —— 用较短的文章复习域名解析和 DNS 基础。
这些文章适合作为“查概念”的入口,不要求一次读完。遇到网页打不开时,优先回到本教程的证据记录流程,再用对应资源核对术语。
✅ 完成标准¶
你能打开一个公开网页,找到它的一次请求,记录状态码和资源类型,并解释“浏览器无法打开网页”至少可能有哪三种原因。