比德勒科技

免费网站制作平台

日期:2024-06-04 12:24 / 作者:www.biddlecn.com

其实免费网站制作平台的问题并不复杂,但是又很多的朋友都不太了解免费网站制作平台,因此呢,今天小编就来为大家分享免费网站制作平台的一些知识,希望可以帮助到大家,下面我们一起来看看这个问题的分析吧!

大家有什么好的图片素材网站?

找一个免费空间,申请一个免费域名。找个免费的网站程序。解决

一个小白想学PS,有什么免费网站或者资源推荐吗?

大家都知道一个网站的建设时非常麻烦的,首先必须要了解一下目前网页制作的基本语言HTML,还要精通代码进行搭建。那么问题来了,网站建设不懂代码行不行?不是不行,而是你们没有找到合适的方法。

第一步很简单只需要注册一个会员账号然后登陆:

第二步登陆进入“管理中心”后点击“基本设置”接着点击“模板设置”选择一个网站模板:

第三步点击“网站设置”进行设置自己网站的名字和网站简介即可:

第四部点击“域名”随便输入绑定一个域名即可:

设置完自己的域名后一个网站基本上就已经出来了。在这里即使不懂代码的人也照样能够简单的创建一个属于自己的网站。为啥不通过

如何免费且快速的搭建个人网站

这篇文章主要讲如何拥有自己的专属域名。你可以在属于自己的网页上展示你的github、微信、微博、QQ、Twitter、Email等信息,但主要是展示自己的作品。

玉刚大神说过:树立个人品牌:让名企hr们主动来找你

有了个人网站,可能就又多了一些学(zhuang)习(bi)的动力吧!

所以,拥有自己的网站,算是迈出了第一步!

域名怎么来的

好吧~ 我的域名是这么来的…

这里我们先选择第二个,BAT中的A。

输入你想注册的域名,查询这个域名是否被别人注册了。

Tips:

我的域名是goileo.top,为了演示注册过程,显示未注册状态,所以这里以goileolee.top为例

这里我选择了一个 .top的域名。

什么?

“我为什么选.top后缀的?”

额…

这个问题就触及到我的资产盲区了。

因为它是最“贵”的!!!

接下来,加入清单,结账。

至此,这个域名就是你的了。

域名注册成功后,需要进行实名认证。

不过你还得对它进行解析,这个我们下面详细说。

这时的域名什么都做不了,因为没有服务器,阿里的服务器可不免费。所以接下来介绍GitHub Pages。

免费的服务器 GitHub Pages

什么是GitHub Pages?

GitHub Pages is a static site hosting service

简单说,它能提供给你1G空间的存储,让你放东西,然后还能请求到。是不是很6…

GitHub Pages也有一些限制条件,我们主要用GitHub Pages来做个人站点,所以一切OK。

不过也有人认为 用GitHub Pages做个人网站是不道德的

接下来,登录github.com,点击右上方头像旁的加号new repository。仓库名字为固定格式:

你的名字.github.io

描述… 公开… 初始化README…

仓库创建好了,这时你可以写一个简单的index.html文件放到仓库里,然后在浏览器中输入:你的名字.github.io/试试。

如:

有神奇的效果…

域名与GitHub Pages相绑定

解析域名:

打开阿里云

登录账号

打开控制台

点击解析

添加一个记录类型为CNAME,主机记录为@,记录值为github的仓库路径。

Tips:

记录类型和主机记录都有解释,很好理解。

记录值就是你希望请求域名跳转到的路径。

TTL值可以理解为缓存时间,这里是每10分钟刷新一次域名的记录值。

调试可以设置小点,正常使用后记录值不会轻易发生更改,可以将TTL值设置大一点。

看上图,主机记录决定了解析后的域名。如果需要实现带或不带www都能访问到网址,则建议同时添加一个主机记录为www的解析。

Tips:

这里注意一下:因为买域名的同时会有一个企业邮箱,Aliyun会默认生成邮箱的解析记录。

其中记录类型有txt和mx的,会影响到CNAME类型的解析。

阿里攻城狮大佬讲得很清楚了,所以删除TXT和MX类型的解析就好了。

为仓库(你的名字.github.io)添加CNAME文件

在仓库页面点击Create new file,创建一个新文件;

文件名为CNAME;

内容为刚刚申请的域名goileolee.top

Tips:

没有www,表示解析到

请求流程为:

--> -->

至此,完成绑定!

写在后头

现在已经可以通过访问自己的专属域名来打开指定网页。

我们的目的是搭建个人网站,不过,网站如何设计得需要前段技术HTML、CSS、JS,这就触及到我的知识盲区了。。哈哈,别急这里提供两种方式。

1、跳转到已有的博客

<script>

href="";

</script>

2、运用GitHub上开源的框架

在GitHub上搜jekyll、hexo即可。

我的站点用到的开源主题是基于Vno-jekyll框架的更改,我自己做了点修改,加了目录和关于两个页面。

无需代码!从零开始DIY个人网站,将免费贯彻到底

此前曾提过,我近期沉迷于用无代码的方式建设个人网站,还立下Flag,说一定会更一期入门版的DIY教程。拖了许久,我今天终于带着56张图片来交差了……

建设无代码网站的方式有许多,我好友用的是Squarespace,效果相当出彩,我因为有博客的缘故,用的是WordPress。其实我觉得市面上应该有不少类似的工具,随便选一家应该都有相似的效果。

刚开始时,我因为不熟悉各种模块,用无代码版建网站时很憋屈。因此,我转头用上了WordPress的.org版,吭哧吭哧地折腾了几天,幸而效果还不错。后来不甘心于建个网站都比别人艰难,于是又研究回了WordPress的.com版。

近日又折腾了许久,总算对无代码版网站的建设有了得心应手的感觉。本次更的就是这个版本的教程。

一、建设个人主页

WordPress有多个语言版本,我刚开始时跳转的中文版,刷新几次后莫名就跳回了英文版,但我对比过多语言的后台,其实大致都一样,主要是语言以及一些社交软件及支付方式方面的区别。以下截图来自于英文版。

我是从注册新邮箱开始做的教程,不过后来一想,也不会有什么人没有电子邮箱了,这一步干脆略过。直接在搜索引擎搜“WordPress”,随后进入到Wordpress.com的网站建设指引,接着会出现以下界面,我选的是免费版。

接下来,输入自己的任意一个邮箱地址,拟一个用户名,以及设定密码。

建立WordPress账号以后,跳转到的是域名界面。这个区域可以使用自己已经拥有的域名,也可以买一个全新的域名,不过为了将免费进行到底,我不打算在域名上花钱,就随便想了个名字。以后要是想要有个好域名,也可以随时添加或更改。

作为一个起名废柴,我把魔兽世界里的各个主角的名字都想了一遍,最后选定了风元素领主奥拉基尔,于是用了windlord作为站点名称的关键字。随后在各种示意例子中,我选择了免费的网址。这时候,这个选定的网址可以专门存下来,之后经常会用到,并且在很长的时间里,这便是自己网站的网址了。

选定了域名,自然就开始了正式的建站之旅。网页将跳转并自动进入到建设网站的后台。其中“Name your site”这个紫红色按键就是进入下一步的关键入口,随后的步骤,就如右边被我用红色线条框起来的差不多。

就如先前所说的那样,我将我的新网站,起名为Windlord,意即“驭风者”,还随手写了句标语:The rider of the wind element。

给网站起名后,就到了最重要的一步:编辑主页。同样是在紫红色按钮处进入。

编辑主页的时候,会如下图一般,出现一些讲解页面,看一看还是很有必要的。不看的话,其实也不影响我之后讲解的步骤。

我在主页编辑页面,随意选了一个风格,其实也可以选空白页或者其他风格。但我一直认为,建网站从最容易的地方开始,出成果越简单,成就感就来得越快,也就有更多的动力去折腾。

除了主题图片可以进行编辑以外,网页下拉后是博客的最新更新示例。事实上,就一个网站而言,这些内容显得太少了,就像个博客的主页一般。不过WordPress是靠博客起家的,有这个毛病也无可厚非。

我随意看了下,认为最起码还是要加些相册或者合辑,于是我从页面左上角的“+”号处,添加内容。这个按键进去后有很多内容可以选择,其中,“Blocks”是一些固定模块,比如段落,比如题目,这个操作跟做PPT有异曲同工之妙。但我选择的是右边的“Patterns”,里面有很多已经搭配好的内容,我选了一个带四幅封面图的相册。

相册添加成功后是显示在整个主页的最末端,但我想迁移到比较前面的位置。点击这个相册中间位置以后,前面的两个相册的左上角会出现一个编辑小框体,小框体里的第三个位置有向上与向下的箭头,一直点击往上的箭头即可。

前两个相册移到了首页图片的下方,随后我将后两个相册也移了过来。于是,主页变成了主题图片(可跳转)、四个相册(可换封面但不可跳转)、三个最新的博客,以及这个主题自带的“Content”模块。

到了这个时候,如果想要加相册或者图片显示,或者任意想要的模块(比如音乐或者视频),就都可以通过左上角的“+”号来继续,不过作为示例,我打算把这个页面直接发布。一般来说,官方是不建议在网站没有做完的时候发布的,但我认为发布后可以问问亲朋好友,让他们给一些建议,所以发布了比较方便一些。发布的按钮在右上角。

点击发布按钮后,WordPress看起来还是想要再努力一把,于是又出现了诱拐买域名或者定制会员的行为。不过我还是相当坚定地选择了免费版。

至此,一个简易的网站算是正式发布成功了,如果单纯就是玩玩,可以开始往里面写一点内容,算是有了个自己的网站雏形了。

二、网页跳转

真正的网站肯定还是有着更多的功能跟栏目的,所以在发布以后,网站需要开始设想要多少个栏目。我在这个示例里,计划将网站分成主页、工作、生活、关于这四个栏目。所以在“主页”的基础上,我还需要建设一个“工作“页面、一个“生活”页面、一个“关于”页面。

建设新的页面时,从屏幕的左上角选择带有“W”字样的WordPress的logo。随后在左下角点击“Add new page”,增加一个新页面。

新的页面打算讲诉“工作”相关的内容,毕竟是个人网站,所以展示做过的项目是比较好的做法。先在“Featured”里选择,这个区域有大家比较喜欢用的模板。

我选择了默认里的Portfolio,这是一个页首是幻灯片页面内有多个项目可以编辑的形式。

把“Portfolio”改成了“Work”,随后点击右上角的“Publish”发布。

发布完页面后,继续新建页面。

新建的页面计划讲诉生活方面的内容,因而选择了“Gallery”里面的模板。

改名为“Life”,并发布。

同样的,发布后继续新建页面。

本次新建的页面是个人资料页,所以选择了“About”里的模版。

改名并发布。此时一共新建了三个页面。作为示例是已经够了,如果有需要,还可以建设更多。我很好奇,有没有可爱的“小傻子”闲着测试一下新增成千上万个网页要花多久时间。

三个页面建设完毕后,选择“Dashboard”,回到个人后台。

后台管理的左侧有非常多的功能,有空可以探索下,但此次,我们主要是来编辑菜单的。菜单编辑的按钮在页面右下角,主要目的是把新建的网页显示出来。

进入菜单编辑页面。

选择自动呈现的“Primary”。

在Primary这个菜单里,选择“Add Items”。

右侧会出现 Pages,里面就是主题自己带的,以及刚刚建好的所有页面。把新建的三个添加即可,它们会出现在左侧菜单栏里。

添加页面完毕后,选择“Reorder”进行排序,上下箭头是上下顺序,左右箭头是子集母集包含关系。

排序完毕后可以看到,菜单栏已经显示在主页的上方。网站建设又告一段落。

三、丰富个人网站

从菜单编辑的地方退出来是比较麻烦的,我一直没找到比较合适的返回键。私以为,这个交互有点麻烦。我通常是把顶上的地址栏删得只剩下Wordpress.com,就会回到自己的后台。继续选择主页编辑。

这时候可以先用预览来看一下网站,也可以用手机打开自己的个人网站网址,看看有什么疏漏。

比如这个示例网站,首页跟栏目都做得差不多了,主题图片可以换掉也可以不换,里面的内容自己想文案,替换掉里面的链接,随便导到哪里去都可以。

但往下翻,会发现,新建的四个相册跟主题图片紧贴着,非常难看;并且四个相册只能换封面图以及改改文字,没有任何可点击的地方。这是两个需要处理的问题。

处理第一个“两个区块紧贴”的问题非常简单,要么试着手动挪,要么添加一个“Heading”。

我选择了最简单的。点击左上角的“+”号,在Blocks里选择“Heading”,并且不曾输入文字。结果则会如下图一般,Heading自动将主题图片与相册分开。

处理第二个“相册不可跳转”的问题有许多解决方案。其中,这些相册根据用途的不同,可以跳到各指定位置或各种页面,甚至是之前新建好的三个页面的指定位置。但为了方便举例,我计划新建一个页面。

这个新页面我选择了Gallery里面的一个模板,图片将呈现平铺形式,并且左侧会有一些关于这个相册的简介。

将页面名字更改为相册名“Brice”,并点击发布。

发布页面确认时,在右侧把该页面的链接复制下来。

随后点击左上角logo,回到后台管理页面。

选择右下角的编辑主页按钮。

选定“Brice”字样,在小编辑框中选择右三的链接选项。其实年份也可以自动分类,只是这里其实没这个需求。

将复制好的链接,输入到链接框体中,按回车键确认。

此时,“Brice”颜色自动改变,下方有横线,已经成功添加了新键的网页链接。点击右上角“Update”后,用个人网址进入自己的网站,点击“Brice”即可跳转(编辑页面及预览页面基本无法跳转)。

这个区域其实还可以设置成图片中带文字的模式。编辑框体中,方框内带a的图标即可做到。很多人还喜欢将图片(无论有无文字)设置为跳转链接。这个操作只需要点击图片,并在链接框体内加入刚刚复制好的页面链接即可。

现在,无论是这个相册的名字,还是这个相册的封面,都可以通过点击跳转到另一个页面了。其余的三个相册用同样的方式添加新页面及链接即可。其他任意的文字也可以用这个方式进行跳转。

更新网站后,登陆个人网站(非编辑页面),即可得到如下这般的网站页面,剩下的,就是把这个网站的图片及文案,全部更新成自己的内容即可。每天做一点,就可以得到一个很棒的网站。

后记

事实上,无代码建设的网站可以实现的功能还很多,包括网页联系、下订单、费用支付等。做更多的功能也并没有想象中的那么复杂,基本上都是添加模块、页面,链接等便可做到。

个人网站或者个人博客,需要经常花费时间去打理,有做个人作品集需要的人很值得拥有。也非常希望能看到这里的朋友,可以一起来探讨更多的无代码网站建设,多多联系,多多交流。

使用Github做一个完全免费的个人网站(步骤很细)

首先,我霸都傲天申明绝对是完全免费,不会在文章中推销什么云服务器,虚拟主机等。而且操作步骤上手简单,即使非IT人员也很容易实现。

局限:只能是静态网站的个人网站
面向读者:所有人包括非IT人员

首先如果你无法理解“静态网站”的话,那么相信我,静态网站就可以满足你大部分个人网站的需求。其次这篇文章更多的是面向非IT人员,因为我写这篇文章的原因是我的一个同学的故事:

我同学小A是律师,他想把自己处理过的一些案件记录在自己的个人博客中,他已经注册了公众号。但是他始终觉得有个网站或者个人博客会显得专业一些,而且还可以展示自己的个人履历,把这个网站链接放在公众号里面会显得跟专业一些。“好吧,我明白了~”

而且学会自己搭建一个静态网站是一个很酷的事情,你可以做一些很漂亮的宣传页,或者表达自我主张的个人博客,或者在我以前的文章里面给别人做一个网页版生日祝福or纪念日等等。

所以开始吧~

前言

首先我们要用到的工具是著名的开源社区Github,我们做的静态网站最终要托管在上面,这个功能叫做“Github Pages”,是一项免费的静态文件部署服务。

虽然Github是国外的网站,但是在国内可以访问并且速度还不错!

有人担心,如果以后Github被墙了怎么办?
放心,即使被墙了,你学会如下的操作依然可以在类似的国内平台,例如码云等1.申请Github账号

(如果有账号请直接登录然后跳转到教程下一步)

访问Github,点击SIGN UP按钮。(Sign in是登录的意思,应该都很好理解)还有Github是全英文的,没有中文的哦亲,但这不影响我们使用的。

注册很简单,只需要用户名,密码,邮箱即可,不需要手机号。(对了,用户名用一个酷一点或者有意义一点的,因为它会出现在你的网址中)

注册填写Github用户名密码邮箱

接着,Github会问你是否需要付费使用。这里选择不用,因为Github提供的免费服务已经能满足大部分人包括开发者的需要了。付费服务主要是面向团队以及企业。

后面还会有一些步骤,大概意思就是问你想用Github做什么,你对Git的熟练程度,(感觉像是moba游戏新手调研都会这么做)因为Github网站迭代的原因可能会稍有不同。比如笔者这里试的时候是这样子的。

然后Github会给你注册的邮箱发送一个确认链接,请点击链接确认,不激活的话是无法正常使用Github的服务的。这个是Github的反爬虫系统。(题外话:Github的反爬虫系统很强很强!)

如果收件箱没有看到,那么不用想了,一定在垃圾箱里面!

到这里我们的注册就完成了。

2.创建一个仓库

接下来我们要创建一个仓库,仓库就是保存代码的地方,也就是保存网站的地方。这里我们做一个最简单的网站:个人简历。

1,首先点击“Your repositories”,查看个人全部仓库,第一次肯定是空空如也啊。

2,接着我们新建一个仓库

3,这一步很重要,仓库的名字不可以随便写,必须是 <我的名字>.github.io

比如我注册的名字是 zhihu1,所以这里我创建的仓库的名字必须是 :

4,接着下一步页面会比较复杂,你会看到一大堆看不懂的东西,其实那些事git操作提示。如果你熟练git的话就知道了。不过我们不管这些,我们只需要创建一个新的文件就行啦!

5,新文件的名字不可以乱写哦,必须是 index.html,这里大家都一样都写这个。(题外话:静态http文件托管服务的默认访问文件就是index.html)

可以参考笔者的内容如下,改成你自己的介绍哦~

<p>Hello 大家好</p><p>我是霸都丶傲天,这是我的个人网站。 </p><p>很高兴你来到这里, 你可以在以下的网站找到我</p><ul> <li> <a href="">知乎</a> </li> <li> <a href="">我的博客(已经不更细了,现在在知乎写文章)</a> </li></ul>3.查看网站的网址

到这里,我们一个最简单的个人网站的代码就完成了。接下来最重要的一步,我们需要知道网站的链接啊,只有这样,别人才能访问我们的网站呀。

1,点击settings

2,然后往下翻找到 Github Pages, 看到绿色提示,后面的链接就是你的网站地址了,打开看看吧~

Tip:很多老铁评论说这里看不到绿色框框,没有URL。那是因为你的仓库名称与用户名不一致,不过不用担心,也是有办法的,看下面的第二张图片。

第一张图片 第二张图片(这里我设置成小图防止误导正常老铁, 点击可以放大图)

3,点开网站看一下

完成!

其实细心的同学会发现,其实我们的网站地址和我们写的仓库名称是一样的,是滴!而且非常有个性的是我们的名字还出现在网站地址中。

笔者的Github仓库&&网址:Git仓库地址

本来到这里这个教程已经结束了,但是我想有的同学肯定是不满意的。首先你的这个网站做的太简陋了吧,不是我想要的那种!

那好,其实学会这个教程就可以做下面两个非常炫酷的小站点了,一个是生日祝福,一个是爱情纪念日。都是很有意义、很温馨的题材哦:)

霸都丶傲天: 改改数据,为心爱的人做一个超具创意的网页生日祝福吧~霸都丶傲天:5分钟做一个免费的网页爱情树,快快学习发给自己的女朋友吧(微信QQ都可以查看哦)^_^霸都丶傲天:告白气球? 圣诞节的创意网页小礼物不了解一下么?

所以是这样子的,我没有演示复杂的网页是因为它需要写的代码太多了,许多第一次接触Github的老铁,或者以前从来没接触过HTML的人就会有点陌生。

是的,这里我们提到了HTML,它就是网页的描述语言,对HTML感兴趣我推荐这些最好的免费自学网站。

国内的w3school (国内的w3School这两年商业元素越来越浓厚了,不怎么推荐了)国外的w3school 网络条件好,并且英语还不错的同学建议看国外的但是业界最专业的的自学网站应该是这个 (Mozilla基金会出的mdn文档,绝对的大牛出品,质量把控)

后面一段时间,我还会出一些更高级的个人网站教程。所谓更高级不是说写一大堆代码,而是如何使用业界非常流行的静态网站生成器来做个人网站。静态网站生成器的英文说法叫做“static-site-generator”。我们只需要关注创作内容即可,这些工具可以帮助我们把网页做的非常绚丽,非常的awesome!

Github上面有专门的相关主题,并且非常火,这里我给个截图

Github上面有超过1500个静态网站生成工具最后,这篇文章的初衷还是写给对编程知识不懂但是又感兴趣的老铁,以及刚上大学计算机系的后起新秀,做一个个人网站可以很大程度提高自己学习编程的动力,所以我觉得这是很有意义的一件事情。

感谢评论里的老铁各位的建议,有些老铁看了可能会疑惑,我来解答吧:

wordpress确实是业界做博客类网站,或者也叫内容型网站的首选。它适合不会编程但是又想做出很绚丽博客的人,它有很多模板可以选择,每一个模板就是一种风格样式。它不在本次文章的推荐中是因为,使用wordpress需要购买主机或者wordpress专用虚拟主机,是需要付费的。@joey大佬提到了“用七牛,阿里之类的对象存储服务做免费的cdn静态网站”。确实在目前来看它们是比Github Pages可能更优秀的选择。但是它们有推销的嫌疑,所以我没有推荐这些,类似还有腾讯的COS对象存储,它们都有免费的额度,大概是一个月免费15GB流量,最高免费10GB文件存储。对于大部分人来说这些是足够的了。但是它的缺点也很明显,未来可能需要付费以及需要自己购买域名(当然你也可以使用它免费提供的域名,很长很难记!因为它看起来像这样子 Ukdalkdkl-china-shanghai-1。xxx。com )

当然如果对上面感兴趣的老铁也可以在评论里面说,我也可以出类似的文章说一下怎么做的,用起来都很方便。

最后的最后,有什么问题直接评论即可,拜拜┏(^0^)┛,楼主镇楼。

END,本文到此结束,如果可以帮助到大家,还望关注本站哦!