新闻详情 News details
   
杭州做网站|企业网站模板|尽在力拼建站网:响应式设计的到来对网站设计师意味着什么?
来源:做网站 | 作者:hzlpkj | 发布时间: 2019-09-28 | 443 | 分享到:
 响应式网站设计(RWD)一词在网站领域正变得越来越流行,这是显而易见的。当您在Twitter,Facebook或微博等社交媒体上搜索#响应式网站设计时,您会发现很多文章,高质量的内容和一般性演讲。
  响应式设计的到来对网站设计师意味着什么?
 
  响应式网站设计(RWD)一词在网站领域正变得越来越流行,这是显而易见的。当您在Twitter,Facebook或微博等社交媒体上搜索#响应式网站设计时,您会发现很多文章,高质量的内容和一般性演讲。这是新概念日趋成熟的现象。 Ajax(一种Web开发技术)也是如此,但是现在几乎没人在乎。

  RWD现在无处不在,甚至在杂志界也很有名。我有一个朋友,他出版了杂志,近参加了一个会议,在会议上,许多知名的新兴杂志编辑提到了未来网站开发的趋势,并谈到了响应式网页设计。

杂志编辑可能不擅长网站建设,但他们都知道“响应式网站设计”(RWD)一词。

  响应式设计正在蓬勃发展,人们创建网站的方式已经改变。随着RWD成为Web设计的常规部分,Web设计师的工作方式必须改变。因此,我们需要为响应式网站设计建立一些准则。

  1.不要停留在“软回应”中

  当用户要求您测试响应式网站时,您会怎么做?更改窗口大小,看看布局如何变化?在这种情况下,大多数设计人员或开发人员可能会使用手机或平板电脑来访问,旋转显示方向或测试页面加载速度。这是因为他们整天都在调整浏览器,并且很容易形成这种想法。但是用户是另一种存在。以用户身份访问时,您无需担心网站布局是否流畅。

您只想尽快找到所需的信息。

  因此,在这里,我想告诉您,响应式网站设计不仅需要关注布局的响应性,还需要关注网站内容的选择,而不仅仅是停留在“软响应”上。 “软响应”是指网站的线性缩放,即屏幕的大小不同。软响应还不够。设计网站时,我们还需要一个核心。根据功能,在核心周围加载更多内容。对于栗子来说,如果网站需要为IE7创建一个手机元素(例如App促销页面),那么手机元素就是您需要关注的核心。根据不同的屏幕设计屏幕或手机元素周围的其他元素。

进行合理的布局。

  2.不要投机取巧

  响应式设计很复杂。我们都希望有一些技巧或方法可以使它更简单,但实际上并没有,或者尚未发生。大多数负责开发响应能力的设计师仍然需要努力工作,以将工作流添加到新的内容交付或其他活动中。

以我的一个朋友为例。她首先在Photoshop中进行了面向PC的设计。但是在完成一些设计页面后,我希望该网站在平板电脑或智能手机上显示良好,因此我制作了一些设计图。

但是,在向用户显示结果之后,某些地方需要根据用户需要进行创造性的调整,因此不可避免地会出现新的设计图。这样,几乎有50个PSD文件。她需要花费大量时间来调整页面布局。

如果添加新设计,将花费更多时间,并且可能导致前后框架或布局不一致。建议:处理此问题的方法之一是向客户展示原型的线框。这样,您可以遵循框图并讨论布局。 ZURB的Foudation是一个很好的线框创建工具。

  3.拥抱变化,迎接挑战

  首次构建响应式网站时。我只使用了Photoshop和GoLive,但现在至少必须使用6。我仍然使用Photoshop在页面中创建图形元素,但是页面中的其他设计元素主要使用Sublime Text 2,并使用Safari浏览器开发人员iOS 6随附的工具,用于查看生成的页面元素。

此外,我还使用Codekit来编译预处理过的CSS(例如LESS或Sass),并使用版本控制工具Git设置命令行。

  响应式网页设计意味着设计上的改变。与在Photoshop中绘制整个页面相比,萨曼莎·沃伦(Samantha Warren)的样式图块工具可用于更清晰地表达视觉设计。通过在多个布局中设计视觉品牌和Web的界面元素,您还可以通过基于布局直接更改设计来创建响应式Web原型。

  CSS预处理器可以为任何响应式设计工作提供巨大帮助。简而言之,预处理器可以减少站点构建的复杂性,并减少CSS解释执行过程中多种样式的重复继承的工作。对于此工具,我个人更喜欢SCSS。当然,LESS也是一个不错的选择,并且它具有更完整的文档。

  4.记住响应式设计原则

  该网站应该能够访问任何可通过Internet访问的设备(无论是固定设备还是移动设备,无论屏幕是大还是小)并提供友好的体验。 ——蒂姆·伯纳斯·李

  HTML和CSS本身就是响应式
的。自HTML诞生以来,该网站一直试图变得更加灵活,以适应所有可以访问Internet的硬件设备。不是以前的设计师和开发人员倾向于采用固定的布局,而是现在进行了更改,而是因为在网站上强制采用固定的大小会限制其在不同设备上的用户体验。

  总结一下
  响应式网站设计是一种设计原则,可以抽象化您表达的内容。例如,NPR近已迁移到API驱动的内容模型。通过使用API提供内容,可以在应用程序和网站上形成NPR。

性能一致,只需要修改表示层。这就是响应式网站设计所具有的全部内容,弄清楚设计师想要表达的内容,并通过它来实现表达方式,从而设计出满足用户需求的令人愉悦的效果。

  这就是响应式网站设计所具有的一切,首先是用户。创建一个为用户提供服务的网站,以确保用户在任何情况下都可以轻松访问内容。成为一个可以适应小屏幕的网站仅仅是个开始。