创建网站的三种简单方法:循序渐进的初学者指南

文章撰写者:
  • 托管指南
  • 更新:May 10,2019

在2019中创建网站是超级简单。

你不必是技术玩家也无需是程序员。

只要依照正确的方法,选择合适的平台,使用正确的工具,你就可以100%迎刃而解。

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

这个时代我们拥有创新的开发工具和优质的网络发布平台。

三种简单制作网站的方法:

快速链接:

  1. 从零开始创建
  2. 使用内容管理系统(CMS)
  3. 使用网站建设者

你可以在#1取得具有大幅度灵活性的设计和站点功能, 但是需要具备有良好的网络语言和知识。

透过#2和#3的方法, 让网站创建和管理过程更加容易。 您应该根据自己的能力选择其中一种方法。

我们快速的研究出这三种方法:

在你开始之前......

在开始之前,我们需要为您的网站提供两件事:1-域名和2- 网络托管。

1-注册域名

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

搜索和注册域名最简单的方法是访问域名注册商。

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

在NameCheap搜索并注册您的域名
搜索并注册域名 Name Cheap.

以下是一些具有信誉的域名注册商作为参考。

注册商起始价
.COM
123 Reg£11.99£11 .99
Domain.com$ 9.99 /年$ 10.99 /年
Gandi€12.54 /年€16.50 /年
GoDaddy$ 12.17 /年$ 12.17 /年
Name Cheap$ 10.69 /年$ 12.88 /年
Network Solution$ 34.99 /年$ 32.99 /年

参阅 - 域名的懒人包.

二 购买网络托管服务

虚拟主机 是一个存储您的网站的大型计算机(也称为服务器)。 一些大公司 , 如: 亚马逊、IBM和FB,拥有并管理本身的网络服务器; 一般企业只是透过托管服务提供商租用他们的服务器(这是更简单且实惠)。

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

网站托管

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

虚拟主机 加入备注
A2 Hosting$4.90/月快速的网络主机,新手容易上手。
BlueHost$3.95/月注册价格便宜,新手容易上手。
Hostgator Cloud$8.95/月价格合理,服务可靠。
HostPapa$3.36/月环保网站主机,独家折扣。
InMotion Hosting$3.49/月注册价格便宜,服务器可靠。
SiteGround$5.95/月支持#1实时聊天,扎实的网络主机。

目前为止,我们已经签署,测试和审核了超过60家托管公司。 请参阅我们选出的十大主机或主机评论的完整列表。

参阅 - 建立一个网站需花多少钱?.


FTC披露

WHSR收到本文中提到的一些公司的推荐费用。 创建类似实在内容, 需要耗费很多精力和金钱 , 您的支持受到高度的重视。


一旦你的域名和网络托管到位,就可以卷起袖子开始创作了!

方法#1:从零开始创建网站

所需的技能和工具

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

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

您应该了解的基本Web语言/工具:

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

使用IDE创建网站

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

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

使用子行文本制作网站
Subline Text工作环境的屏幕截图。

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

Subline Text 或 Atom 是一些IDE的基本文本编辑器, 用于开发支持HTML,CSS,JS,PHP,Python等的类似Web语言。

另一方面,如Adobe Dreamweaver便扩展了IDE, 延伸更多的功能(例如:服务器连接,FTP)。

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

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

最佳做法是打开Adobe Photoshop并创建网页的粗略绘图。您可能需要为不同的页面制作不同的草稿页,例如主页、关于页面、联系人页面、服务页面等。

我们在创建此网站时使用的设计模型
示例 - 我们在2016年XNUMX月的站点改造期间进行的模拟设计。。

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

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

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

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

当今时代只是靠者HTML和CSS的网站是不存在,因为HTML或CSS无法掌控前端用户之间的互动。

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

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

用于网站创建的FTP软件

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

首先,在计算机设备下载FTP客户端,然后使用FTP帐户将其连接到Web服务器。 成功连接到FTP帐户后,将所有文件复制到Web目录的根目录. 口碑好的FTP客户端有: FileZilla,WinSCP和Cyberduck.


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

所需的技能和工具

  • 知识:计算机和互联网的基本操作; HTML,CSS和PHP(不是强制性的,但如果您能掌握基础知识则更好)
  • 工具: WordPress, JoomlaDrupal

CMS 即内容管理系统, 其构建非常具有战术性,对于初学者和有经验的Web开发人员皆适合。

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

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

快速比较

WordPressJoomlaDrupal
成本均码均码均码
用法311,682万元26,474万元31,216万元
免费主题超过4,000个超过1,000个超过2,000个
免费插件超过45,000个超过7,000个超过34,000个

参阅 - 热门CMS比较(2018) - WordPress vs Joomla vs Drupal

WordPress

根据各种统计数据,目前WordPress是最受到博客和中小型网站的广泛使用。 而许多大型的网站确实也更喜欢WordPress的简单性。 WYSIWYG编辑器是您放置内容时, 是你初步也是唯一需要学习的东西。

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

主题
选择WordPress主题。

优点

  • 高度灵活和可定制
  • 使用方便,
  • 大量的学习资源,
  • 优秀的社区和支持

优点

  • 主要视觉定制, 需要代码
  • 更新可能会导致插件出现问题

了解更多

Joomla

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

但是,由于可用选项的数量,可能影响初学者对Joomla的探索。 除左侧菜单外,位于“控制面板”徽标的正上方, 顶部栏上还有一个菜单。 为了避免混淆,请记住左侧和顶部栏菜单中的某些项目是相似的,如: “内容”,“用户”和“扩展程序”。

就像WordPress一样,Joomla有一些样式和模板可以快速为您的网站提供独特的外观。 而在三个内容管理系统中,Joomla在创建社交网络时提供了最简单的解决方案。 借助EasySocial和JomSocial等平台,让您与创建属于自己的社交网站近在尺咫。

短跑
Joomla系统内部。

优点

  • 更先进的技术
  • 网站表现更出色
  • 企业级安全性

优点

  • 模块很难维护
  • 在内容系统管理CMS部分 - 不比WordPress简易,不及Drupal先进.

更多信息

Drupal

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

但是,它也是最难使用的。 它的优势在于灵活性,让Drupal成为了全世界第二大高使用率的CMS,但它不受初学者的青睐。 要使用Drupal成功构建一个“完整”的网站,您必需亲自动手并学习编码的基础知识, 这对于初学者而言,是具有难度的挑战。

Drupal的
安装新的Drupal - 尽管Drupal中的功能很复杂,但CMS提供了一个简单,简约的界面。

优点

  • 简单易学
  • 很棒的帮助门户
  • 无缝隙整合更新
  • 更多内置选项

优点

  • 初学阶段陡峭的学习过程- 比较建议高级用户使用

更多信息

使用WordPress逐步完成网站创建过程

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

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

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

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

一些托管服务提供商(例如:SiteGround)在其用户仪表板(登录到cPanel后即看到的屏幕)中使用集成安装程序。 在这种情况下,只需找到含有“WordPress”的标题。

示例:SiteGround cPanel仪表板。

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

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

单击Softaculous,然后单击WordPress上的'Install'开始安装。

安装WordPress来创建您的网站

这是重要的部分。

网站配置

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

  • 协议:您必须决定是否要安装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,其中包含您设置的网站网址。

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

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

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

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

WordPress主题目录
WordPress主题目录。

您还可以从“上传主题”部分安装第三方主题。 对于付费者,可选择专业设计的WordPress主题,我推荐 Elegant Themes (因为它有效的代码和漂亮的前端设计)。

对于插件,请浏览“插件>;添加新。

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

WordPress插件目录
WordPress插件目录。

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

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

参阅 - 适用于新WP站点的9 Essential WordPress插件

步骤4:你准备好了!

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

  • 在“设置>常规”下:设置您的网站标题和标语。
  • 在“设置>阅读”下:您的主页应显示的内容以及您希望在单个页面上显示的博客数量。
  • 在“设置>永久链接”下:设置博客帖子的网址结构。

新WP站点的基本设置
新WordPress网站的基本设置。


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

所需的技能和工具

  • 知识:计算机和互联网的基本操作
  • 工具: WixWeebly

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

互联网上遍布许多网站建设者--Disha曾在博文中介绍了XNUMX位免费网站建设者; 但是他们并不能无法满足所有人的需求。

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

Wix

使用Wix建立一个网站

Wix是市场上最简单的网站建设者之一,拥有500多种各种类别, 可定制的模板。 因此,您肯定会找到一个适合您的产品。

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

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

参阅 - 我们深入的Wix评论.

Weebly

使用Weebly创建一个网站

Weebly在很多方面较为简易,比如:导航 、用户友好性。 它们提供了数百种可供选择的模板,但个性化选项可能会受到限制。

拥有大量可以使用和修改的预先设计的页面布局(例如:关于页面,定价页面,联系页面)。

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

参阅 - 我们深入的评论Weebly.

使用Wix的逐步网站创建过程

步骤1:注册Wix

在Wix.com创建一个帐户。

有5个豪华配套和1个免费配套(价格范围从0美元到24.50美元/月)。 成功创建站点后,您将看到升级选项。

请在此处查看Wix计划和定价。

Wix注册
Wix注册页面。

我推荐Wix基本付费8.50合XNUMX配套 。 Wix Combo计划($ XNUMX / mo)具有免费域名,更多CPU资源,并且没有Wix广告。

步骤2:选择一个模板

Wix会问你想如何创建一个网站。 他们建议的最快方式是Wix ADI(人工设计智能), 只是最终效果并不理想。

所以我会引导你一段时间,以更好的方式成为网站建设者!

您将看到在不同标签下分类的模板。 浏览您所预期的类别并选择适合您的类别。

找到您喜欢的Wix主题后,点击“编辑”以继续。

在Wix编辑网页
将鼠标悬停在主题上时会显示“编辑”按钮。

步骤3:使用Wix Website Builder设计您的网站

片刻之后,您将直接登陆他们直观的网站构建器。

设计网站很简单。 您将在屏幕的左侧和右侧看到不同的工具。 单击网站上的任何位置以编辑分段或将其移动到其他位置。

Wix元素
使用Wix拖放编辑器构建您的网页元素。

步骤4:发布网站

当您点击发布键时,系统会询问您是否需要免费子网域或全网域, 由你本身决定。

建议进行一些调整。

转到“Wix仪表板>管理和编辑站点”,根据需要配置SEO,Favicon,社交和升级。

Wix站点配置
配置您的Wix站点。 点击放大图片。

一旦完成这些基本设置 - 您的网站即准备就绪。

Jerry Low的文章

Geek爸爸,SEO数据迷,投资者和Web Hosting Secret的创始人。 自2004以来,杰瑞一直在建立互联网资产并在线赚钱。 他喜欢随性的涂鸦和尝试新食物。