Website https://rwt.io/ en Jen Simmons’ Labs site https://rwt.io/resources/website/jen-simmons-labs-site <span>Jen Simmons’ Labs site</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Thu, 08/02/2018 - 13:01</span> <p>Jen Simmons has been speaking about and advocating for better, more thoughtful design on the web for years. Her Labs site is a collection of her experiments, and a constant source of inspiration for me. I learn something new every time, and constantly go back for references and techniques.</p> Website Jen Simmons <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://labs.jensimmons.com">Labs.JenSimmons.com</a> </p> <article> <img srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=hRRN8VlY 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=OdhwFgld 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=-LE0OtY1 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" class="image" srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=hRRN8VlY 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=OdhwFgld 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=-LE0OtY1 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" src="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-02%20at%2012.59.33%20PM.png?itok=hRRN8VlY" alt="Jen Simmons&#039; Labs site" /> </article> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/design" hreflang="en">Design</a> <a href="/topics/design-thinking" hreflang="en">Design Thinking</a> <a href="/topics/css" hreflang="en">CSS</a> </div> Thu, 02 Aug 2018 17:01:04 +0000 jpamental 73 at https://rwt.io Rachel Andrew’s Grid by Example https://rwt.io/resources/website/rachel-andrews-grid-example <span>Rachel Andrew’s Grid by Example</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Thu, 08/02/2018 - 11:06</span> <p>Rachel is a long-standing proponent of the CSS Grid specification, and has been instrumental in its formation and adoption. Her site is the first place you should go to learn about this new layout specification and how to use it. Learn from the expert.</p> Website Rachel Andrew <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://gridbyexample.com">Grid by Example site</a> </p> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/css" hreflang="en">CSS</a> <a href="/topics/design-thinking" hreflang="en">Design Thinking</a> </div> Thu, 02 Aug 2018 15:06:52 +0000 jpamental 74 at https://rwt.io Font Playground https://rwt.io/resources/website/font-playground <span>Font Playground</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Wed, 08/01/2018 - 15:11</span> <p>Wenting (<a href="https://twitter.com/designjokes">@DesignJokes</a>) is an amazing developer and designer at Adobe, and has come up with some truly innovative interface ideas for playing with type and typesetting. Just be prepared to lose a lot of time. You’ve been warned.</p> Website Wenting Zhang <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://play.typedetail.com">Font Playground site</a> </p> <article> <img srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=r0LfCLrW 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=CSgcwMnC 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=0vn9PFX0 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" class="image" srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=r0LfCLrW 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=CSgcwMnC 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=0vn9PFX0 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" src="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.11.31%20PM.png?itok=r0LfCLrW" /> </article> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/typography" hreflang="en">Typography</a> <a href="/topics/variable-fonts" hreflang="en">Variable Fonts</a> </div> Wed, 01 Aug 2018 19:11:46 +0000 jpamental 70 at https://rwt.io Mandy Michael's CodePen experiments https://rwt.io/resources/website/mandy-michaels-codepen-experiments <span>Mandy Michael&#039;s CodePen experiments</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Wed, 08/01/2018 - 14:33</span> <p>Mandy has done some amazing experiments with variable fonts and kindly made them public on CodePen. You really have to check them out!</p> Website Mandy Michael <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://codepen.io/collection/XqRLMb/">Mandy&#039;s CodePen experiments</a> </p> Wed, 01 Aug 2018 18:33:11 +0000 jpamental 65 at https://rwt.io V-Fonts.com https://rwt.io/resources/website/v-fontscom <span>V-Fonts.com</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Wed, 08/01/2018 - 14:28</span> <p>Nick Sherman’s v-fonts.com site is an emerging catalog of available variable fonts (follow <a href="https://twitter.com/variablefonts">@variablefonts</a> for lots more resources), from one of the most knowledgeable people around (about the fonts, and the best pizza).</p> Website Nick Sherman <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://v-fonts.com">V-Fonts.com</a> </p> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/variable-fonts" hreflang="en">Variable Fonts</a> </div> Wed, 01 Aug 2018 18:28:51 +0000 jpamental 64 at https://rwt.io Axis-Praxis.org https://rwt.io/resources/website/axis-praxisorg <span>Axis-Praxis.org</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Wed, 08/01/2018 - 14:17</span> <p>Axis-Praxis.org is the original ‘variable fonts playground’ created by Laurence Penney (<a href="https://twitter.com/lorp">@lorp</a>). It's a fantastic resource for learning about, playing with, and using this amazing new technology.</p> Website Laurence Penney <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://www.axis-praxis.org/">Axis-Praxis.org</a> </p> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/variable-fonts" hreflang="en">Variable Fonts</a> </div> Wed, 01 Aug 2018 18:17:02 +0000 jpamental 63 at https://rwt.io Việtnamese Typography, 2nd Edition https://rwt.io/resources/website/vietnamese-typography-2nd-edition <span>Việtnamese Typography, 2nd Edition</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Sat, 05/05/2018 - 09:37</span> <p>While I don’t speak Việtnamese, I am a fan of Donny’s work and think more people should be aware of typographic resources for languages other than Western ones. Donny updated the layout, design, and (shockingly) the type and typography. It’s beautiful.</p> Website Donny Truong <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://vietnamesetypography.com">Việtnamese Typography site</a> </p> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/typography" hreflang="en">Typography</a> </div> Sat, 05 May 2018 13:37:28 +0000 jpamental 84 at https://rwt.io WakamaiFondue https://rwt.io/resources/website/wakamaifondue <span>WakamaiFondue</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Tue, 05/01/2018 - 15:06</span> <p>Roel’s sense of humor (wakamaifondue == what can my font do... get it?) is only outshone by how clever he is as a developer. This site is a gem: drag a local font file onto the page and you'll get a fantastic analysis of the content: glyphs, languages, OpenType features, variation axes, and more.</p> Website Roel Nieskens <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://wakamaifondue.com">WakamiFondue site</a> </p> <article> <img srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=LJn7Xbk0 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=veeLpoSu 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=oF52lcJr 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" class="image" srcset="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=LJn7Xbk0 325w, /sites/default/files/styles/max_650x650/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=veeLpoSu 650w, /sites/default/files/styles/max_1300x1300/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=oF52lcJr 1300w" sizes="(min-width: 1290px) 325px, (min-width: 851px) 25vw, (min-width: 560px) 50vw, 100vw" src="/sites/default/files/styles/max_325x325/public/Screen%20Shot%202018-08-01%20at%203.06.00%20PM.png?itok=LJn7Xbk0" alt="WakamaiFondue site by Roel Nieskens" /> </article> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/typography" hreflang="en">Typography</a> <a href="/topics/variable-fonts" hreflang="en">Variable Fonts</a> </div> Tue, 01 May 2018 19:06:20 +0000 jpamental 69 at https://rwt.io Professional Web Typography https://rwt.io/resources/website/professional-web-typography <span>Professional Web Typography</span> <span><span lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="">jpamental</span></span> <span>Fri, 08/05/2016 - 09:33</span> <p>I struggled a bit deciding if I should categorize this as a book or a website, because, well—it’s a book rendered as a website. And you ‘buy’ it by making a donation to support it. And you should: it's a fantastic primer on designing and implementing good typography on the web.</p> Website Donny Truong <p class="field field--name-field-resource-content field--type-entity-reference-revisions field--label-hidden field__items"> <a href="https://prowebtype.com">ProWebType site</a> </p> <div class="block-header-rule p-width-limit topic-links-list field field--name-field-tags field--type-entity-reference field--label-above field__items"> <h3 class="field__label">Topics</h3> <a href="/topics/typography" hreflang="en">Typography</a> </div> Fri, 05 Aug 2016 13:33:34 +0000 jpamental 83 at https://rwt.io