The grid has long been an invaluable tool for creating order out of chaos for designers of all kinds—from city planners to architects to typesetters and graphic artists. In recent years, web designers, too, have come to discover the remarkable power that grid-based design can afford in creating intuitive, immersive, and beautiful user experiences.
The grid has long been an invaluable tool for creating order out of chaos for designers of all kinds—from city planners to architects to typesetters and graphic artists. In recent years, web designers, too, have come to discover the remarkable power that grid-based design can afford in creating intuitive, immersive, and beautiful user experiences.
Ordering Disorder delivers a definitive take on grids and the Web. It provides both the big ideas and the brass-tacks techniques of grid-based design. Readers are sure to come away with a keen understanding of the power of grids, as well as the design tools needed to implement them for the World Wide Web.
---
Ordering Disorder is the new, comprehensive text on designing for the Web using the timeless rules of the typographic grid. It’s a must read for any serious interaction designer.
It was written by internationally-recognized designer, writer and speaker Khoi Vinh.
---
More information at grids.subtraction.com
作者简介
· · · · · ·
Khoi Vinh is internationally recognized for bringing the tried-and-true principles of the typographic grid to the World Wide Web. He is the former Design Director for NYTimes.com, where he consolidated his reputation for superior user experience design. He writes and lectures widely on design, technology, and culture, and has published the popular blog Subtraction.com for over ...
Khoi Vinh is internationally recognized for bringing the tried-and-true principles of the typographic grid to the World Wide Web. He is the former Design Director for NYTimes.com, where he consolidated his reputation for superior user experience design. He writes and lectures widely on design, technology, and culture, and has published the popular blog Subtraction.com for over a decade.
1. Introduction
2. Concept
3. Process
4. Execution
5. Conclusion
Appendix
Index
---
Chapters 1 and 2 introduce the historical and conceptual foundations of grid design.
Chapter 3 provides a best-practices overview of how to work with grids practically and creatively.
Chapter 4 is an extensive, hands-on workshop that takes readers through designing a web site, step-by-step.
Chapter 5 offers a summary of the current state of design for the Web with respect to grids.
The Appendix includes a comprehensive list of resources, related reading and areas for further study.
The Index is, uh, an index of the stuff in the book. It was prepared by a professional indexer!
· · · · · · (收起)
As is typical with many home pages, ours needs to serve several purposes at once: it must present a sampling of the latest and/or the most interesting editorial content, it must preview some of the activity and content happening within the Designery.us social network, and it must showcase of some of the most active users of the network.
2012-10-08 11:49
As is typical with many home pages, ours needs to serve several purposes at once: it must present a sampling of the latest and/or the most interesting editorial content, it must preview some of the activity and content happening within the Designery.us social network, and it must showcase of some of the most active users of the network.
The goal here is to create a uniform set of divisions of the page that will give us layout guidance across teh range of design problems we will encounter in this project.
2012-09-21 14:52
The goal here is to create a uniform set of divisions of the page that will give us layout guidance across teh range of design problems we will encounter in this project.引自 Execution - structuring the grid
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.
2012-09-21 14:23
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.引自 Execution - Sketching the solution
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit. viewport size and advertising unit.
2012-09-20 13:36
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit.引自 Execution
Give the highly variable nature of web design, we can begin to think of print design being relatively definitive in nature. Analog design solutions are declarative, whereas web design solutions are conversational ... Conversational is a beautiful word to explain web design variability.
2012-09-12 18:43
Give the highly variable nature of web design, we can begin to think of print design being relatively definitive in nature. Analog design solutions are declarative, whereas web design solutions are conversational ...引自 Concept
Conversational is a beautiful word to explain web design variability.
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit. viewport size and advertising unit.
2012-09-20 13:36
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit.引自 Execution
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.
2012-09-21 14:23
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.引自 Execution - Sketching the solution
As is typical with many home pages, ours needs to serve several purposes at once: it must present a sampling of the latest and/or the most interesting editorial content, it must preview some of the activity and content happening within the Designery.us social network, and it must showcase of some of the most active users of the network.
2012-10-08 11:49
As is typical with many home pages, ours needs to serve several purposes at once: it must present a sampling of the latest and/or the most interesting editorial content, it must preview some of the activity and content happening within the Designery.us social network, and it must showcase of some of the most active users of the network.
The goal here is to create a uniform set of divisions of the page that will give us layout guidance across teh range of design problems we will encounter in this project.
2012-09-21 14:52
The goal here is to create a uniform set of divisions of the page that will give us layout guidance across teh range of design problems we will encounter in this project.引自 Execution - structuring the grid
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.
2012-09-21 14:23
It's not important at this point to sketch an exact grid or to determine the number of units in the solution. Instead, focus on the number of columns to be used on a given page, regardless of how complex or difficult it will be to create those columns mathematically.引自 Execution - Sketching the solution
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit. viewport size and advertising unit.
2012-09-20 13:36
In reviewing the wireframes for those four main templates, we can identify two principle constraints. These, helpfully, are fairly clear cut and reasonably typical of many Web design challenges: the viewport size and the advertising unit.引自 Execution
0 有用 Acronichal 2018-10-31
2018-29
0 有用 PBB 2015-08-11
还是前面的部分对我启发大,后面的内容虽然也是精彩的部分,但是对我影响大的还是前面的讨论。后面的实践性内容还是太“理性”了,有点不太习惯。不是说不应该理性,而是有些设计的来由,在我的角度看来不太站得住脚。前面看着还能接受,后面越来越不行了
0 有用 Acronichal 2018-10-31
2018-29
0 有用 PBB 2015-08-11
还是前面的部分对我启发大,后面的内容虽然也是精彩的部分,但是对我影响大的还是前面的讨论。后面的实践性内容还是太“理性”了,有点不太习惯。不是说不应该理性,而是有些设计的来由,在我的角度看来不太站得住脚。前面看着还能接受,后面越来越不行了