写给设计师的个人网站搭建指南（一）：从域名到网站

对于设计师来说，拥有一个像下面一样的个人网站是发挥创意，展示能力极好的机会，但面对陌生的代码、域名的购买、服务器的配置、DNS 的迁移等等繁琐的过程，总是会让许多设计师望而却步。2. 搜索你想要的域名，推荐可以直接使用姓名的拼音、英文名或者随便你喜欢的域名，买它！（如果不是热门或者价值很高的域名，一年价格大概在 100 左右，但一般第一年会打折，所以会很便宜）此时我们仅有域名但还没有内容，就像拿到了门牌号但房子还没有改起来，我们该如何把门牌号挂到我们的房子上呢？接下来我们先从如何盖房子说起。

2. 选择适合自己的建站方式我们大体有三种建站选择

1. 一是使用 Wordpress 、Ghost 之类的专门用来做博客的服务，它的好处是对于设计师来说可以基本不用关注代码，直接用现成的模版加可视化编辑器就可以搭建出一个还不错的网站，而且自带博客系统，当然也可以用来做作品集。
   

   但弊端是网站的设计我们不能完全把控，很大程度上依赖模版本身的初始设计和可扩展性，即使可以自定义，过程也是很痛苦的。

3. 三是 Jekyll 、Vuepress、Hexo 等静态网站生成器，这些框架可以帮助你快速构建可部署的静态网站，包括你以 Markdown 写的博客文章。但会需要 HTML、CSS、和一些基础的对技术和代码的了解，因为虽然他们也有主题，但是如果自定义的话，需要直接去改动代码，但这种方式就可以实现理论上可以实现的你的所有设计构想。

我的个人网站：zuozizhen.com 和 figmachina.com 就是分别使用 Jekyll 和 Vuepress 构建的，接下来我们主要分享的如何以此种方式跑通整个流程如果使用命令行来操作 Git 也使很多设计师头疼，所以我们需要一款图形化界面的Git管理工具，我在这里向大家推荐开源的 Sourcetree，会使我们在执行 Git 相关的命令时会更加便利。

接下来我们要做的是建立一个仓库（repository）：

1. 注册一个 Github 账号，登陆后点击右上角 + 号，在菜单中选择 New repository：

3. 仓库已经创建好了，然后我们需要做一个叫做 克隆（Clone） 的操作，用来把代码放到仓库里，我们打开 Sourcetree ，在新建中找到 从 URL 克隆。4. 回到 Sourcetree ，点击 从 URL 克隆，在弹窗中将之前复制的地址粘贴到 源 URL 中，点击克隆（目标路径为克隆到本地所在的文件夹路径，可以自行选择）：6. 成功之后，回到 Github 上查看，你会发现仓库中有了内容，这就是我们刚刚提交的个人网站代码，以后代码或文章的更新也是通过这种方式来进行。由于安装 Jekyll 和修改网站代码本身需要一定的代码知识，所以跳过了安装 Jekyll 本身的过程，大家可以通过 官网上的教程 或者在网站自行搜索相关资料来完成这步。

2. 登陆成功后点击 New Project：4. 确认信息无误后，点击 Deploy：6. 回到 Godaddy，在 我的产品 页面，找到域名，点击管理 DNS：我们现在已经把门牌号挂在了房子上，网站的整个搭建部署包括域名的配置就已经全部完成，现在在任何地方都可以输入域名来访问你的个人网站了。这里的流程图可以帮助大家再次梳理下整个流程：今天主要是了解流程，中间跳过了安装 Jekyll 和具体构建代码的过程，因为这需要大家有一定的代码知识和对于技术的基本了解，当然你可以尝试跟着网上搜索出来的教程来一步步的操作，同样也是很好的学习过程。

下一篇文章《写给设计师的个人网站搭建指南- 代码该怎么学》，我会和大家分享设计师学习代码的整体思路：从哪里开始，要学哪些模块，在什么地方学习等，帮大家理清思路，对未知的事物有更清晰和系统化的了解。