域名城

标题: 个人网站设计的五大要点 [打印本页]

作者: windhome 时间: 2016-9-8 13:54
标题: 个人网站设计的五大要点
　　个人网站设计首先要想到的就是我要设计一个什么行业的网站，才能去想象我要把网站设计成什么样，接下来是个人网站设计的五大要点:

　　1、个人网站设计之构想
　　写下需要应用到的样式和元素，创立一个简易版的指南帮助你保持专注并避免偏离主线。对于我来说在坚持想法的同时对外界的反馈保持开放的心态是最重要的。
　　我的第一个想法是：网站整体要简洁，带着几分色彩和一些特殊的动效。听上去再平常不过了！
　　另外我还想把我的个人经历作为一个元素和我前些年与我所认识的最棒的UI设计师 Jürgen Hassler 共同创立的工作室合并在同一个模块中。

　　2、个人网站设计之网页架构
　　网页内容应该突出个人能力和经历。不过这个基本上不是很难，因为没有客户或者第三方的干涉，但是收集和编写这些东西得花上一些时间。
　　在我看来网页的导航栏应该是在任何时候都能看见和点击的。从这一点来一说汉堡包导航（Burger-navigation）对于桌面设备毫无疑问是不可行的。而在移动设备上，内容是可以通过滑动进行阅读的，所以更没有必要通过点击汉堡包图标（Burger-icon）来浏览整个网站。
　　个人网站设计展示什么项目对我来说不是很难—我就挑自己喜欢的那些。但我不是那种可以一下子写很多东西的人或是作家。所以在下班或是设计过程中我和一位文案一起修改文字部分。

　　3、绘制线框图
　　在开始绘制的时候先从导航部分下手不失为一个好方法。从这一点来说，尽管只是桌面设备的线框图，但不同设备都应该在考虑范围内。在个人网站设计的时候，往往会绘制线框图而感觉烦恼。其实大可不用。
　　版本1
　　很长时间以来我都习惯以出现在两侧或向上滑动的与访问者视线平齐的 off-canvas 导航来构建网页。第一个版本就用了这个想法，但很快就放弃了，因为虽然导航是可见的，与内容搭配也比较有冲击力，但并没有给出任何有意义的信息。
　　版本2
　　我非常喜欢使用侧边栏导航，但放在我的个人网站中显得太平凡了。所以还是继续看看有没有什么新想法吧。
　　版本3
　　经典的横向导航可以在几乎任何场景中使用，并且易用性非常棒，但会占据一定的高度。从另一个方面来说你需要设置文字的最大宽度来给左右两侧留有足够的留白。

　　4、迭代设计与原型制作
　　在构建了网页雏形之后就是迭代设计了。迭代应该考虑到过去的设计流程和所有版本中经过斟酌的最有用的部分。这是个人网站设计的重要注意的。
　　我们过了好几遍框架，讨论了许多有建设性的解决方法，当然也包括如何建立灵活的设计流程。
　　虽然这是我第一次尝试设计网站，个人还是把导航部分的内容变成了可点击的原型，这是能在任何早期阶段消除疑虑的做好的事情之一。
　　如果觉得原型并不是非常有必要的话，可以试试 Semplice 之类的 framework 工具来测试哪些想法是可行的。

　　5、添加互动、转换和完善细节
　　从一个想法变成一个实物的过程是非常痛苦的，在这事儿上要消耗很多想象。但现有的页面可以作为非常棒的参考来进行讨论。
　　利用线框故事版可以视觉化的呈现想法，巧妙的展现在同一区域中的动画效果。Roland 将原型进行了扩展，所以我们可以直接点击操作进行检查。
　　在最后的开发阶段我把注意力集中在细节上。最终这个网页由一个简单的扁平的页面变成一个不仅仅呈现我的能力和经历也是我在现实生活中的真实写照的极具个性的个人网站。

作者: a85625813 时间: 2016-9-12 10:08
支持，我认为你太厉害了

作者: a85625813 时间: 2016-9-13 15:36
完全支持你，大家都会顶你

欢迎光临域名城 (https://club.domain.cn/)