如何创建网站：3 种简单方法，分步指南

在当今世界，创建网站非常容易。 您不必是技术极客或程序员。 遵循正确的方法，选择正确的平台，使用正确的工具——您可以立即拥有您的第一个网站。

当我第一次在2004开始我的电子商务时，我对网站开发可说是一窍不通。我没有聘请Web开发人员,直今已XNUMX年, 我的商务做到还行。

今天——我们拥有创新的开发工具和更好的网络发布平台。 你会 100% 没事的。

在本文中，我们将介绍创建网站所需的所有步骤，并研究三种不同的网站建设方式。

循序渐进的过程

 1.注册域名 

域名是您网站的名称, 必须是独一无二的, 并且能传达您的企业品牌。

最简单的搜索方式和 注册域名 是去域名注册商。

通过域名注册商, 您可以以年度合同或长期合同方式注册您的域名。

在哪里注册您的域名

以下是一些知名的域名注册商及其起价。

域名提示

• 如果您很难确定域名，则可以始终使用域名生成器来获取建议。 一些比较流行的是 Wordroid 和 精益域名搜索.
• 如果您是新手，建议您 Namecheap 查找和购买域名。
• 参阅 – 域名的懒人包.

 2.购买虚拟主机 

网络主机是存储您的网站的大型计算机（又名服务器）。 一些大公司——如亚马逊、IBM 和 FB，拥有并管理自己的网络服务器； 其他企业只是从网络托管服务提供商那里租用他们的服务器（这更便宜、更容易）。

注意：如果您选择使用网站构建器来创建您的网站，请跳过此步骤（见步骤#3).

您在网络托管方面有哪些选择？

今天，Web托管提供各种软件包。 

传统上，网络托管服务提供商只涉及出租具有基本软件和技术支持的服务器。 托管您的网站 传统托管服务提供商 通常更便宜、更灵活； 但是需要一些额外的工作来设置网站。

如今，公司将不同的服务捆绑在一起，并允许用户通过一个服务提供商来构建，托管和管理所有网站。 我们通常称这些公司为网站建设者或在线商店建设者。 在这些“捆绑”平台上托管网站通常很昂贵，灵活性也较低。 但您可以轻松建立网站或在线商店。

为一些新手友好的托管服务做为参考。

虚拟主机提示

• 有 不同类型的托管 可用：共享托管，专用服务器托管和云/ VPS托管。
• If you’re a small website, it’s cheaper to go for shared hosting plans.如果您是小型网站，则使用共享托管计划会比较便宜。 Bigger sites are recommended to use either cloud or dedicated hosting.建议较大的站点使用云或专用托管。
• 选择虚拟主机之前，您需要考虑的一些关键特性是它们的用户友好性，价格，服务器速度和正常运行时间。 
• 迄今为止，我们已经注册、测试和审查了 70 多家托管公司 – 请参阅我们的 最佳托管选择.
• 考虑使用在线商店构建器，例如 Shopify or Bigcommerce 如果您打算直接从您的网站上销售产品。
• 一些公司收取不合理的服务器费用，记得阅读 我们的托管市场研究 在您购买之前。
• 通常，一旦付款完成，您会收到一封欢迎电子邮件，其中包含有关您的托管的所有必要信息——这是您作为网站所有者开始您的旅程的地方。 学习更多关于 本指南中的网络托管入职流程.

3. 创建和设计您的网站

Once you have your domain name and web hosting in place, it’s time to roll up your sleeves and start creating!设置好域名和虚拟主机后，就该大胆地开始创建！ To design and create webpages, you can either hire a web developer or do it yourself.要设计和创建网页，您可以聘请Web开发人员或自己动手做。

我们详细讨论 如何在此处外包网络开发任务。 You should skip the following steps and move on to that page if you plan to hire someone to develop your website for you.如果您打算雇用某人为您开发网站，则应跳过以下步骤并转到该页面。

对于 DIY 爱好者，以下是创建网站的三种简单方法：

方法 #1：从零开始用 HTML 和 CSS 创建网站

如果您能掌握主要的网络用语语言和网站的基础知识，那么您就可以创建出本身具有个人特色与众不同的网站。

否则，建议您跳到方法＃2/3; 或者，与web开发人员联系。

基本网络语言/工具

• HTML（超文本标记语言）
  HTML是网页和Web应用程序的基本结构，它使内容对Web浏览器具有语义。 由开口和闭合的顺序标签组成，结构以尖括号做为封闭关键。
• CSS（层叠样式表）
  CSS是一种样式表语言，用于描述和装饰HTML文档。 没有CSS，我们看到的网页就只是一张大白页，上面有一些无序的文字和图像, CSS将我们想象的画面一一呈现.。
• 脚本语言
  没有脚本语言，HTML和CSS就失去了意义，因为它们之间是没有互动的。 要创建一个能响应用户的动态网页，您需要JavaScript和jQuery等语言。 过后，可能还需要服务器端语言，如PHP，Python和Ruby。
• 数据库管理
  为了存储、管理和访问用户输入的网站数据，需要考虑一个庞大的信息表，称为数据库。服务器端使用MySQL、MongoDB和PostgreSQL等数据库管理系统来有效地完成这项工作。
• FTP（文件传输协议）/sFTP（安全文件传输协议）
  FTP用于 传输网站的源文件 到它的托管服务器更容易。 有基于 Web 和基于计算机软件的 FTP 客户端，可用于将文件上传到服务器计算机。

使用 IDE 创建网站的步骤

以下是如何创建第一手网站的过程概述. 假设您已了解以上所提到的基本Web语言和网站要点。

步骤1：设置本地工作环境 

为了创建和组织网站的源文件，优质的工作环境很重要。 您可以通过安装IDE（集成开发环境）在计算机设备上创建Web开发环境。 IDE基本上由文本编辑器，构建自动化和调试器组成。

Sublime Text 和 Atom 是一些支持 HTML、CSS、JS、 PHP, Python 和类似的网络语言。

另一方面，有扩展的IDE Adobe Dreamweaver中 它提供了一些其他功能（例如：服务器连接，FTP）。

步骤二：使用Adobe Photoshop规划和设计您的网站

规划网站结构和导航系统非常重要。 首先，您必须了解如何提供内容。 计划导航菜单的数量，列数或内容字段数，要包含的图像数量以及位置。

最佳做法是打开 Adob​​e Photoshop中 并创建您的网页的粗略图。 您可能需要对不同的页面进行不同的粗略处理，例如主页、关于页面、联系页面、服务页面等。

步骤三：使用HTML和CSS对设计进行编码

在Adobe Photoshop中完成对网页的粗略设计后，您可以开始编写源代码。

这是最简单的部分。 为您想要包含的Web元素制作HTML标记，并根据您的设计使用CSS来进行美化。

步骤4：使用JavaScript和jQuery使其动态化

现在只有基于HTML和CSS的网站不存在，因为无法通过HTML或CSS控制前端用户交互。

您可以使用JavaScript等脚本语言，或者使用改进的jQuery来控制表单、登录、滑块、菜单或任何需要的用户活动。

步骤5：使用FTP客户端将本地文件上载到服务器

最后一个步骤是将所有源文件上传到Web服务器。 最好和最简单的处理方法是通过FTP客户端。

首先，在计算机设备上下载FTP客户端，然后使用FTP帐户将其连接到Web服务器。 成功将其连接到FTP帐户后，将所有本地文件复制到Web目录的根目录。 一些好的FTP客户端是 FileZilla中, WinSCP赋予 和 Cyber​​duck的.

方法 #2：使用 CMS 创建网站

CMS 或 内容管理系统 它的构建方式非常巧妙，适合上班第一天的初学者和经验丰富的 Web 开发人员。

它是一个软件应用程序，可以轻松创建和管理在线内容。 其中大多数是公开的，可以免费使用。

如果您了解HTML，CSS或PHP的基础知识，那么它会让你更得心应手。 如果您不懂,也不是大问题，因为这些平台非常容易辨识。 以下是CMS的三大免费平台，您可以根据需要选择。

例如: WordPress 和 Weebly ，

例如: WordPress 和 Weebly ，，据各种统计，被用在最多的博客和中小型网站上。 尽管如此，许多强大的大型网站确实更喜欢 WordPress 的简单性。 WYSIWYG 编辑器是您获得第一个内容所需学习的唯一内容。

这是初学者的平台，同时也可以应付不同类别的Web开发人员的大量开发。 存储库中提供许多免费插件和主题。 可以提供大量第三方资源, 是CMS的第一选择。

有关更多参考，请参阅这些 30 个 WordPress 驱动的网站. 您也可以通过在以下位置创建一个免费帐户来自己试用 WordPress WordPress.com或; 从WordPress.org下载CMS.

Joomla

Joomla在许多方面类似WordPress。 它易于使用，易于安装，并且可以借助模块轻松扩展– 相当于WordPress插件。 因此，它是初学者的第二选择。

但是，由于可用选项的数量众多，初学者可能更害怕探索Joomla。 除了左侧菜单，“控制面板”上方的顶部栏还有一个菜单 商标。 为避免混淆，请记住，左侧和顶部工具栏菜单中的某些项目相似，包括“内容”，“用户”和“扩展”。

就像WordPress一样，Joomla具有一些样式和模板，可以快速为您的网站提供与众不同的外观。 但是在所有三个内容管理系统中，Joomla在创建社交网络时提供了最简单的解决方案。 借助EasySocial和JomSocial等平台，您距离自己的社交网站只有几分钟的路程。

使用 Joomla 创建的网站包括 利普顿, Linux， 以及 哈佛大学. 您可以免费下载并试用 Joomla 此处.

Drupal

经验丰富的Web开发人员证明Drupal是最强大的CMS。

然而，它也是最难使用的。 由于其灵活性，Drupal 是世界上使用量第二大的 CMS，但它并不是初学者的最爱。 要使用 Drupal 成功构建一个“完整”的网站，您需要亲自动手并学习 编码. 了解 CMS 的方式对初学者来说也具有挑战性。

使用 Drupal 创建的站点包括 特斯拉, 华纳兄弟 记录和 牛津大学。 了解更多， 免费下载并试用 Drupal.

使用 CMS 创建网站的步骤

对于此方法，我们将使用 WordPress 作为示例。 到目前为止，您应该已经拥有一个虚拟主机帐户和一个注册域名。

步骤1：在Web主机面板中找到WordPress安装程序

Web托管服务通常具有安装WordPress和其他常见平台的快速安装程序。

因此，请登录您的网络托管帐户，找出您拥有的安装程序。 您应该搜索的热门名称如: Softaculous，QuickInstall或Fantastico。

步骤2：通过安装程序安装WordPress

Softaculous是最受欢迎的自动安装程序，在cPanel上是具特色的。 让我通过Softculous引导您完成安装。至于 其他安装程序几乎是大同小异。

这是重要的部分。

配置选项如下，将其他字段保留为默认配置（稍后将进行排序），然后单击“安装”。

• 协议：您必须决定是否要安装http：//或http：// www。 URL的版本。 无论你选择什么，都大同小异。 从技术角度来看，http：// www。 在灵活性和cookie管理方面更好。 请注意，如果您拥有有效的SSL证书, 并且想要安装WordPress，只需选择https而不是http。
• 域名: 选择要安装网站的域名。
• 目录：指定要安装WordPress站点的位置。 如果要将其安装在URL根上（例如：http：//www.yourwebsite.com/），将其留空。 如果您想在URL子上（例如：http：//www.yourwebsite.com/myblog/），请在字段中指定目录。
• 管理员帐户：设置您的用户名称，密码和电子邮件, 以用于登录WordPress网站。

完成最后的步骤后，意味着你的网站成功诞生了！

现在登录到您的 WordPress 网站。 您网站的登录页面看起来像 wp-login。php 尾随您设置的网站 URL。

步骤3：安装主题和一些重要的插件

接下来，您必须安装主题和必需的插件。 看看WordPress仪表板的左侧边栏。

有大量的免费 现成的主题 在 WordPress 目录中可用。

要浏览这些免费主题，请转到“外观>主题>添加新内容”，搜索符合您要求的主题，然后单击“安装”按钮。

您也可以从“上传主题”部分安装第三方主题。 对于付费的，专业设计的WordPress主题，我建议使用Elegant Themes（优雅的主题（因为其高效的代码和漂亮的前端设计））。

对于插件，请浏览“插件>；添加新。

搜索并安装您所需要的插件。 XNUMX^rd 部份插件也可以从“上传插件”中安装。

在这里，我想建议一些重要的免费插件。 你可以从WordPress插件目录中, 按名称搜索找出它们。 请注意，只需从每个类别安装一个插件就足够了。

• SEO：Yoast SEO，All in One SEO Pack
• 安全：iThemes Security, Wordfence Security
• 网站统计数据：WordPress.com的Jetpack，Monster Insights以谷歌分析的WordPress
• 表格创建：联系 表格 7
• 性能：W3总缓存，W​​P超级缓存

对于您的网站标识，即使您使用精美的主题，仍然需要创建一些内容。 周围有很多很棒的徽标生成器，但我来看看 Logaster。 它们是一项付费服务​​，但最棒的是它们提供了分层定价。 这意味着您只需为所需的东西付款-只需一个Web格式的徽标，或者您甚至可以注册整个品牌工具包，其中包括适用于各种平台的格式。

步骤4：你准备好了！

来到最后一个步骤, 您的网站已启动并且运行。 但还有一些事情需要解决。

• 在“设置>常规”下：设置网站标题和标语。
• 在“设置>阅读”下：您的首页应显示什么以及您希望在单个页面上显示多少博客文章。
• 在“设置>永久链接”下：设置博客帖子的URL结构。

方法#3：使用站点构建器创建网站

网站建设者可以不费力地立即建立一个网站。 即使不了解网络语言，也可以在几分钟内启动他的全功能网站。 透过Drag＆Drop网站构建器，就算是零编码知识都可以轻松掌握。

有 许多网站建设者分散在互联网上 但并非所有人都能满足需求。

以下三个是您可以使用且最受关注和潜在的网站构建者。

齐罗

即使考虑到网站建设者的性质， 齐罗 绝对易于使用。 如果您曾经使用过文字处理器或类似的“所见即所得”（所见即所得) 应用程序 – 使用 Zyro 构建站点不会有问题。

理论是一样的。 这就像玩积木一样。 这些块是预先设计的网站元素，例如图像、文本框等。 设计网站就像选择您想要的元素一样简单，然后将其拖放到位。

Wix

Wix 是市场上最简单的网站建设者之一，拥有 500 多个完全可定制的模板，按不同类别分类。 因此，几乎可以肯定，您会找到一款适合您的。

他们提供灵活的拖放网站编辑器，让网站编辑随时可以明显的看见内容。 您可以从列表中拖动项目, 在网站上的位置进行添加, 修改,移动或编辑任何项目。

唯一的缺点是在Wix免费配套中有现场广告。但是您可以通过升级每月至少12美金的Combo配套来摆脱这些广告。

Weebly

Weebly 在许多方面都更容易，例如导航、用户友好性。 他们提供数百种模板可供选择，但个性化选项可能会受到限制。

拥有大量可以使用和修改的预先设计的页面布局（例如：关于页面，定价页面，联系页面）。

“拖放”构建器更易于使用，但有时仅限于指定的自定义区域。 扩展程序和第三方应用程序的可用性也很有限受到限制。

 4. 验证和测试您的网站 

网站准备就绪后，就可以在主要浏览器（Chrome，Firefox，Safari，Microsoft Edge，IE 11等）以及不同屏幕尺寸上验证并测试其工作方式。

我们可以在线免费工具的帮助下运行这些测试。

标记验证

什么是标记验证？ 编码语言或脚本，例如 HTML， PHP等等，每个都有自己的格式、词汇和句法。 标记验证是验证您的网站是否遵循这些规则的过程。

浏览器测试

屏幕测试

 5. 微调和发展您的网站 

Publishing your website on the internet is stage one.在互联网上发布您的网站是第一阶段。 There are still many other things to do to ensure the success of your website.要确保您的网站成功，还有许多其他事情要做。 Here are a few tasks to begin with…这是开始的一些任务…

网站速度

Google has stated clearly that site speed is one of its ranking factors.谷歌明确表示，网站速度是其排名因素之一。 This means your site may rank higher if it loads quickly.这意味着，如果您的网站加载速度很快，则其排名可能更高。

另外– 您的网站加载速度越快，您的网站访问者会越开心。 无数案例研究和实验证明，加载缓慢的网站会损害用户体验并影响网站收入。 如果亚马逊网站的速度下降一秒钟，估计将损失 1.6 亿美元的收入。

网站搜索可见性

独家 SEMrush 促销
目前有超过 1 万人在使用 SEMrush 为他们的网站搜索引擎优化和内容营销。 使用我们的特殊链接注册试用，您将获得 14 天的延长试用期（需要信用卡信息）> 点击这里

你不需要成为大师 搜索引擎优化（SEO） 让您的网站受到关注。 但是一些基本的搜索引擎优化技能总是好的。

在创建一个网站管理员帐户 谷歌搜索控制台 to submit your website to Google and to identify any SEO issues.将您的网站提交给Google并确定所有SEO问题。 Do basic keyword research and then optimize your page title and headings for your primary keywords.做基本的关键字研究，然后为主要关键字优化页面标题和标题。 Implement schema markup on your site to stand out from search result pages.在您的网站上实施架构标记，以从搜索结果页面中脱颖而出。

实施HTTPS

自从Google Chrome开始将HTTP网站标记为“不安全”以来， SSL证书 已经变得很重要。 为了确保您的网站受到用户“信任”，必须有HTTPS连接。

扩大您在社交媒体平台上的影响力

Your website should also have a presence on social media platforms where most of your targeted audience hang out.您的网站还应该在社交媒体平台上占有一席之地，您的大多数目标受众都在其中闲逛。 For our site that means Facebook and Twitter.对于我们的网站，这意味着Facebook和Twitter。 For others, it may be LinkedIn, Tumblr or Pinterest.对于其他人，可能是LinkedIn，Tumblr或Pinterest。

添加图标

您看到字母“W” 在浏览器选项卡左侧出现的蓝色圆圈中？ 这就是所谓的“网站图标”。 与徽标一样，网站图标是代表网站的较小视觉元素。

Favicon是一种精美的小品牌化技术，网站所有者经常忽略它。 If that sounds like you – make use of these如果听起来像您，请利用这些 免费的图标生成器 来帮助你。

您网站上的基本页面

没有两个网站可以用作不同的目的和/或功能。 但是，每个网站应具有三个标准页面：索引（主页），关于页面和联系页面。

首页

The homepage is often the first place where most visitors will go see after they landed on your website.主页通常是大多数访问者访问您的网站后会去的第一个地方。 Your homepage should deliver the right pitch and drive your visitors deeper into your site.您的首页应该提供正确的音调，并吸引访问者更深地进入您的网站。

关于页面

About Page就是与访客建立融洽的关系。 It lets you introduce yourself and give detail information (well?) about your website.它可以让您自我介绍并提供有关您的网站的详细信息（好吗？）。 Usually it’s recommended to include photos of the people who own and run the website.通常，建议包含网站所有者和运营者的照片。

联系我们

It’s important to communicate with your users and potential clients.与您的用户和潜在客户进行沟通很重要。 Hence – the contact page.因此–联系人页面。 Include all possible communication channels (social media profiles, contact forms, email address, etc) to make sure that your visitors are able to reach you.包括所有可能的沟通渠道（社交媒体资料，联系表，电子邮件地址等），以确保您的访问者能够与您联系。

制作网站的常见问题

立即完成！

You now know more than enough to create and build a successful website.现在，您对创建和构建成功网站的知识已绰绰有余。 It’s time to put your knowledge to work.是时候利用您的知识了。 Go start now and rock the internet!立即开始，畅游互联网！

了解更多

• 不同网站的类型以及如何创建它们
• 需要考虑使用 cPanel 的廉价 VPS 托管
• 无需信用卡的最佳虚拟主机免费试用