-
Notifications
You must be signed in to change notification settings - Fork 78
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
4e25126
commit 6d8fb97
Showing
2 changed files
with
84 additions
and
0 deletions.
There are no files selected for viewing
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>A Medium Corporation</title> | ||
| </head> | ||
| <body> | ||
| <main> | ||
| <img src="images/zeldman.png"> | ||
| <article> | ||
| <h1>Of Patterns and Power: Web Standards Then & Now</h1> | ||
| <p>IN "<a href="http://v3.danielmall.com/articles/content-display-patterns/">CONTENT Display Patterns</a>" | ||
| (which all front-end folk should read), Dan Mall points to | ||
| a truth not unlike the one <a href="https://24ways.org/2015/putting-my-patterns-through-their-paces/">Ethan Marcotte shared last month</a> on 24 ways. It is a truth as old as standards-based | ||
| design: Construct your markup to properly support your content | ||
| (not your design).</p> | ||
|
|
||
| <p>Modular/<a href="http://bradfrost.com/blog/post/atomic-web-design/">atomic design</a> doesn’t change this truth, it just | ||
| reinforces its wisdom. <a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/">Flexbox</a> and | ||
| <a href="https://css-tricks.com/snippets/css/complete-guide-grid/">grid layout</a> don’t change | ||
| this truth, they just make it easier to do it better. | ||
| <a href="http://html5forwebdesigners.com/design/index.html">HTML5</a> | ||
| doesn’t change this truth, it just reminds us that the | ||
| separation of structure from style came into existence for a | ||
| reason. A reason that hasn’t changed. A reason that cannot | ||
| change, because it is the core truth of the web, and is | ||
| inextricably bound up with the promise of this medium.</p> | ||
|
|
||
| <p>Separating structure from style and behavior was the web | ||
| standards movement’s prime revelation, and each generation | ||
| of web designers discovers it anew. This separation is what | ||
| makes our content as backward-compatible as it is | ||
| forward-compatible (or “<a href="http://futurefriendlyweb.com/">future-friendly</a>,” if you prefer). | ||
| It’s the key to re-use. The key to accessibility. The key to | ||
| the new kinds of CMS systems we’re just beginning to dream | ||
| up. It’s what makes our content as accessible to an ancient | ||
| device as it will be to an unimagined future one.</p> | ||
|
|
||
| <p>Every time a leader in our field discovers, as if for the | ||
| first time, the genius of this separation between style, | ||
| presentation, and behavior, she is validating the | ||
| brilliance of web forbears like <a href="https://en.wikipedia.org/wiki/Tim_Berners-Lee">Tim Berners-Lee</a>, | ||
| <a href="https://en.wikipedia.org/wiki/Håkon_Wium_Lie">Håkon Wium Lie</a>, and | ||
| <a href="https://en.wikipedia.org/wiki/Bert_Bos">Bert Bos</a>.</p> | ||
|
|
||
| <p>Every time a Dan or an Ethan (or a <a href="https://sarasoueidan.com/">Sara</a> | ||
| or a <a href="http://lea.verou.me/">Lea</a>) writes | ||
| a beautiful and insightful article like the two cited | ||
| above, they are telling new web designers, and reminding | ||
| experienced ones, that this separation of powers | ||
| matters.</p> | ||
|
|
||
| <p>And they are plunging a stake into the increasingly | ||
| slippery ground beneath us.</p> | ||
|
|
||
| <p>Why is it slippery? Because too many developers and | ||
| designers in our amnesiac community have begun to believe | ||
| and share bad ideas — ideas, like CSS isn’t needed, HTML | ||
| isn’t needed, <a href="http://alistapart.com/article/understandingprogressiveenhancement">progressive enhancement</a> is old-fashioned | ||
| and unnecessary, and so on. Ideas that, if followed, | ||
| will turn the web back what it was becoming in the late | ||
| 1990s: a wasteland of walled gardens that said no to | ||
| more people than they welcomed. Let that never be so. | ||
| We have the power.</p> | ||
|
|
||
| <p>As <a href="https://en.wikipedia.org/wiki/Maimonides">Maimonides</a>, were he alive today, would tell us: he | ||
| who excludes a single user destroys a universe. Web | ||
| standards now and forever.</p> | ||
|
|
||
| <p>Originally published at <a href="http://www.zeldman.com/2016/01/05/13913/">www.zeldman.com</a> on January 5, 2016.</p> | ||
| </article> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <p>Designing and blogging since 1995, <a href="http://www.zeldman.com/">Jeffrey Zeldman</a> | ||
| is the publisher of <a href="http://alistapart.com/">A List Apart</a> Magazine and | ||
| <a href="http://abookapart.com/">A Book Apart</a>, | ||
| co-founder of <a href="http://aneventapart.com/">An Event Apart</a> design conference, and | ||
| founder and creative director of | ||
| <a href="http://studio.zeldman.com/">studio.zeldman</a>. Follow | ||
| him <a href="https://twitter.com/zeldman">@zeldman</a>.</p> | ||
| </footer> | ||
| </body> | ||
| </html> |