个人作品网站搭建复盘文章

作为一名设计师,在线作品集的集结和展示为自我的工作梳理和经验总结提供了有效的途径。

当然,最重要的是,

当你需要把过往经历传递给别人时,不需要发给别人一个很尴尬的>10GB的文件。

作为一名超酷的交互体验师,我也讨厌别人甩给我一个PDF,

然后说:你去下载吧,我的履历都在里面。(此处应有🙄️)

作为个人网站升级到2.0到老菜鸟,我梳理了下基本思路和整个流程,可供新手参考。

大咖和希望获得超酷提升的请绕道。

一、

技能准备(此指需要一定整块时间系统学习和有意识积累,并基本可看懂模块架构;如果这也没有,也没关系,方法总是比问题多的,请接着往下看):

1. 代码:基本的HTML常识,适量的CSS+Java理解,

2. 软件:Sketch,Photoshop,illustrator至少会一个,AE加分,可见即可用的Dreamweaver

提醒:

不要一味成谜于理论不能自拔,开始实践吧,这才是获得技能的唯一渠道。

二、

资源准备(此指可通过网络搜索即刻获得)

1. 域名https://www.namesilo.com/

这个有很多网站提供,大家可自行选择。这里是我用的,购买简单,域名选择丰富。

2. 主机http://www.gegehost.com/

同上,可自行选择。

提醒:

尽量不要选择.com结尾的域名,它们通常价格高于前缀相同的域名,作为个人作品集的展示,完全可以选择.net或者.cn结尾的。当然如果你执着于.com,那就,另当别论。

三、

内容准备

1. 基本的个人履历描述

2. 作品(包括你经历过的所有有亮点的、你想展示的项目),应该有包括但不限于文字、图片、视频描述,过程记录,成品展示。

四、

进入搭建流程

基本的准备工作就绪后,就可以进入搭建流程了。如果对此想有系统了解可以移步:

http://www.w3school.com.cn/

http://www.cnblogs.com/此处带你避坑

1. 明确个人网站的主要目的和架构

因为我的网站主要目的是作为简历补充的作品展示,因此网站结构非常简单,但是重点也很明确。主要就是两块,自我介绍+作品展示。

关于网站架构搭建

如果你有较强的代码技能,那么可以尝试自己码建网站架构;

如果基本能理解代码内容又想提高效率可以去类似的模板网站寻找你需要的部分框架,然后部分合并或调整代码即可;

www.cssmoban.com

www.wordpress.com

等都可获得相关资源。

如果一点代码都不懂,可以直接找现成的模板框架,然后替换文字和图片即可。或者借助傻瓜软件Dreamweaver.

正常的网站主体基本包含如下内容:

index即为HTML文本,定义的页面的基本架构

CSS是样式表,定义html中文本、图片、链接等具体格式

JS会牵涉到网站的交互反馈等动效

Font是字体

2. 填充架构内容

这里稍微展开讲下作品展示的描述,

可以采用STAR (Situation Task Action Result)方法展现你的思路和过程及结果。

也可以重点展示思维、研究或者成果的某一方面,或者仅仅是展示很厉害的展示形式本身。

搭建作品集的工具帮手

背景图片:

https://www.500px.com/

https://1x.com/

http://www.resplashed.com/

https://www.flickr.com/explore

思路参考:

https://www.behance.net/

https://dribbble.com/

文字参考:

https://archetypeapp.com/

免费网站 Archetype 基于大量实践成功案例为你快速搭配适合一起使用的字体组合,让你的板面从标题到结尾具备一致的流畅感。

http://brandmark.io/font-generator/

整体字体大小布局纵览

颜色参考:

Google material design

Introduction - Material Design

谷歌的一套严密的设计体系统一、开放、延展有生命力,有心者可借此规则做出很妙的作品。

logo或小标:

有趣的小图标或者自己的手绘可以给作品的故事呈现增加很多生命力和让人记住的动力。

http://google.github.io/material-design-icons/

http://www.lancewyman.com/

提醒:

如果你是打算作品页面整页图片展示,

那么建议你在输出图片时严格控制大小,最好不要超过MB,否则体验感会很不好。

我在2.0版本的网站更新后,来回重新处理了图片三四次,

浪费了不少时间,都是因为这个原因。

3. 在本地搭建完成网站后,记得逐个检查下网站是否正常显示,格式调用是否正确等问题。

这里提醒,所有资源最好在一个大的文件夹下,否则在更新后,网站链接调用很容易变成绝对地址引用,而不是正确的相对引用。

4. 网站上传

这里会用到之前提到的主机和域名,当购买了主机之后,服务商会提供网站上传的软件通道及账户,然后你把网站上传到指定目录即可。以我使用的Cpanel为例,将所有网站内容上传到public-html文件夹下即可

之后可以访问自己的域名网站,看看实际效果。

提醒:

可以将整个页面压缩后上传再解压,可以减少操作步骤。

只要开始实践,逐步迭代,一切都会越来越好哦。

个人认为在线作品的重点是,所有你列出的作品集,

都必须无限的强化展示你的某方面技能,要言之有物。

这也是我个人的思维方式,去除冗余,只留下重点。

无关紧要的信息太多不但会分散自己的编写精力,而且对于别人获取重点也是妨碍。

作品集只应该是个引子,

那些幽微又有趣的故事和细节是给面对面交流者的最起码尊重。

Thanks.

xian


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,546评论 6 507
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,224评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,911评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,737评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,753评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,598评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,338评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,249评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,696评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,888评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,013评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,731评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,348评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,929评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,048评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,203评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,960评论 2 355

推荐阅读更多精彩内容