preloader
 网站开发攻略 – 建站前必备指南

网站开发攻略 – 建站前必备指南

网站开发攻略 – 建站前必备指南

在本文章中,我们将介绍网站开发的基础知识、创建网站的过程以及其他资源,供那些想要建站的您有个大致了解。

为什么网站开发很重要?

互联网不会去任何地方。事实上,它已成为世界上研究、联系、教育和娱乐的门户和主要方法。截至 2021 年,全球互联网用户达 46.6 亿,占世界人口的一半以上。

鉴于互联网用户数量的快速增长,网页开发是一个快速发展的行业也就不足为奇了。从现在到 2030 年,Web 开发人员的就业人数预计将增长 13%,远快于大多数其他技术职业。

网页开发基础:多伦多网页设计

1. 什么是网站?比如:咖啡奶茶店网站

网站是存储在服务器上的文件,服务器是托管(“存储文件”的花哨术语)网站的计算机。这些服务器连接到一个称为 Internet 的巨大网络。

浏览器是通过您的 Internet 连接加载网站的计算机程序,例如 Google Chrome 或 Internet Explorer,而用于访问这些网站的计算机称为“客户端”。

2.什么是IP地址?

要访问网站,您需要知道其Internet 协议 (IP) 地址。IP 地址是一串唯一的数字。每个设备都有一个 IP 地址,以区别于通过 Internet 连接的数十亿个网站和设备。

ChinaSEO的 IP 地址是 166.72.xxx.xx。您可以通过访问站点 24×7之类的站点或使用 Windows 上的命令提示符或MacBook 上的网络实用程序 > Traceroute来查找任何网站的 IP 地址。

要查找您设备的 IP 地址,您还可以在搜索浏览器中输入“我的 IP 地址是什么”。

虽然您可以使用其 IP 地址访问网站,但大多数互联网用户更喜欢使用域名或通过搜索引擎

3.HTTP是什么意思?

超文本传输​​协议 (HTTP) 将您和您的网站请求连接到包含所有网站数据的远程服务器。它是一组规则(一种协议),用于定义应如何通过 Internet 发送消息。它允许您在网站页面和网站之间跳转。

当您在 Web 浏览器中键入网站或通过搜索引擎搜索某些内容时,HTTP 提供了一个框架,以便客户端(计算机)和服务器在通过 Internet 相互发出请求和响应时可以使用相同的语言。它本质上是你和互联网之间的翻译器——它读取你的网站请求,读取从服务器发回的代码,并以网站的形式为你翻译。

4.什么是编码?

编码是指使用编程语言为服务器和应用程序编写代码。它们被称为“语言”,因为它们包含与计算机通信的词汇和语法规则。它们还包括只能由设备和程序读取的特殊命令、缩写和标点符号。

所有软件都由至少一种编码语言编写,但语言因平台、操作系统和风格而异。所有语言都属于以下两类之一:前端和后端。

5、前端是什么意思?看看这个室内装修设计网站的前端

前端(或客户端)是您作为 Internet 用户看到并与之交互的网站或软件的一侧。当网站信息从服务器传输到浏览器时,前端编码语言允许网站运行,而无需不断与互联网“通信”。

前端代码允许用户与网站交互并播放视频、扩展或最小化图像、突出显示文本等。从事前端编码工作的 Web 开发人员从事客户端开发工作。

网站开发攻略

图片来源

6.后端是什么意思?

后端(或服务器端)是您在使用 Internet 时看不到的一侧。它是数字基础设施,对于非开发人员来说,它看起来像是一堆数字、字母和符号。

后端编码语言比前端语言多。这是因为浏览器——在前端——只能理解HTML、CSS 和 JavaScript,但服务器——在后端——可以配置为理解几乎任何语言。

7. 什么是CMS?

内容管理系统 (CMS)是一个Web 应用程序或一系列用于创建和管理 Web 内容的程序。(注意:CMS 与 Squarespace或Wix等网站平台不同。)

了解为什么成千上万的客户使用 CMS Hub 来构建一个优化的网站,该网站集成了他们的 HubSpot CRM 数据和完整的营销套件。

虽然不需要建立网站,但使用 CMS 可以让事情变得更容易。它提供构建块(如插件和附加组件)并允许您使用代码创建结构。CMS 通常用于电子商务和博客,但它们对所有类型的网站都很有用。

8. 什么是网络安全?

总是有恶意行为者希望找到网站中的漏洞以暴露私人信息、窃取数据和崩溃服务器。网络安全是保护数据、网络和计算机免受这些威胁的做法。

黑客使用的方法在不断发展,为防御他们而采取的安全措施也在不断发展。不了解您的网站如何成为目标可能会导致灾难。

因此,对网络安全最佳实践的基本了解对于有效的 Web 开发至关重要。您还应该始终如一地进行安全审计

接下来,让我们看一下开发人员可以专攻的 Web 开发类型。

网站开发的类型:多伦多网站制作

无论您是想聘请网站开发人员还是成为一名Web 开发人员,您都应该了解开发人员可以掌握的不同类型的 Web 开发。

这些不同类型的 Web 开发主要是指Web开发人员可以工作的不同专业领域。其中一些区别重叠,Web开发人员通常会掌握多种类型的 Web 开发。

1. 前端开发

前端开发人员在网站、程序和软件的面向客户端或用户端工作——换句话说,就是用户所看到的。他们设计和开发视觉方面,包括布局、导航、图形和其他美工。

这些开发人员的主要工作是构建帮助用户实现目标的界面,这就是为什么他们也经常参与项目的用户体验方面的原因。

2.后端开发

如果前端是用户看到的,那么后端就是他们看不到的。后端 Web 开发人员在网站、程序和软件的服务器上工作,以确保一切在幕后正常工作。

这些开发人员使用服务器、操作系统、API和数据库等系统,并管理安全、内容和站点架构的代码。他们与前端开发人员合作,将他们的产品带给用户。

3. 全开发

全栈开发人员在网站的前端和后端工作。他们可以从头到尾创建网站、应用程序或软件程序。“堆栈”是指在同一网站上处理不同功能的不同技术,如服务器、界面等。

因为全栈开发人员需要在该领域多年才能积累必要的经验,所以这个角色经常受到追捧。他们全面的知识帮助他们优化性能,在问题发生之前发现问题,并帮助团队成员了解 Web 服务的不同部分。

4. 网站开发

网站开发人员可以是前端、后端或全栈开发人员。然而,这些专业人士专注于构建网站,而不是移动应用程序、桌面软件或视频游戏。

5. 桌面开发

桌面开发人员专注于构建在您的设备上本地运行的软件应用程序,而不是在 Web 浏览器中通过 Internet 运行。如果应用程序可以在线和离线运行,有时这些开发人员的技能与 Web 开发人员的技能重叠。

6. 移动开发

移动开发人员为智能手机或平板电脑等移动设备构建应用程序移动应用程序的运行方式与其他网站和软件程序大不相同,因此需要一套单独的开发技能和专业编程语言知识。

App开发Frame

网站开发过程:埃德蒙顿网站制作

创建网站的过程并不像 1-2-3 那样简单。每个开发路径都因网站类型、编程语言和资源而异。

以下部分简要概述了 Web 开发过程,并简要介绍了最常见的语言和 CMS 选项。

1. 制定计划。

在将笔放在纸上或将手放在键盘上之前,首先要与组织中的团队和人员联系以制定网站计划,这一点至关重要。

在您的第一个网站草稿之前,您需要考虑以下一些问题:

  • 您的网站的目标是什么?
  • 谁是您的受众,您希望他们在您的网站上做什么?
  • 你在建什么类型的网站?(例如基本信息、会员资格、在线商店)
  • 您打算发布什么内容,以什么数量发布?
  • 这个内容的目的是什么?
  • 您将如何构建您的网站以获得最佳导航体验?
  • 你的预算是多少?

回答这些问题需要与您的 Web 开发、营销和财务团队进行交互,以确定您的优先事项并做出明智的决定。

简单地说?在流程开始时创建路线图比在路障处恢复进度要容易得多。

2. 创建路线。

所有好的网站都从蓝图开始。开发人员将此称为线框。它不一定是官方文件;它只是您网站的愿景,它将为您和您的开发人员提供方向和起点。您可以将其绘制在白板上或使用InvisionSlickplanMindnode等工具。

网站设计开发过程

线框是严格的可视化工具,可帮助您了解文本和图像在各个网页上的位置。您可以使用空白框和“虚拟文本”来了解您的内容将如何显示在前端。与您的开发人员一起创建线框,以便他们了解您所描绘的内容。

3. 起草站点地图。

接下来,是时候创建一个站点地图了(不要与sitemap.XML混淆,它是一个帮助搜索引擎抓取并找到您的站点的XML 文件)。就像商业计划可以让潜在投资者深入了解您的目标和可交付成果一样,站点地图可以为开发人员提供满足您愿景所需的信息。您可以自己创建站点地图,也可以与开发人员合作。

以下是在规划网站时要问自己的几个问题:

  • 您想要哪些单独的页面?
  • 这些页面上会有什么内容?
  • 您如何将这些页面组织成类别?
  • 您网站上页面的层次结构是什么?
  • 页面将如何链接在一起?
  • 哪些页面和类别对您的网站和用户体验至关重要?
  • 可以删除或合并哪些页面或类别?

同样,最好咨询组织内的其他团队。如果您有一个 SEO 和/或内容策略团队,他们的输入对于您的页面的链接结构和分类至关重要。

4. 编写您的网站代码。

Web开发过程的下一步是编写代码。

开发人员会为网站的前端和后端以及网站的不同功能(例如设计、交互性等)使用不同的编码语言。这些不同的语言共同构建和运行您的网站。

让我们从最常用的语言开始。

HTML

自 1990 年代以来一直使用超文本标记语言 (HTML) 。它是所有网站的基础,代表了创建网站所需的最低限度。虽然可以创建一个只有 HTML 的网站,但它看起来并不特别有吸引力。

下面是基本Bootstrap 按钮的 HTML 代码。
<button type=“button” classbtn“>Click Me</button>

CSS 和 JavaScript 等语言增强和修改了由HTML 代码构建的基本站点结构。HTML5 是最新版本,支持跨平台浏览器功能,因此在移动应用程序开发中很受欢迎。

CSS

级联样式表 (CSS)是在 1990 年代后期开发的。它为网站添加了排版、颜色和布局等设计元素,以改善网站的整体“外观”。

CSS 允许开发人员转换您的网站以匹配您为网站设想的美感,并且与 HTML5 一样,CSS 与所有浏览器兼容。

这是用于自定义Bootstrap CSS中的 jumbotron 元素的代码片段。

.jumbotron {
background: #27a967;
color: white;
text-align: center;
}

.jumbotron p {
color: white;
font-size: 26px;
}

JavaScript

JavaScript 是编码语言中的佼佼者。JavaScript 创建于 90 年代中期,用于向网站添加功能。开发人员使用它来添加动画、在某些页面中自动执行任务以及添加可增强用户体验的交互功能。

JavaScript 正在迅速发展。JavaScript 曾经被认为是一种“玩具”语言,现在是世界上使用最广泛的编码语言。在 Node.Js 的帮助下,它现在是一种后端编码语言。它是第一种被浏览器理解的语言,有些人甚至讨论过将机器学习应用于它。

下面是一个 JavaScript 代码片段,用于在WordPress 的新窗口中自动打开链接

HTML、CSS、JavaScript 是 Web 开发的“三巨头”。几乎每个网站都以某种身份使用它们。还有很多其他语言,例如JavaC++PythonSQL等服务器端语言,但了解这三种语言是您网站开发知识的基础。

4. 构建您网站的后端。

编写代码可能是 Web 开发中更复杂的部分之一,但它并不是唯一的组成部分。您还必须构建您的后端和前端站点结构和设计。

让我们从后端开始。

后端处理启用前端功能的数据。例如,Facebook 的后端存储了我的照片,这样前端就可以让其他人看到它们。它由两个关键组件组成:

  • 数据库,负责存储、组织和处理数据,以便服务器请求可以检索这些数据。
  • 服务器,它们是构成您的计算机的硬件和软件。服务器负责发送、处理和接收数据请求。它们是数据库和客户端/浏览器之间的中介。实际上,浏览器会告诉服务器“我需要这个信息”,服务器会知道如何从数据库中获取该信息并将其发送给客户端。

这些组件协同工作,为每个网站奠定了基础。

至于建立您的网站,后端开发人员将建立三件事。

  • 您的逻辑代码,这是一组关于您的网站如何响应某些请求以及您的网站对象如何交互的规则。
  • 您的数据库管理,这是您的网站将如何组织、管理和检索其数据的方式。
  • 您的基础架构,这就是您的网站的托管方式。托管您自己的网站将为您提供更大的控制权,但它的成本要高得多,并且需要您维护自己的服务器健康和安全。

有了这些组件和决策,您的网站将为前端开发做好准备。

注意:后端与 Web 开发略有关联,因为如果您不存储任何数据,则并不总是需要后端。在这种情况下,“数据”是指您需要保存和保留的任何用户输入的信息。考虑登录网站。如果他们没有后端,他们怎么能记住您的登录信息?或者你的个人资料设置是什么?要获取此信息,您需要一个后端。

例如,Facebook 需要知道您的好友列表中有哪些人、您加入了哪些活动、您创建了哪些帖子等等。这是存在于数据库中的所有“数据”。如果他们没有带数据库的后端,他们将无法访问这些数据。

另一方面,一个纯粹提供信息且不需要用户输入任何数据的网站不需要后端。

所以,如果你没有数据,你不一定需要后端开发。但这并不是说你不应该学习基础知识。你永远不知道什么时候可能需要它。

5. 构建您网站的前端。

如果您曾经涉足网页设计或玩过 WordPress、Squarespace 或Google协作平台中的网站,那么您已经接触过前端 Web 开发。

前端的东西很重要——它是您的访问者、客户和用户看到的内容以及他们将如何使用您的网站。

前端(或客户端)开发包括 JavaScript、HTML 和 CSS 的组合。它还控制诸如排版和字体、导航、定位以及浏览器兼容性和响应性等组件。这部分将更多地反映您最初的网站愿景以及您在线框图中包含的内容。

随着技术和消费者偏好的变化,客户端编码变得过时的速度往往比后端开发快得多。这就是编码资源(如我们在下面包含的资源)派上用场的地方。

6.使用 CMS类型网站

为什么有人会选择 CMS 而不是“手工”或“从头开始”编码?确实,CMS 不太灵活,因此您对前端的控制较少。但是,CMS 更易于使用(您必须编写更少的代码),并且它通常具有用于托管站点、存储用户信息、创建博客、发布登录页面、捕获潜在客户甚至构建电子邮件列表的工具。结果,您将能够用不到一半的工作使您的网站更有利可图。

CMS 选项通常包括无需编写后端的插件。例如,有用于电子商务的 WordPress 插件,因此,您无需构建复杂的后端来向客户的信用卡收费,只需使用现有的插件即可,而无需处理数据库和服务器端代码。

流行的内容管理系统包括HubSpotJoomlaMagentoWordPress——拥有超过65% 的市场份额。(在这种情况下,我们谈论的是开源WordPress软件,而不是WordPress 网站构建器

7. 获取域名。

此时,您的网站将拥有一个 IP 地址。它还需要一个域名,一个令人难忘的网站名称,您的访问者可以使用它来找到您的网站。

也许您听说过GoDaddyHover等网站。这些服务可帮助您购买域名并在 ICANN(互联网名称与数字地址分配机构)注册。大多数域名注册有效期为一年,然后您才需要续订。

网站建设者和托管服务,如WordPressSquarespace,也允许您购买域名。

8. 您的网站上线啦。

一旦您设置了域名并将其链接到您的主机,您就几乎可以将您的作品发布到网络上。

但没那么快——在正式发布之前,您仍然需要检查一些事情。其中包括规划团队的职责、彻底测试您的网站是否存在任何故障、谷歌SEO优化以及在“切换开关”并使您的网站上线之前进行最终检查。

 

 网页设计的原则