《响应式Web设计全流程解析》一1.3 专家的入侵

本文涉及的产品
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
简介:

本节书摘来异步社区《响应式Web设计全流程解析》一书中的第1章,第1.3节,作者: 【美】Stephen Hay 译者: 余果 , 等 责编: 赵轩,更多章节内容可以访问云栖社区“异步社区”公众号查看。
1.3 专家的入侵
很久以前,每个公司只要一个人就可以完成绝大多数的网页设计,不包括项目管理、后台开发,只包括视觉设计、交互设计和常见的前端开发。

1998年,前端开发主要的工作就是写写HTML,也有些Flash要做。我最早的员工都不知道什么是CSS,还得我来给他们解释。那时候还有很多用CSS做不了的事情,而JavaScript还完全名不见经传。

那时候设计一个网站大概是这样的:在Photoshop里画好设计稿,切图,把它们放回HTML,用Photoshop渲染的内容替换对应的部分,不论这个网站是小的静态宣传站还是CMS的模板站。


1

当开始系统化、模块化地思考网站的视觉架构时,我们用最简单的线条,称为线框或者图表,来描绘网站。即使文档型网站也有交互方式,而这些特性都需要在设计流程中沟通清楚。


2

在我的记忆中,从2002年开始,事情有了转折。当项目足够大,网页上的工作量足够复杂时,我们会在一两个前端体验上专业化。许多设计师还在写HTML,而网站图表和线框是信息架构师的工作范畴。像“Jame Garrett的视觉词汇表”这样的工具给了我们一个方法,可以根据基础交互实时查看网站结构。随着交互形式的变化,从客户端和服务器的交互到更小而具体的客户端侧交互,专家们使用了大量细化的线框来展示。这些线框逐渐变成了没有颜色和图片的网页,有时在设计稿里为了客户可以点击,在线框里配上链接可以互相跳转。

不久之后我们意识到,继续做一个全面的网页设计师很难了。网页设计领域诞生了信息架构、交互设计、视觉设计、前端开发等细分子领域,几年后又相继出现了更多子领域,比如每个网站都有强需求的内容运营和时常含糊的用户体验设计。这时,作为交互设计师重要的产出之一,线框已经足够细化,而视觉设计师的职能也相应有略微改变。即使在笔者成文的今天,在很多网站设计和开发公司,许多视觉设计师仍遵循传统瀑布流程,跟随着交互设计师的脚步。这意味着,视觉设计师拿到手的是复杂的线框图,并且是由客户看过并且认可的,没办法改动。这让他们的工作简化成了令人尴尬的“根据编号涂颜色练习”。视觉设计师被要求在线框的基础上做设计——改改字体排版、按网格排整齐、上色并画出图像——基本可以概括为在线框的底子上做点小修饰。


3

在这种情况下,真正的设计工作是由交互设计师完成的,他们才是解决问题的人,而视觉设计师只是按照线条上色罢了。这看上去很不公平,因为不解决问题的设计师仅仅是在做装饰,而做装饰不是设计。

相关文章
|
14天前
|
SQL 安全 数据库
Python Web开发者必看!SQL注入、XSS、CSRF全面解析,守护你的网站安全!
在Python Web开发中,构建安全应用至关重要。本文通过问答形式,详细解析了三种常见Web安全威胁——SQL注入、XSS和CSRF,并提供了实用的防御策略及示例代码。针对SQL注入,建议使用参数化查询;对于XSS,需对输出进行HTML编码;而防范CSRF,则应利用CSRF令牌。通过这些措施,帮助开发者有效提升应用安全性,确保网站稳定运行。
28 1
|
1月前
|
前端开发 开发者 容器
【布局革命!】Flexbox与Grid双剑合璧:解锁Web设计新纪元,让响应式界面瞬间焕发光彩!
【9月更文挑战第1天】本文通过问答形式深入探讨了Flexbox和Grid布局的特点与应用场景。Flexbox专为单轴布局设计,适用于响应式导航栏和列表;Grid布局则适用于二维布局,可精确控制元素的位置和大小,适合构建复杂的内容区域和仪表板。文章还提供了示例代码,帮助读者更好地理解和应用这两种布局方式,以创建高效、美观的Web界面。
66 9
|
1月前
|
前端开发 安全 Java
技术进阶:使用Spring MVC构建适应未来的响应式Web应用
【9月更文挑战第2天】随着移动设备的普及,响应式设计至关重要。Spring MVC作为强大的Java Web框架,助力开发者创建适应多屏的应用。本文推荐使用Thymeleaf整合视图,通过简洁的HTML代码提高前端灵活性;采用`@ResponseBody`与`Callable`实现异步处理,优化应用响应速度;运用`@ControllerAdvice`统一异常管理,保持代码整洁;借助Jackson简化JSON处理;利用Spring Security增强安全性;并强调测试的重要性。遵循这些实践,将大幅提升开发效率和应用质量。
54 7
|
11天前
|
Web App开发 编解码 前端开发
构建响应式Web应用的最佳实践
构建响应式Web应用的最佳实践
22 0
|
1月前
|
前端开发 JavaScript 开发者
现代前端框架激烈交锋,高效响应式 Web 界面的归属扑朔迷离!
【9月更文挑战第6天】本文通过实际案例,比较了主流前端框架 Vue.js、React 和 Angular 的特点与优势。Vue.js 以简洁的语法和灵活的组件化架构著称,适合小型到中型项目;React 强调性能和可扩展性,适用于大型应用;Angular 凭借全面的功能和严格架构,适合企业级开发。开发者应根据项目需求和技术栈选择合适的框架。
34 0
|
2月前
|
API C# 开发框架
WPF与Web服务集成大揭秘:手把手教你调用RESTful API,客户端与服务器端优劣对比全解析!
【8月更文挑战第31天】在现代软件开发中,WPF 和 Web 服务各具特色。WPF 以其出色的界面展示能力受到欢迎,而 Web 服务则凭借跨平台和易维护性在互联网应用中占有一席之地。本文探讨了 WPF 如何通过 HttpClient 类调用 RESTful API,并展示了基于 ASP.NET Core 的 Web 服务如何实现同样的功能。通过对比分析,揭示了两者各自的优缺点:WPF 客户端直接处理数据,减轻服务器负担,但需处理网络异常;Web 服务则能利用服务器端功能如缓存和权限验证,但可能增加服务器负载。希望本文能帮助开发者根据具体需求选择合适的技术方案。
68 0
|
2月前
|
Java 缓存 数据库连接
揭秘!Struts 2性能翻倍的秘诀:不可思议的优化技巧大公开
【8月更文挑战第31天】《Struts 2性能优化技巧》介绍了提升Struts 2 Web应用响应速度的关键策略,包括减少配置开销、优化Action处理、合理使用拦截器、精简标签库使用、改进数据访问方式、利用缓存机制以及浏览器与网络层面的优化。通过实施这些技巧,如懒加载配置、异步请求处理、高效数据库连接管理和启用GZIP压缩等,可显著提高应用性能,为用户提供更快的体验。性能优化需根据实际场景持续调整。
50 0
|
2月前
|
Java 数据库 API
JSF与JPA的史诗级联盟:如何编织数据持久化的华丽织锦,重塑Web应用的荣耀
【8月更文挑战第31天】JavaServer Faces (JSF) 和 Java Persistence API (JPA) 分别是构建Java Web应用的用户界面组件框架和持久化标准。结合使用JSF与JPA,能够打造强大的数据驱动Web应用。首先,通过定义实体类(如`User`)和配置`persistence.xml`来设置JPA环境。然后,在JSF中利用Managed Bean(如`UserBean`)管理业务逻辑,通过`EntityManager`执行数据持久化操作。
38 0
|
2月前
|
开发者 Java Spring
JSF 牵手社交登录,如魔法风暴席卷 Web 世界,开启震撼便捷登录之旅!
【8月更文挑战第31天】在互联网时代,便捷登录成为用户的核心需求。社交登录凭借其便捷性、安全性和社交化的特点,在各类Web应用中广泛应用。JavaServer Faces(JSF),作为一款流行的Java Web框架,能够轻松集成社交登录功能,显著提升用户体验。本文详细介绍社交登录的优势,并提供两种JSF集成社交登录的常见方法:一是利用Spring Social等第三方库简化开发;二是自行实现社交登录流程。开发者可根据项目需求选择适合的方案。
32 0
|
2月前
|
前端开发 开发者 Apache
揭秘Apache Wicket项目结构:如何打造Web应用的钢铁长城,告别混乱代码!
【8月更文挑战第31天】Apache Wicket凭借其组件化设计深受Java Web开发者青睐。本文详细解析了Wicket项目结构,帮助你构建可维护的大型Web应用。通过示例展示了如何使用Maven管理依赖,并组织页面、组件及业务逻辑,确保代码清晰易懂。Wicket提供的页面继承、组件重用等功能进一步增强了项目的可维护性和扩展性。掌握这些技巧,能够显著提升开发效率,构建更稳定的Web应用。
76 0

热门文章

最新文章

推荐镜像

更多
下一篇
无影云桌面