无需代码 小白也能建个人网站【酷安】

首页 » 建站教程 » 无需代码 小白也能建个人网站【酷安】

感谢酷安老哥:Sepilly

前排提示:本图文教程面向新手小白,手把手式指点教程,因此节奏比较慢。

教程内容分为两部分,制作网页和发布网站。图文为了让小白稍微理解一下网站知识,所以这里先说阿里云OSS如何发布网页,再说如何制作网页,不用担心,内容都很简单。

OSS是什么呢?

  • 它是对象存储,直白一点说就是云盘,但实际用途并不只是云盘。
    对象存储主要用于服务器的数据文件存放,比如你使用某app时注册了账号,上传了一张头像,那这个文件就会被app服务器存放到对象存储里。
    OSS只是阿里云对象存储的名称,其他云计算平台的有所不同,比如腾讯云的对象存储叫COS等,名字略有不同但使用大概都差不多。

下面就开始教学了:

  1. 首先  点我进入官网 注册
  2. 我们需要配置好OSS这个东西,再进行网页制作。
    登录完成后,在阿里云首页左侧栏就能找到【对象存储OSS】,点进去,就能看到OSS的产品介绍和购买按钮,这里不需要进入购买,直接选择【管理控制台】无需代码 小白也能建个人网站【酷安】
  3. 接下来进入对象存储OSS的控制台界面,在左侧栏选择【Bucket 列表】,Bucket即一个对象存储容器,直白点就是一个储存空间,你一个账户可以创建很多个不同的OSS。无需代码 小白也能建个人网站【酷安】
  4. 因为还没有使用Bucket,所以列表肯定是空的,因此下一步点击蓝色按钮【创建Bucket】
    将会弹出一个窗口,主要设置Bucket的名称,地域,读写权限无需代码 小白也能建个人网站【酷安】
  5. Bucket名称随意;
    地域建议选择上海;
    读写权限得改为公共读,这样你的网站才能被别人访问。
    上图中,Endpoint即你的OSS访问网址,创建好OSS后,通过这个链接就能访问你这里存放的文件。
    信息都填好后,点确定即可创建。
    创建完成再回到Bucket列表就能看到它了。无需代码 小白也能建个人网站【酷安】
  6. 接下里,
    点击刚刚新建的Bucket名称,即进入配置页面
  7. 这是我现在在用的Bucket,因此右侧存放了一些文件。到这里关于Bucket的配置就好了。
    那么小白看到这里可能心里还有点不太明白,到目前为止,教程所做的东西干什么。这里说一下对象存储的一些基础小知识吧
    开头说了,对象存储就像是一个云盘,但不同的是它存放的文件,默认都具备一个绝对路径链接,也叫直链(即直通文件的链接)。通过这个绝对路径,其他人就可以直接在线访问/下载这个文件。网页文件即html格式,那么把它存放在这里面,通过浏览器打开时,浏览器就能识别这个网页并将它呈现在屏幕上,就是这么简单就实现了网站的基础,接下来只需要制作好网页再上传到这里,网站就完成了。值得一提的是,我们所访问的网站如百度首页,www。 Baidu。com,它的后缀并没有.html的文件名,那么为什么浏览器访问它也能打开网页呢?那是因为,当浏览器访问这个地址时,如果链接里后缀没有文件名,那么浏览器会默认补上”index.html“,百度首页的页面其实是www。 Baidu。com/ index.html(14。215。177。39 /index. html)。
    同样的这个规则也存在于阿里云OSS里,阿里云Bucket的默认首页也是你的OSS链接/index. Html。不止是index,还有404页面也是如此(OSS链接/404. html)。只要把做好的网页文件,命名为index.html,上传到OSS里,就可以直接访问首页了。
  8. 那么接下来制作网页,你只需要把首页的页面后缀名改成index.html,再上传到OSS根目录中,那通过OSS的网址直接访问就能进入你的网站了。

网页的制作

小知识到此完毕,那么接下来来说说如何制作网页吧。
首先不得不提一下很废话东西,网页本质是什么。
如果在电脑上新建一个记事本的文本文档,如1.txt,如下图

无需代码 小白也能建个人网站【酷安】

写完后记得保存,然后右键点击这个文件,选择浏览器程序打开,或者把这个文件拖到你电脑的任何一个浏览器上。
通过浏览器打开文档后,我们能看到刚刚所编辑的文字显示到了浏览器上。

但TXT纯文本文档是不具备任何格式的,甚至连字体大小颜色都没有,这样所制作的网页会非常空乏无需代码 小白也能建个人网站【酷安】,完全不能满足于普通使用,因此就有了html代码。
Html代码的本质是一种标记语言,并不属于编程代码。它的作用是把内容文本进行标记,如标记这个文本是标题,字号是多少,颜色是什么;或者标记了这个元素属性是按钮,而不是图形;那个是带链接的文字而不是普通文本。Html代码的写法几乎就是背单词,没有任何逻辑运算,学习起来其实也很简单。

但即便如此,对于刚入手的人来说,或者对于代码不感兴趣的人来说,编写html仍然是一个难题。我的确想要一个网站,但我并不想花时间精力去学习对自己完全不必要的html技能。
我所使用过的方法有以下:
Adobe XD + html导出插件;
Office Powerpoint 2007(可另存为html);
使用建站平台(建站之星,凡科,等)做好网页后,使用浏览器另存为页面;
下载网页模板(但还是要改代码内容)
Mockplus(可以导出html,软件主要用途类似XD)
Adobe Muse
WebPageMaker(功能有点缺乏))
但上述办法实际上都存在各自的缺陷
无需代码 小白也能建个人网站【酷安】无需代码 小白也能建个人网站【酷安】无需代码 小白也能建个人网站【酷安】

推荐这个做网页,简单易学

WYSIWYG Web Builder制作网页

 

未经允许不得转载:作者:qq123, 转载或复制请以 超链接形式 并注明出处 啾啾的小破博客
原文地址:《无需代码 小白也能建个人网站【酷安】》 发布于2020-04-09

分享到:
赞(0)

评论 抢沙发

7 + 7 =


Vieu4.5主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册