PageSourceSearch

https://daverupert.com/about/

html daverupert.com collected 2026-09-24 15:27:10 UTC 80,302 bytes, 1,894 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en-us" class="">
3
4<head>
5  <!-- pragma -->
6  <meta charset="utf-8">
7  <meta name="viewport" content="width=device-width,initial-scale=1">
8
9  <!-- title -->
10  <title>Howdy, Partner - daverupert.com</title>
11
12  <!-- preconnect -->
13  <link rel="preconnect" href="https://cdn.daverupert.com" />
14  <link rel="preconnect" href="https://fonts.googleapis.com">
15  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
16  <link href="https://fonts.googleapis.com/css2?family=Cascadia+Mono:ital,wght@0,200..700;1,200..700&display=swap" rel="stylesheet">
17
18  <!-- styles -->
19  
20  <style>
21    :root {
22      --hue-rotate: 263;
23    }
24  </style>
25  <style>
26    @property --numchars{syntax:"<number>";inherits:false;initial-value:60}@view-transition{navigation:auto}*,*:before,*:after{box-sizing:border-box}*:focus-visible{outline:2px solid light-dark(black, white);outline-offset:3px;border-radius:4px}[hidden]{display:none !important}:root{color-scheme:light dark;scrollbar-gutter:stable;--font-size: 18px;--font-size-mobile: 16px;--font-weight: 350;--line-height: 1.8;--letter-spacing: -0.05ch;--max-width: 68ch;--corner: 1ch;--font-mono: 'Cascadia Mono', monospace;--gap: 1.5rem;--fluid-gap: clamp(0.75rem, 3vw, 1.5rem);--rotated-hue: calc(var(--hue, 196) + var(--hue-rotate));--color-accent: light-dark( oklch(78% 0.175 var(--rotated-hue)), oklch(78% 0.125 var(--rotated-hue)) );--light-l: 98.5%;--dark-l: 30%;--color-bg: light-dark( oklch(from var(--color-accent) var(--light-l) calc(c * 0.1) calc(h + 180)), oklch(from var(--color-accent) var(--dark-l) calc(c * 0.1) calc(h + 180)) );--color-fg: light-dark(darkslategray, floralwhite);--color-border: light-dark(#d0d0d0, #5a5a5a);--color-overlay: light-dark( hsla(0, 0%, 0%, 0.025), hsla(0, 0%, 0%, 0.2) );--color-link: var(--color-accent);--accent: var(--color-accent);--text: var(--color-fg);--border: var(--color-border);--spring-easing: linear( 0, 0.007, 0.026, 0.059 4.5%, 0.106 6.3%, 0.209 9.5%, 0.558 19.3%, 0.658, 0.742, 0.812, 0.87, 0.918, 0.957, 0.986 41.6%, 1.007 45.3%, 1.021 49.4%, 1.027 54% 60.9%, 1.007 83.2%, 1 );--spring-duration: 0.4s;--skew-start: matrix3d( 1, 0, 0, 0, 0, 1, 0, -0.002, 0, 0, 1, 0, 0, 0, 0, 1.5 )}[data-theme=light]{color-scheme:light}[data-theme=dark]{color-scheme:dark}html,body{min-height:100svh;min-height:stretch}body{accent-color:var(--color-accent);background-color:var(--color-bg);color:var(--color-fg);display:grid;font-family:var(--font-mono);font-size:var(--font-size);font-weight:var(--font-weight);grid-template-rows:auto 1fr auto;line-height:var(--line-height);letter-spacing:var(--letter-spacing);margin:0;padding:0}@media(max-width: 600px){body{font-size:var(--font-size-mobile, 16px)}}button,input{font:inherit}img,video{max-width:100%;height:auto}a{--color-link-accent: var(--color-accent);color:currentColor;text-decoration-color:var(--color-link-accent);text-underline-offset:4px;text-decoration-thickness:2px;transition:text-underline-offset .2s}a:hover,[aria-current]{text-decoration:underline wavy;text-underline-offset:5px}a:hover{text-decoration-color:var(--color-link-accent)}[aria-current]{font-weight:700}.tag{--color-link-accent: currentColor;color:oklch(from currentColor l c h/0.7);display:inline-block;font-size:.925rem;font-weight:300;text-decoration-thickness:1px}.tag:hover{text-decoration-thickness:1px}:is(h1,h2,h3,h4,h5,h6){font-family:var(--font-mono);font-weight:900;line-height:1.05}code{font-family:var(--font-mono);font-size:.925em}code:not(pre code){padding:.2ch 0;border-radius:.5ch;background:oklch(from var(--color-accent) l c h/0.075)}code:not(pre code)::before,code:not(pre code)::after{content:"`";color:oklch(from var(--color-accent) l c h/0.6)}pre:has(code){padding:2ch;border-radius:var(--corner);overflow-x:auto;tab-size:2}table{width:100%;border-top:1px;border-left:1px;border-style:solid;border-collapse:collapse;border-color:var(--color-border)}table th,table td{border-style:solid;border-color:var(--color-border);border-right:1px;border-block-end:1px;padding:1ch}iframe:where([src*=youtube],[src*=vimeo]){aspect-ratio:var(--aspect-ratio, 16/9);width:100%;height:auto}
26.flex{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--gap);align-items:center}.container{container:container/inline-size;display:grid;grid-template-columns:[full-start] 5vw [margin-start] 1fr [wide-start] 1fr [outdent-start] 1fr [content-start] minmax(auto, var(--max-width)) [content-end] 1fr [outdent-end] 1fr [wide-end] 1fr [margin-end] 5vw [full-end]}.container>*{grid-column:content-start/content-end}.wide .container>*{grid-column:wide-start/wide-end}.outdent.container:not(.wide .container)>*{grid-column:outdent-start/outdent-end}.nav-list{list-style-type:none;padding-left:0;display:flex;flex-wrap:wrap;gap:var(--fluid-gap);align-items:center;justify-content:start}@media(width >= 728px){.nav-list{justify-content:space-between}}.nav-list svg{display:block}.post{grid-template-columns:subgrid}.post .header{grid-column-end:outdent-end !important}.post h1{--max-font-size: 3.4rem;--min-font-size: 1.8rem;--ideal-cpl: 40;--numchars: attr(data-numchars type(<number>));--ratio: calc(var(--ideal-cpl) / var(--numchars));font-size:clamp(var(--min-font-size),var(--max-font-size)*var(--ratio),var(--max-font-size));letter-spacing:calc(var(--letter-spacing)*1.5);margin-block-end:0;text-wrap-style:pretty}@media(max-width: 600px){.post h1{--max-font-size: 2.4rem}}.post:has(.meta-link) h1{--max-font-size: 2.4rem;--min-font-size: 1.8rem}.post h1.svg-title{color:var(--accent);fill:#fff}.post del{color:oklch(from currentColor l c h/0.25)}.post ins{text-underline-offset:.5ch;text-decoration-color:oklch(from currentColor l c h/0.2)}.container .post,.container .post-content{display:grid;grid-column:full-start/full-end !important;grid-template-columns:subgrid}.container .post>*,.container .post-content>*{grid-column:content-start/content-end}article>*,article .post-content>*{min-width:0}.post-content :is(iframe:not(two-column iframe),table,browser-window,two-column,blockquote,pre:has(code),.table-overflow,.highlighter-rouge,.cp_embed_wrapper),.post-content p:has(:is(img,video,iframe,browser-window):only-child){grid-column:content-start/outdent-end !important}.post-content blockquote{border-inline-start:4px solid oklch(from var(--color-accent) l c h/0.2);margin:0;padding-left:2ch;font-style:italic}.post-content ul,.post-content ol{padding-left:1.5ch}.post-content ul li,.post-content ol li{padding-left:.5ch}.post-content ol{margin-left:1.5ch}.post figure{margin-block:0;margin-inline:clamp(.5rem,2vw,2rem);font-size:.875em}.post-content table{font-size:.875em}.table-overflow{overflow-x:auto}pre:has(code){--syntax-background: light-dark(#f5f5f5, #1e1e1e);--syntax-foreground: light-dark(#101010, #ffffff);--syntax-comment: light-dark(#707070, #8b8b8b);--syntax-keyword: light-dark(#606060, #a0a0a0);--syntax-operator: light-dark(#606060, #a0a0a0);--syntax-string: light-dark(#007a61, #99ffe4);--syntax-variable: light-dark(#101010, #ffffff);--syntax-property: light-dark(#101010, #ffffff);--syntax-inserted: light-dark(#007a61, #99ffe4);--syntax-deleted: light-dark(#b42318, #ff8080);color-scheme:light dark}pre:has(code){background:var(--syntax-background);color:var(--syntax-foreground)}::highlight(comment),::highlight(quote){color:var(--syntax-comment)}::highlight(keyword),::highlight(storage),::highlight(at-rule),::highlight(doctype),::highlight(important),::highlight(section){color:var(--syntax-keyword)}::highlight(operator),::highlight(punctuation){color:var(--syntax-operator)}::highlight(string),::highlight(regexp),::highlight(attribute-value),::highlight(link),::highlight(raw){color:oklch(from var(--color-accent) l c calc(h + 115))}::highlight(numeric),::highlight(boolean),::highlight(constant),::highlight(symbol),::highlight(character-entity),::highlight(anchor),::highlight(entity){color:var(--color-accent)}::highlight(function),::highlight(decorator),::highlight(animation){color:var(--color-accent)}::highlight(type),::highlight(support){color:var(--syntax-type)}::highlight(variable),::highlight(interpolation){color:var(--syntax-variable)}::highlight(property),::highlight(key),::highlight(attribute-name){color:var(--syntax-property)}::highlight(tag){color:var(--color-accent)}::highlight(selector){color:var(--color-accent)}::highlight(inserted){color:var(--syntax-inserted)}::highlight(deleted){color:var(--syntax-deleted)}.cp_embed_wrapper{margin-bottom:2rem !important}h1:has(#dave){margin-block-end:0}#dave{view-transition-name:dave-logo;paint-order:fill;fill:#fff;stroke:var(--color-fg);stroke-miterlimit:10;stroke-width:var(--logo-stroke-size, 4px);transform:none;transition-property:transform;transition-duration:calc(var(--spring-duration)*2);transition-timing-function:var(--spring-easing)}@media(prefers-reduced-motion: reduce){#dave{view-transition-name:none}}.nav-list #dave{--logo-stroke-size: 9px}@media(width < 728px){.nav-list #dave{height:24px;--logo-stroke-size: 12px}}@starting-style{#dave:not(.nav-list #dave){transform:var(--skew-start)}}::view-transition-group(dave-logo){animation-timing-function:var(--spring-easing);animation-duration:var(--spring-duration)}.timeline-year{margin-block:clamp(2rem,7.5vw,4rem)}.timeline-title{margin:0}.timeline ul{list-style-type:none;padding-left:0;display:grid;gap:var(--fluid-gap);align-items:center}.item>[class*=item-]{text-box-trim:trim-both}.item-title{line-height:1.5}.meta{font-size:.925rem}.footnotes{border-top:1px solid var(--color-border);margin-top:calc(var(--fluid-gap)*2);font-size:.925rem}#footer{margin-top:calc(var(--fluid-gap)*6);padding-block-end:var(--gap);font-size:.925rem}#footer .flex{align-items:start;justify-content:space-between}#footer ul{padding-left:1ch}#footer ul li{margin-left:.5ch}
27  </style>
28
29   <style>
30  figure {
31    background: oklch(from var(--color-accent) l c h / 0.1);
32    padding: 1rem;
33    font-size: .875rem;
34    margin-block-start: 1.5rem;
35    margin-inline: 0!important;
36    grid-column-end: outdent-end !important;
37    border-radius: 1ch;
38  }
39
40  figure:has(figcaption) {
41    padding-bottom: 0.25rem;
42  }
43
44  figcaption {
45    font-style: italic;
46  }
47
48  figure img {
49    display: block;
50  }
51</style>
52 
53
54  <!-- opengraph and meta -->
55  <!-- Begin Jekyll SEO tag v2.9.0 -->
56<meta name="generator" content="Jekyll v4.4.1" />
57<meta property="og:title" content="Howdy, Partner" />
58<meta name="author" content="Dave Rupert" />
59<meta property="og:locale" content="en_US" />
60<meta name="description" content="The personal blog of Dave Rupert, web developer and podcaster from Austin, TX." />
61<meta name="twitter:description" property="og:description" content="The personal blog of Dave Rupert, web developer and podcaster from Austin, TX." />
62<link rel="canonical" href="https://daverupert.com/about/" />
63<meta property="og:url" content="https://daverupert.com/about/" />
64<meta property="og:site_name" content="daverupert.com" />
65<meta property="og:type" content="website" />
66<meta name="twitter:card" content="summary" />
67<meta name="twitter:title" content="Howdy, Partner" />
68<script type="application/ld+json">
69{"@context":"https://schema.org","@type":"WebSite","author":{"@type":"Person","name":"Dave Rupert"},"description":"The personal blog of Dave Rupert, web developer and podcaster from Austin, TX.","headline":"Howdy, Partner","name":"Dave Rupert","publisher":{"@type":"Organization","logo":{"@type":"ImageObject","url":"https://daverupert.com/images/global/newshammericon.png"},"name":"Dave Rupert"},"sameAs":["https://www.linkedin.com/in/dave-rupert","https://github.com/davatron5000","https://mastodon.social/davatron5000","https://bsky.app/profile/davatron5000.bsky.social"],"url":"https://daverupert.com/about/"}</script>
69
70<!-- End Jekyll SEO tag -->
71
72  <meta name="fediverse:creator" content="@[email protected]"/><!-- extensible web -->
73  <link rel="alternate" href="https://daverupert.com/atom.xml" type="application/atom+xml" title="Atom 2.0">
74  <link rel="shortcut icon" href="/favicon.ico" />
75</head>
76<body>
77  <svg xmlns="http://www.w3.org/2000/svg" hidden>
78  <defs>
79    <symbol id="logo" viewBox="0 0 763.37 291.45">
80      <path d="M212.65,229.09Q189,259,166.22,289.45H51.92Q27.4,145.72,2.88,2H136.2q31.37,28.85,62.14,58.31ZM69.42,61.13q12.26,84.81,24.5,169.6H142c6.48-8.54,9.77-12.81,16.41-21.35L144.23,81.67q-10.89-10.32-21.88-20.54Z"/>
81      <path d="M393.08,289.45H341.54q-7.4-33.09-15.15-66.11H267.28q-4.59,33-8.84,66.11H213.56Q231.68,145.07,258.24,2h70.48Q364.77,144.86,393.08,289.45ZM272,189.25h46.84q-13.83-56-28.75-111.69Q280.48,133.32,272,189.25Z"/>
82      <path d="M489.5,289.45h-61Q402.71,144.91,369,2h58.8q21.94,105.77,39.67,212.3Q493.39,107.64,523.26,2h52Q528.43,144.56,489.5,289.45Z"/>
83      <path d="M750,61.13H633.57q-3.39,29.16-6.79,58.31h78.58l-7,45.59H621.46l-7.65,65.7H721.47l-10,58.72h-155q13-143.73,26-287.45H760.09Z"/>
84    </symbol>
85  </defs>
86</svg>
87
88  <header id="header"  class="container outdent">
89    <nav id="nav" role="navigation">
90      <ul class="nav-list">
91        
92          <li>
93            <a href="/">
94              <svg id="dave" viewBox="0 0 763.37 291.45" height="42">
95              <use href="#logo"></use>
96            </svg>
97          </a>
98        </li>
99        
100        <li><a aria-current="page" href="/about/">About</a></li>
101        <li><a  href="/archive/">Archives</a></li>
102        <li><a  href="/projects/">Projects</a></li>
103        <li><a  href="/stories/">Stories</a></li>
104        <li><a  href="/bookshelf/">Bookshelf</a></li>
105        <li>
106          <a href="/atom.xml" aria-label="RSS">
107            <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="16" width="16">
108              <path fill="currentColor" d="M 4 4.44 v 2.83 c 7.03 0 12.73 5.7 12.73 12.73 h 2.83 c 0 -8.59 -6.97 -15.56 -15.56 -15.56 Z m 0 5.66 v 2.83 c 3.9 0 7.07 3.17 7.07 7.07 h 2.83 c 0 -5.47 -4.43 -9.9 -9.9 -9.9 Z M 6.18 15.64 A 2.18 2.18 0 0 1 6.18 20 A 2.18 2.18 0 0 1 6.18 15.64"
109              />
110            </svg>
111          </a>
112        </li>
113      </ul>
114    </nav>
115  </header>
116
117  <main id="content" class="container">
118    <style>
119  .header {
120    view-transition-name: header
121  }
122
123  @media (prefers-reduced-motion: reduce) {
124    .header {
125      view-transition-name: none
126    }
127  }
128
129  ::view-transition-old(header) {
130    width: fit-content;
131    animation: fade 0.2s linear forwards;
132  }
133
134  ::view-transition-new(header) {
135    width: fit-content;
136    animation: fade 0.2s linear reverse;
137  }
138
139  @keyframes fade {
140    from {
141      opacity: 1;
142    }
143    to {
144      opacity: 0;
145    }
146  }
147
148  .header h1,
149  .subnav {
150    width: fit-content;
151  }
152
153  .subnav {
154    display: flex;
155    gap: clamp(2ch, 5vw, 4ch);
156    margin-bottom: var(--fluid-gap);
157  }
158
159</style>
160
161<header class="header">
162  <h1 >Howdy, Partner</h1>
163  <nav class="subnav">
164    
165    <a href="/about/" aria-current="true">About</a>
166    
167    <a href="/uses/" >Uses</a>
168    
169    <a href="/likes/" >Likes</a>
170    
171    <a href="/support/" >Support</a>
172    
173  </nav>
174</header>
175
176<article class="post">
177  <div class="post-content">
178  <figure>
179  <img width="1280" height="853" src="https://cdn.daverupert.com/posts/2024/frostapalooza.jpg" alt="Me playing bass guitar drowned in moody green and purple rock show lighting">
180  <figcaption>
181    Photo by <a href="https://wbrowar.com/">Will Brower</a>
182  </figcaption>
183</figure>
184
185<div class="bio">
186  <p>I'm Dave Rupert, I write web components at Microsoft and am co-host of <a href="http://shoptalkshow.com">ShopTalk</a>, a podcast about front-end web design and development. Previously, I co-founded a startup called <a href="https://luroapp.com">Luro</a> and an agency called <a href="http://paravelinc.com">Paravel</a> with two of my best friends. I'm married to the drummer of a mid-2000s indie rock band, I'm a dad to two wonderful kids, and I live in Austin, TX where I work out of my backyard office.</p>
187</div>
188
189<section class="timeline">
190  
191  <div class="timeline-year">
192    <div>
193      <h2 class="timeline-title">2026</h2>
194    </div>
195    <ul class="item-list">
196      
197      <li class="item item-type-">
198        <h3 class="item-title">
199          <svg class="item-icon" height="16" width="16">
200            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
201          </svg>
202          Web, Whiskey, and Whatnot
203        </h3>
204        
205        <div class="description"><p>Returned to the WWW podcast for a ShopTalkShow crossover event. Chris and I join Adam and Robbie to talk about internet. <a href="https://youtu.be/jyjWfvqbNnI">Watch on YouTube</a></p>
206</div>
207        <div><time class="item-meta">March 2026</time></div>
208      </li>
209      
210    </ul>
211  </div>
212
213  <div class="timeline-year">
214    <div>
215      <h2 class="timeline-title">2025</h2>
216    </div>
217    <ul class="item-list">
218      
219      <li class="item item-type-">
220        <h3 class="item-title">
221          <svg class="item-icon" height="16" width="16">
222            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
223          </svg>
224          CSS is Awesome Game
225        </h3>
226        
227        <div class="description"><p>I was invited to be on a a game show with Miriam, Adam, Cassondra, and Stacy. Love to game show.
228<a href="https://www.youtube.com/watch?v=xcEnjGPm1Fo">Watch on CSS is Awesome YouTube</a></p>
229</div>
230        <div><time class="item-meta">December 2025</time></div>
231      </li>
232      
233      <li class="item item-type-">
234        <h3 class="item-title">
235          <svg class="item-icon" height="16" width="16">
236            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
237          </svg>
238          Web, Whiskey, and Whatnot
239        </h3>
240        
241        <div class="description"><p>I was invited to talk about websites and AI while drinking over on the Web, Whiskey, and Whatnot podcast with Adam Argyle and Robbie Wagner. <a href="https://whiskey.fm/talkshop-show-w-macho-man-randy-standards">Listen to Episode</a></p>
242</div>
243        <div><time class="item-meta">October 2025</time></div>
244      </li>
245      
246    </ul>
247  </div>
248
249  <div class="timeline-year">
250    <div>
251      <h2 class="timeline-title">2024</h2>
252    </div>
253    <ul class="item-list">
254      
255      <li class="item item-type-">
256        <h3 class="item-title">
257          <svg class="item-icon" height="16" width="16">
258            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
259          </svg>
260          Smashing Hour
261        </h3>
262        
263        <div class="description"><p>Geoff Graham invited me to join him for a Smashing Hour to talk web components and many other things. <a href="https://www.youtube.com/watch?v=-hXmRkM7dsQ">Watch now</a></p>
264</div>
265        <div><time class="item-meta">July 2024</time></div>
266      </li>
267      
268      <li class="item item-type-">
269        <h3 class="item-title">
270          <svg class="item-icon" height="16" width="16">
271            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
272          </svg>
273          Dave goes Microsoft
274        </h3>
275        
276        <div class="description"><p>I joined Microsoft to work on web components.</p>
277</div>
278        <div><time class="item-meta">May 2024</time></div>
279      </li>
280      
281      <li class="item item-type-">
282        <h3 class="item-title">
283          <svg class="item-icon" height="16" width="16">
284            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
285          </svg>
286          Bleeding Edge ATX
287        </h3>
288        
289        <div class="description"><p>Presented “HTML with Superpowers” at the recently rebooted Bleeding Edge ATX meetup.</p>
290</div>
291        <div><time class="item-meta">April 2024</time></div>
292      </li>
293      
294      <li class="item item-type-">
295        <h3 class="item-title">
296          <svg class="item-icon" height="16" width="16">
297            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
298          </svg>
299          Bad @ CSS
300        </h3>
301        
302        <div class="description"><p>I joined the Bad @ CSS video podcast to talk. <a href="https://www.youtube.com/watch?v=azUEOy8_GHo">Watch on YouTube</a></p>
303</div>
304        <div><time class="item-meta">March 2024</time></div>
305      </li>
306      
307      <li class="item item-type-">
308        <h3 class="item-title">
309          <svg class="item-icon" height="16" width="16">
310            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
311          </svg>
312          Frontend Masters Boost Blog
313        </h3>
314        
315        <div class="description"><p>Wrote <a href="https://frontendmasters.com/blog/capo-js-a-five-minute-web-performance-boost/">my first article</a> for the Frontend Masters new Boost blog</p>
316</div>
317        <div><time class="item-meta">March 2024</time></div>
318      </li>
319      
320    </ul>
321  </div>
322
323  <div class="timeline-year">
324    <div>
325      <h2 class="timeline-title">2023</h2>
326    </div>
327    <ul class="item-list">
328      
329      <li class="item item-type-">
330        <h3 class="item-title">
331          <svg class="item-icon" height="16" width="16">
332            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
333          </svg>
334          Front-end Development South Africa
335        </h3>
336        
337        <div class="description"><p>I was invited to talk about Web Components on the FEDSA livestream meetup. <a href="https://www.youtube.com/watch?v=a7s6eQbzgVE">Watch on YouTube</a></p>
338</div>
339        <div><time class="item-meta">September 2023</time></div>
340      </li>
341      
342      <li class="item item-type-">
343        <h3 class="item-title">
344          <svg class="item-icon" height="16" width="16">
345            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
346          </svg>
347          Luro Public Release
348        </h3>
349        
350        <div class="description"><p>Brought Luro out of Beta and available for public sign-ups.</p>
351</div>
352        <div><time class="item-meta">September 2023</time></div>
353      </li>
354      
355      <li class="item item-type-">
356        <h3 class="item-title">
357          <svg class="item-icon" height="16" width="16">
358            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
359          </svg>
360          Austin Javascript
361        </h3>
362        
363        <div class="description"><p>Presented “HTML with Superpowers” at the recently rebooted Austin JavaScript meetup.</p>
364</div>
365        <div><time class="item-meta">July 2020</time></div>
366      </li>
367      
368      <li class="item item-type-">
369        <h3 class="item-title">
370          <svg class="item-icon" height="16" width="16">
371            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
372          </svg>
373          Creating Web Components on Kevin Powell
374        </h3>
375        
376        <div class="description"><p>CSS expert Kevin Powell had me on his livestream to talk about creating Web Components. <a href="https://www.youtube.com/watch?v=Sq5oiHjwFxI">Watch on YouTube</a></p>
377</div>
378        <div><time class="item-meta">January 2023</time></div>
379      </li>
380      
381    </ul>
382  </div>
383
384  <div class="timeline-year">
385    <div>
386      <h2 class="timeline-title">2022</h2>
387    </div>
388    <ul class="item-list">
389      
390      <li class="item item-type-">
391        <h3 class="item-title">
392          <svg class="item-icon" height="16" width="16">
393            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
394          </svg>
395          An Event Apart Denver
396        </h3>
397        
398        <div class="description"><p>Presented my Log Jams talk at AEA Denver.</p>
399</div>
400        <div><time class="item-meta">October 2022</time></div>
401      </li>
402      
403      <li class="item item-type-">
404        <h3 class="item-title">
405          <svg class="item-icon" height="16" width="16">
406            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
407          </svg>
408          Frontend Feud: ShopTalk vs CSS Podcast
409        </h3>
410        
411        <div class="description"><p>Attempting to defend the JS Party Frontend Feud title against the formidable CSS Podcast</p>
412</div>
413        <div><time class="item-meta">July 2020</time></div>
414      </li>
415      
416      <li class="item item-type-">
417        <h3 class="item-title">
418          <svg class="item-icon" height="16" width="16">
419            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
420          </svg>
421          Some Antics Livestream
422        </h3>
423        
424        <div class="description"><p>I joined Ben Myers to talk about work happening in Open UI. <a href="https://www.youtube.com/watch?v=36yzal04dRo">Watch on YouTube</a></p>
425</div>
426        <div><time class="item-meta">March 2023</time></div>
427      </li>
428      
429      <li class="item item-type-">
430        <h3 class="item-title">
431          <svg class="item-icon" height="16" width="16">
432            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
433          </svg>
434          Co-Founded Luro
435        </h3>
436        
437        <div class="description"><p>Co-founded Luro with Trent Walton and Reagan Ray.</p>
438</div>
439        <div><time class="item-meta">January 2022</time></div>
440      </li>
441      
442    </ul>
443  </div>
444
445  <div class="timeline-year">
446    <div>
447      <h2 class="timeline-title">2021</h2>
448    </div>
449    <ul class="item-list">
450      
451      <li class="item item-type-">
452        <h3 class="item-title">
453          <svg class="item-icon" height="16" width="16">
454            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
455          </svg>
456          ShopTalk YouTube
457        </h3>
458        
459        <div class="description"><p>ShopTalk goes video with <a href="https://www.youtube.com/user/realcsstricks">a new daily video series on the CSS-Tricks YouTube channel</a>.</p>
460<p><a href="https://www.youtube.com/user/realcsstricks" class="button">Watch Now</a></p>
461</div>
462        <div><time class="item-meta">September 2020</time></div>
463      </li>
464      
465      <li class="item item-type-">
466        <h3 class="item-title">
467          <svg class="item-icon" height="16" width="16">
468            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
469          </svg>
470          Frontend Fued: ShopTalk Show vs Syntax on JSPartyFM
471        </h3>
472        
473        <div class="description"><p>ShopTalk vs Syntax in an epic battle. Hands down one of the funnest times I’ve had on a podcast. <a href="https://jsparty.fm/192">Listen on JSParty</a></p>
474</div>
475        <div><time class="item-meta">September 2020</time></div>
476      </li>
477      
478      <li class="item item-type-">
479        <h3 class="item-title">
480          <svg class="item-icon" height="16" width="16">
481            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
482          </svg>
483          An Event Apart Spring Summit
484        </h3>
485        
486        <div class="description"><p>Talking about Web Components at the <a href="https://aneventapart.com/event/spring-summit-2021">Spring Summit 2021</a> edition of An Event Apart.</p>
487</div>
488        <div><time class="item-meta">April 2021</time></div>
489      </li>
490      
491      <li class="item item-type-">
492        <h3 class="item-title">
493          <svg class="item-icon" height="16" width="16">
494            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
495          </svg>
496          axe-con
497        </h3>
498        
499        <div class="description"><p>Talking about Accessibility Backlogs at the <a href="https://www.deque.com/axe-con/">axe-con</a> put on by the good folks at Deque.</p>
500</div>
501        <div><time class="item-meta">March 2021</time></div>
502      </li>
503      
504      <li class="item item-type-">
505        <h3 class="item-title">
506          <svg class="item-icon" height="16" width="16">
507            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
508          </svg>
509          Inclusion Hub Interview
510        </h3>
511        
512        <div class="description"><p>I was asked to talk about Accessibility from a lay person’s perspective over on the <a href="https://www.inclusionhub.com/articles/daverupert">Inclusion Hub</a>.</p>
513</div>
514        <div><time class="item-meta">January 2021</time></div>
515      </li>
516      
517    </ul>
518  </div>
519
520  <div class="timeline-year">
521    <div>
522      <h2 class="timeline-title">2020</h2>
523    </div>
524    <ul class="item-list">
525      
526      <li class="item item-type-">
527        <h3 class="item-title">
528          <svg class="item-icon" height="16" width="16">
529            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
530          </svg>
531          All Things Open 2020
532        </h3>
533        
534        <div class="description"><p>Presenting my new talk at <a href="https://2020.allthingsopen.org/">All Things Open</a> called “Unblocking Backlog Jams with Multi-Dimensional Accessibility Audits”. Like most things in 2020, this will be an online event.</p>
535</div>
536        <div><time class="item-meta">October 2020</time></div>
537      </li>
538      
539      <li class="item item-type-">
540        <h3 class="item-title">
541          <svg class="item-icon" height="16" width="16">
542            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
543          </svg>
544          Live Shop Talk at SmashingConf Austin
545        </h3>
546        
547        <div class="description"><p>Chris and I did another LIVE shoptalk at the (virtual) Austin version of SmashingConf.</p>
548</div>
549        <div><time class="item-meta">October 2020</time></div>
550      </li>
551      
552      <li class="item item-type-">
553        <h3 class="item-title">
554          <svg class="item-icon" height="16" width="16">
555            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
556          </svg>
557          The Bike Shed Podcast
558        </h3>
559        
560        <div class="description"><p>I was invited on the <a href="https://www.bikeshed.fm/263">Bike Shed podcast episode 263</a> to talk about a myriad of topics ranging from accessibility, blogging, and design systems.</p>
561</div>
562        <div><time class="item-meta">October 2020</time></div>
563      </li>
564      
565      <li class="item item-type-">
566        <h3 class="item-title">
567          <svg class="item-icon" height="16" width="16">
568            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
569          </svg>
570          Live Shop Talk at SmashingConf Live
571        </h3>
572        
573        <div class="description"><p>Chris and I doing a LIVE shoptalk webinar at the online circus bonanza known as the SmashingConf Live online event.</p>
574</div>
575        <div><time class="item-meta">August 2020</time></div>
576      </li>
577      
578      <li class="item item-type-">
579        <h3 class="item-title">
580          <svg class="item-icon" height="16" width="16">
581            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
582          </svg>
583          An Event Apart: Front-End Focus
584        </h3>
585        
586        <div class="description"><p>Presenting a new talk at <a href="https://aneventapart.com/event/online-0820">An Event Apart: Online Together</a> called “Unblocking Backlog Jams with Multi-Dimensional Accessibility Audits”</p>
587</div>
588        <div><time class="item-meta">August 2020</time></div>
589      </li>
590      
591      <li class="item item-type-">
592        <h3 class="item-title">
593          <svg class="item-icon" height="16" width="16">
594            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
595          </svg>
596          The Web Platform Podcast
597        </h3>
598        
599        <div class="description"><p>Hopped on The Web Platform Podcast to talk about <a href="https://thewebplatformpodcast.com/197-modern-html">Modern HTML</a>.</p>
600</div>
601        <div><time class="item-meta">April 2020</time></div>
602      </li>
603      
604    </ul>
605  </div>
606
607  <div class="timeline-year">
608    <div>
609      <h2 class="timeline-title">2019</h2>
610    </div>
611    <ul class="item-list">
612      
613      <li class="item item-type-">
614        <h3 class="item-title">
615          <svg class="item-icon" height="16" width="16">
616            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
617          </svg>
618          🕶 Awesome Standalones
619        </h3>
620        
621        <div class="description"><p>Made <a href="https://github.com/davatron5000/awesome-standalones">Awesome Standalones</a> - A curated list of awesome framework-agnostic standalone web components.</p>
622</div>
623        <div><time class="item-meta">December 2019</time></div>
624      </li>
625      
626      <li class="item item-type-">
627        <h3 class="item-title">
628          <svg class="item-icon" height="16" width="16">
629            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
630          </svg>
631          Published on CSS-Tricks
632        </h3>
633        
634        <div class="description"><p>I was invited by CSS-Tricks to write about what has me excited about web development, and I wrote about <a href="https://css-tricks.com/the-kind-of-development-i-like/">The Kind of Development I Like</a>.</p>
635</div>
636        <div><time class="item-meta">November 2019</time></div>
637      </li>
638      
639      <li class="item item-type-">
640        <h3 class="item-title">
641          <svg class="item-icon" height="16" width="16">
642            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
643          </svg>
644          Live Shop Talk at JAMstack Conf
645        </h3>
646        
647        <div class="description"><p>Chris and I will be doing a live Shop Talk Show at <a href="https://jamstackconf.com/sf/">JAMStack Conf</a> in San Francisco.</p>
648</div>
649        <div><time class="item-meta">October 2019</time></div>
650      </li>
651      
652      <li class="item item-type-">
653        <h3 class="item-title">
654          <svg class="item-icon" height="16" width="16">
655            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
656          </svg>
657          Thundernerds
658        </h3>
659        
660        <div class="description"><p>I was invited onto the <a href="https://www.thundernerds.io/2019/10/build-prototypes-and-blogging-w-dave-rupert/">Thundernerds</a> to talk about prototypes, podcasting, and blogging.</p>
661</div>
662        <div><time class="item-meta">October 2019</time></div>
663      </li>
664      
665      <li class="item item-type-">
666        <h3 class="item-title">
667          <svg class="item-icon" height="16" width="16">
668            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
669          </svg>
670          Keyframers
671        </h3>
672        
673        <div class="description"><p>I crashed an episode of the <a href="https://www.youtube.com/watch?v=JAAVP4ECDHM">Keyframers</a>.</p>
674</div>
675        <div><time class="item-meta">October 2019</time></div>
676      </li>
677      
678      <li class="item item-type-">
679        <h3 class="item-title">
680          <svg class="item-icon" height="16" width="16">
681            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
682          </svg>
683          Prompts
684        </h3>
685        
686        <div class="description"><p><video src="/images/posts/2019/prompts.mp4" autoplay loop muted></video></p>
687<p><a href="https://prompts.daverupert.com">Prompts</a> is an Inktober-inspired drawing app for touchscreen devices</p>
688</div>
689        <div><time class="item-meta">October 2019</time></div>
690      </li>
691      
692      <li class="item item-type-">
693        <h3 class="item-title">
694          <svg class="item-icon" height="16" width="16">
695            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
696          </svg>
697          Artifact
698        </h3>
699        
700        <div class="description"><p>Presenting “What’s Changed and Where It’s Going” at <a href="https://artifactconf.com/">Artifact</a> in Austin, TX</p>
701</div>
702        <div><time class="item-meta">September 2019</time></div>
703      </li>
704      
705      <li class="item item-type-">
706        <h3 class="item-title">
707          <svg class="item-icon" height="16" width="16">
708            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
709          </svg>
710          An Event Apart DC
711        </h3>
712        
713        <div class="description"><p>Presented “What’s Changed and Where It’s Going”, a new talk at <a href="https://aneventapart.com/event/washington-dc-2019">An Event Apart DC</a> in Washington DC</p>
714</div>
715        <div><time class="item-meta">July 2018</time></div>
716      </li>
717      
718      <li class="item item-type-">
719        <h3 class="item-title">
720          <svg class="item-icon" height="16" width="16">
721            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
722          </svg>
723          AccessU Online 2019
724        </h3>
725        
726        <div class="description"><p>A short chat with Christopher Schmitt at the <a href="https://knowbility.org/programs/accessu/2019/accessu-online/">AccessU Online</a> Conference</p>
727</div>
728        <div><time class="item-meta">May 2018</time></div>
729      </li>
730      
731      <li class="item item-type-">
732        <h3 class="item-title">
733          <svg class="item-icon" height="16" width="16">
734            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
735          </svg>
736          Gymnasium Webinar
737        </h3>
738        
739        <div class="description"><p>A chat about prototypes over at <a href="https://thegymnasium.com/">The Gymnasium</a></p>
740</div>
741        <div><time class="item-meta">May 2018</time></div>
742      </li>
743      
744      <li class="item item-type-">
745        <h3 class="item-title">
746          <svg class="item-icon" height="16" width="16">
747            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
748          </svg>
749          CodePen Radio
750        </h3>
751        
752        <div class="description"><p>Trent Walton and I joined CodePen Radio to talk about how we do prototyping at Paravel: <a href="https://blog.codepen.io/2019/01/15/206-prototyping-with-dave-and-trent/">Prototyping with Dave and Trent</a></p>
753</div>
754        <div><time class="item-meta">December 2018</time></div>
755      </li>
756      
757    </ul>
758  </div>
759
760  <div class="timeline-year">
761    <div>
762      <h2 class="timeline-title">2018</h2>
763    </div>
764    <ul class="item-list">
765      
766      <li class="item item-type-">
767        <h3 class="item-title">
768          <svg class="item-icon" height="16" width="16">
769            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
770          </svg>
771          Show Me Your Mic
772        </h3>
773        
774        <div class="description"><p>I rejoined Chris Enns’ podcast about podcasting and talked about “<a href="https://goodstuff.fm/smym/123">Can Podcasting Go Windows?</a>”</p>
775</div>
776        <div><time class="item-meta">December 2018</time></div>
777      </li>
778      
779      <li class="item item-type-">
780        <h3 class="item-title">
781          <svg class="item-icon" height="16" width="16">
782            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
783          </svg>
784          An Event Apart Chicago
785        </h3>
786        
787        <div class="description"><p>Presenting a new talk called “The Four Divine Beasts of Accessibility”</p>
788</div>
789        <div><time class="item-meta">August 2018</time></div>
790      </li>
791      
792      <li class="item item-type-">
793        <h3 class="item-title">
794          <svg class="item-icon" height="16" width="16">
795            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
796          </svg>
797          A11Y Nutrition Cards
798        </h3>
799        
800        <div class="description"><p><a href="https://davatron5000.github.io/a11y-nutrition-cards">A11y Nutrition Cards</a>, a new open source project focusing on presenting accessible expectations in a consumable manner.</p>
801</div>
802        <div><time class="item-meta">August 2018</time></div>
803      </li>
804      
805      <li class="item item-type-">
806        <h3 class="item-title">
807          <svg class="item-icon" height="16" width="16">
808            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
809          </svg>
810          An Event Apart DC
811        </h3>
812        
813        <div class="description"><p>Presenting a new talk called “The Four Divine Beasts of Accessibility”</p>
814</div>
815        <div><time class="item-meta">August 2018</time></div>
816      </li>
817      
818      <li class="item item-type-">
819        <h3 class="item-title">
820          <svg class="item-icon" height="16" width="16">
821            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
822          </svg>
823          Austin JavaScript
824        </h3>
825        
826        <div class="description"><p>Spur of the moment ask to debut my new talk “The Four Divine Beasts of Accessibility”</p>
827</div>
828        <div><time class="item-meta">July 2018</time></div>
829      </li>
830      
831      <li class="item item-type-">
832        <h3 class="item-title">
833          <svg class="item-icon" height="16" width="16">
834            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
835          </svg>
836          ❬ASIDE❭ QUEST
837        </h3>
838        
839        <div class="description"><p><a href="https://asidequest.simplecast.fm/">❬ASIDE❭ QUEST</a> is a video games podcast for people too busy to play video games with my friend Danh Hoang.</p>
840</div>
841        <div><time class="item-meta">January 2018</time></div>
842      </li>
843      
844      <li class="item item-type-">
845        <h3 class="item-title">
846          <svg class="item-icon" height="16" width="16">
847            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
848          </svg>
849          ███ ████
850        </h3>
851        
852        <div class="description"><p>██ ███ ████ █████ ███ ████.</p>
853</div>
854        <div><time class="item-meta">January 2018</time></div>
855      </li>
856      
857    </ul>
858  </div>
859
860  <div class="timeline-year">
861    <div>
862      <h2 class="timeline-title">2017</h2>
863    </div>
864    <ul class="item-list">
865      
866      <li class="item item-type-">
867        <h3 class="item-title">
868          <svg class="item-icon" height="16" width="16">
869            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
870          </svg>
871          Refresh Austin
872        </h3>
873        
874        <div class="description"><p>Presented “Vague, but exciting 2.1” in my hometown at <a href="http://www.refreshaustin.org/">Refresh Austin</a>.</p>
875</div>
876        <div><time class="item-meta">November 2017</time></div>
877      </li>
878      
879      <li class="item item-type-">
880        <h3 class="item-title">
881          <svg class="item-icon" height="16" width="16">
882            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
883          </svg>
884          Beyond Tellerand Berlin
885        </h3>
886        
887        <div class="description"><p>Presented “Vague, but exciting 2.0” at <a href="https://beyondtellerrand.com/">Beyond Tellerand</a>
887 in Berlin, Germany.</p>
888</div>
889        <div><time class="item-meta">November 2017</time></div>
890      </li>
891      
892      <li class="item item-type-">
893        <h3 class="item-title">
894          <svg class="item-icon" height="16" width="16">
895            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
896          </svg>
897          Austin on Rails
898        </h3>
899        
900        <div class="description"><p>Spoke to the local <a href="http://www.austinonrails.org/">Austin on Rails</a> meetup about building Progressive Web Apps.</p>
901</div>
902        <div><time class="item-meta">October 2017</time></div>
903      </li>
904      
905      <li class="item item-type-">
906        <h3 class="item-title">
907          <svg class="item-icon" height="16" width="16">
908            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
909          </svg>
910          CSSDevConf Keynote QA
911        </h3>
912        
913        <div class="description"><p>Closing Keynote QA at CSSDevConf. I was interviewed by author and conference organizer <a href="http://christopher.org/">Christopher Schmitt</a>.</p>
914</div>
915        <div><time class="item-meta">October 2017</time></div>
916      </li>
917      
918      <li class="item item-type-">
919        <h3 class="item-title">
920          <svg class="item-icon" height="16" width="16">
921            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
922          </svg>
923          CSSDevConf Session
924        </h3>
925        
926        <div class="description"><p>Semi-impromptu roundtable discussion called “Let’s Talk Burnout” where designers and developers shared causes, effects, and coping strategies for burnout.</p>
927</div>
928        <div><time class="item-meta">October 2017</time></div>
929      </li>
930      
931      <li class="item item-type-">
932        <h3 class="item-title">
933          <svg class="item-icon" height="16" width="16">
934            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
935          </svg>
936          Squares Conference
937        </h3>
938        
939        <div class="description"><p>Presented an updated version of “Vague, but exciting” at <a href="http://squaresconference.com/">Squares Conference</a> in Grapevine, TX (Dallas). This time focusing on the question of how large creative projects get made.</p>
940</div>
941        <div><time class="item-meta">April 2017</time></div>
942      </li>
943      
944    </ul>
945  </div>
946
947  <div class="timeline-year">
948    <div>
949      <h2 class="timeline-title">2016</h2>
950    </div>
951    <ul class="item-list">
952      
953      <li class="item item-type-">
954        <h3 class="item-title">
955          <svg class="item-icon" height="16" width="16">
956            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
957          </svg>
958          Smashing Conference Freiburg
959        </h3>
960        
961        <div class="description"><p>Presented “Vague, but exciting” at <a href="https://smashingconf.com/freiburg-2016/">Smashing Conference</a> in Freiburg, Germany.</p>
962</div>
963        <div><time class="item-meta">September 2016</time></div>
964      </li>
965      
966      <li class="item item-type-">
967        <h3 class="item-title">
968          <svg class="item-icon" height="16" width="16">
969            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
970          </svg>
971          Austin JavaScript
972        </h3>
973        
974        <div class="description"><p>Debut of a new talk at <a href="http://austinjavascript.com">Austin JavaScript</a>: Progressive Web Apps (on Ruby on Rails (at a JavaScript Meetup)). <a href="https://speakerdeck.com/davatron5000/progressive-web-apps">Slides</a></p>
975</div>
976        <div><time class="item-meta">July 2016</time></div>
977      </li>
978      
979      <li class="item item-type-">
980        <h3 class="item-title">
981          <svg class="item-icon" height="16" width="16">
982            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
983          </svg>
984          An Event Apart DC
985        </h3>
986        
987        <div class="description"><p>Debut of a new talk  at <a href="http://aneventapart.com">An Event Apart DC</a>: Vague But Exciting. Discussing how we can use prototypes to quickly build out new ideas.</p>
988</div>
989        <div><time class="item-meta">July 2016</time></div>
990      </li>
991      
992      <li class="item item-type-">
993        <h3 class="item-title">
994          <svg class="item-icon" height="16" width="16">
995            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
996          </svg>
997          Global Defense
998        </h3>
999        
1000        <div class="description"><a href="http://globaldefense.club/">
1001  <img loading="lazy" src="/images/posts/2016/global-defense.gif" alt="DayTrip"/>
1002</a>
1003Launched my first game Global Defense. A massive multiplayer online space defender.
1004</div>
1005        <div><time class="item-meta">June 2016</time></div>
1006      </li>
1007      
1008      <li class="item item-type-">
1009        <h3 class="item-title">
1010          <svg class="item-icon" height="16" width="16">
1011            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1012          </svg>
1013          Between Players Podcast
1014        </h3>
1015        
1016        <div class="description"><p>My good friend Zach Meyer invited me on <a href="http://betweenplayers.com/episodes/2016/time.html">Between Players Episode 03: Time</a> to talk about the ideal video game length for working professionals and casual gamers.</p>
1017</div>
1018        <div><time class="item-meta">June 2016</time></div>
1019      </li>
1020      
1021      <li class="item item-type-">
1022        <h3 class="item-title">
1023          <svg class="item-icon" height="16" width="16">
1024            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1025          </svg>
1026          Live Shop Talk Show at Web Design Day in Pittsburg
1027        </h3>
1028        
1029        <div class="description"><p>Chris and I joined the festivities at Web Design Day in Pittsburg.</p>
1030</div>
1031        <div><time class="item-meta">June 2016</time></div>
1032      </li>
1033      
1034      <li class="item item-type-">
1035        <h3 class="item-title">
1036          <svg class="item-icon" height="16" width="16">
1037            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1038          </svg>
1039          .net Magazine Feature
1040        </h3>
1041        
1042        <div class="description"><p>I was featured in the March 2016 issue of .net Magazine. <a href="https://medium.com/net-magazine/interview-with-dave-rupert-abbd3a2a0a63">Read here</a></p>
1043</div>
1044        <div><time class="item-meta">March 2016</time></div>
1045      </li>
1046      
1047    </ul>
1048  </div>
1049
1050  <div class="timeline-year">
1051    <div>
1052      <h2 class="timeline-title">2015</h2>
1053    </div>
1054    <ul class="item-list">
1055      
1056      <li class="item item-type-">
1057        <h3 class="item-title">
1058          <svg class="item-icon" height="16" width="16">
1059            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1060          </svg>
1061          CSSDevConf Keynote
1062        </h3>
1063        
1064        <div class="description"><p>I was asked to do the closing keynote for <a href="http://cssdevconf.com/">CSSDevConf</a> aboard the H.M.S. Queen Mary in Long Beach, CA.</p>
1065</div>
1066        <div><time class="item-meta">October 2015</time></div>
1067      </li>
1068      
1069      <li class="item item-type-">
1070        <h3 class="item-title">
1071          <svg class="item-icon" height="16" width="16">
1072            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
1073          </svg>
1074          Dave Rupert: Working from Home
1075        </h3>
1076        
1077        <div class="description"><p>Martin Wolf invited me to <a href="https://martinwolf.org/blog/2015/08/dave-rupert-working-from-home">share about my workspace on his blog</a>.</p>
1078</div>
1079        <div><time class="item-meta">October 2015</time></div>
1080      </li>
1081      
1082      <li class="item item-type-">
1083        <h3 class="item-title">
1084          <svg class="item-icon" height="16" width="16">
1085            <use xlink:href="/images/spritemap-about.svg#icon-heart"></use>
1086          </svg>
1087          Emi Jeanne Rupert
1088        </h3>
1089        
1090        <div class="description"><p>My second child Emi Jeanne Rupert was born.</p>
1091</div>
1092        <div><time class="item-meta">October 2015</time></div>
1093      </li>
1094      
1095      <li class="item item-type-">
1096        <h3 class="item-title">
1097          <svg class="item-icon" height="16" width="16">
1098            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1099          </svg>
1100          Live ShopTalk at An Event Apart Chicago
1101        </h3>
1102        
1103        <div class="description"><p><a href="http://shoptalkshow.com/">Live ShopTalkShow</a></p>
1104</div>
1105        <div><time class="item-meta">August 2015</time></div>
1106      </li>
1107      
1108      <li class="item item-type-">
1109        <h3 class="item-title">
1110          <svg class="item-icon" height="16" width="16">
1111            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1112          </svg>
1113          An Event Apart DC
1114        </h3>
1115        
1116        <div class="description"><p><a href="http://aneventapart.com/">Prototypes and Play</a></p>
1117</div>
1118        <div><time class="item-meta">July 2015</time></div>
1119      </li>
1120      
1121      <li class="item item-type-">
1122        <h3 class="item-title">
1123          <svg class="item-icon" height="16" width="16">
1124            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1125          </svg>
1126          DayTrip
1127        </h3>
1128        
1129        <div class="description"><a href="https://godaytrip.com/">
1130  <img loading="lazy" src="https://d13yacurqjgara.cloudfront.net/users/535/screenshots/2104093/daytrip_landing_1x.png" alt="DayTrip"/>
1131</a>
1132Paravel launches <a href="http://godaytrip.com/">DayTrip</a>, an app to help you break the Netflix cycle so you can go outside and play.
1133</div>
1134        <div><time class="item-meta">May 2015</time></div>
1135      </li>
1136      
1137      <li class="item item-type-">
1138        <h3 class="item-title">
1139          <svg class="item-icon" height="16" width="16">
1140            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1141          </svg>
1142          GenerateConf New York
1143        </h3>
1144        
1145        <div class="description"><p><a href="http://generateconf.com/">Prototypes and Play</a></p>
1146</div>
1147        <div><time class="item-meta">April 2015</time></div>
1148      </li>
1149      
1150      <li class="item item-type-">
1151        <h3 class="item-title">
1152          <svg class="item-icon" height="16" width="16">
1153            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1154          </svg>
1155          Styleguides Podcast
1156        </h3>
1157        
1158        <div class="description"><p>I was invited by Anna Debenham and Brad Frost to be on the <a href="http://styleguides.io/podcast/dave-rupert/">Styleguides Podcast</a></p>
1159</div>
1160        <div><time class="item-meta">March 2015</time></div>
1161      </li>
1162      
1163      <li class="item item-type-">
1164        <h3 class="item-title">
1165          <svg class="item-icon" height="16" width="16">
1166            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1167          </svg>
1168          Responsive Web Design Summit 2015
1169        </h3>
1170        
1171        <div class="description"><p><a href="http://rwdsummit.com/">Automate Your Tools</a></p>
1172</div>
1173        <div><time class="item-meta">March 2015</time></div>
1174      </li>
1175      
1176      <li class="item item-type-">
1177        <h3 class="item-title">
1178          <svg class="item-icon" height="16" width="16">
1179            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1180          </svg>
1181          An Event Apart Atlanta
1182        </h3>
1183        
1184        <div class="description"><p><a href="http://aneventapart.com/">Prototypes and Play</a></p>
1185</div>
1186        <div><time class="item-meta">February 2015</time></div>
1187      </li>
1188      
1189    </ul>
1190  </div>
1191
1192  <div class="timeline-year">
1193    <div>
1194      <h2 class="timeline-title">2014</h2>
1195    </div>
1196    <ul class="item-list">
1197      
1198      <li class="item item-type-">
1199        <h3 class="item-title">
1200          <svg class="item-icon" height="16" width="16">
1201            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1202          </svg>
1203          Two Minute Warning with Paul Russo
1204        </h3>
1205        
1206        <div class="description"><p><a href="https://twominutepaul.simplecast.fm">Two Minute Warning with Paul Russo</a> is a podcast with my friend and Austin treasure, Paul Russo. We get drunk and Paul distills his wisdom and thoughts into two minute doses.</p>
1207</div>
1208        <div><time class="item-meta">August 2014</time></div>
1209      </li>
1210      
1211      <li class="item item-type-">
1212        <h3 class="item-title">
1213          <svg class="item-icon" height="16" width="16">
1214            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1215          </svg>
1216          Front End Summit 2014
1217        </h3>
1218        
1219        <div class="description"><p><a href="http://frontendsummit.com/">Automate Your Tools</a></p>
1220</div>
1221        <div><time class="item-meta">August 2014</time></div>
1222      </li>
1223      
1224      <li class="item item-type-">
1225        <h3 class="item-title">
1226          <svg class="item-icon" height="16" width="16">
1227            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1228          </svg>
1229          Artifact Austin 2014
1230        </h3>
1231        
1232        <div class="description"><p><a href="http://artifactconf.com/">Automate Your Tools</a></p>
1233</div>
1234        <div><time class="item-meta">May 2014</time></div>
1235      </li>
1236      
1237      <li class="item item-type-">
1238        <h3 class="item-title">
1239          <svg class="item-icon" height="16" width="16">
1240            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1241          </svg>
1242          Smashing Conf, Oxford 2014
1243        </h3>
1244        
1245        <div class="description"><p><a href="http://smashingconf.com/">Real-life Responsive Web Design</a></p>
1246</div>
1247        <div><time class="item-meta">March 2014</time></div>
1248      </li>
1249      
1250      <li class="item item-type-">
1251        <h3 class="item-title">
1252          <svg class="item-icon" height="16" width="16">
1253            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1254          </svg>
1255          InControl Orlando 2014
1256        </h3>
1257        
1258        <div class="description"><p><a href="http://incontrolconference.com/">Automate Your Tools</a></p>
1259</div>
1260        <div><time class="item-meta">February 2014</time></div>
1261      </li>
1262      
1263    </ul>
1264  </div>
1265
1266  <div class="timeline-year">
1267    <div>
1268      <h2 class="timeline-title">2013</h2>
1269    </div>
1270    <ul class="item-list">
1271      
1272      <li class="item item-type-">
1273        <h3 class="item-title">
1274          <svg class="item-icon" height="16" width="16">
1275            <use xlink:href="/images/spritemap-about.svg#icon-heart"></use>
1276          </svg>
1277          Otis Rupert
1278        </h3>
1279        
1280        <div class="description"><p>My first child Otis Rupert was born.</p>
1281</div>
1282        <div><time class="item-meta">August 2015</time></div>
1283      </li>
1284      
1285      <li class="item item-type-">
1286        <h3 class="item-title">
1287          <svg class="item-icon" height="16" width="16">
1288            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1289          </svg>
1290          Live ShopTalk at Front-End Conference, St. Petersburg, FL
1291        </h3>
1292        
1293        <div class="description"><a href="http://shoptalkshow.com/episodes/live-from-front-end-conf/">
1294  <img loading="lazy" src="/images/about/cutouts.jpg" alt="Chris and Dave Cutouts"/>
1295</a>
1296</div>
1297        <div><time class="item-meta">June 2013</time></div>
1298      </li>
1299      
1300      <li class="item item-type-">
1301        <h3 class="item-title">
1302          <svg class="item-icon" height="16" width="16">
1303            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1304          </svg>
1305          TXJS 2013
1306        </h3>
1307        
1308        <div class="description"><p><a href="http://texasjavascript.com"></a></p>
1309</div>
1310        <div><time class="item-meta">April 2013</time></div>
1311      </li>
1312      
1313      <li class="item item-type-">
1314        <h3 class="item-title">
1315          <svg class="item-icon" height="16" width="16">
1316            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1317          </svg>
1318          SXSW 2013 Panel Discussion
1319        </h3>
1320        
1321        <div class="description"><p><a href="http://soundcloud.com/officialsxsw/about-wysiwys-what-you-see-is">WYSIWYS – What you see is what you spec’d</a></p>
1322</div>
1323        <div><time class="item-meta">March 2013</time></div>
1324      </li>
1325      
1326      <li class="item item-type-">
1327        <h3 class="item-title">
1328          <svg class="item-icon" height="16" width="16">
1329            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1330          </svg>
1331          Show me Your Mic Podcast
1332        </h3>
1333        
1334        <div class="description"><p>Chris Enns invited me to be on <a href="http://goodstuff.fm/smym/1">Show Me Your Mic Episode 1</a>, a podcast for podcasters about gear.</p>
1335</div>
1336        <div><time class="item-meta">February 2013</time></div>
1337      </li>
1338      
1339      <li class="item item-type-">
1340        <h3 class="item-title">
1341          <svg class="item-icon" height="16" width="16">
1342            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1343          </svg>
1344          The Accessibility Project
1345        </h3>
1346        
1347        <div class="description"><p><a href="http://a11yproject.com/">A11YProject.com</a></p>
1348</div>
1349        <div><time class="item-meta">January 2013</time></div>
1350      </li>
1351      
1352    </ul>
1353  </div>
1354
1355  <div class="timeline-year">
1356    <div>
1357      <h2 class="timeline-title">2012</h2>
1358    </div>
1359    <ul class="item-list">
1360      
1361      <li class="item item-type-">
1362        <h3 class="item-title">
1363          <svg class="item-icon" height="16" width="16">
1364            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1365          </svg>
1366          In Control Conference and CSS Dev Conference, Hawaii
1367        </h3>
1368        
1369        <div class="description"><p>Spoke on <a href="">HTML5 &amp; Mobile</a> and <a href="">Gettin’ Flexy</a></p>
1370</div>
1371        <div><time class="item-meta">October 2012</time></div>
1372      </li>
1373      
1374      <li class="item item-type-">
1375        <h3 class="item-title">
1376          <svg class="item-icon" height="16" width="16">
1377            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1378          </svg>
1379          Microsoft.com
1380        </h3>
1381        
1382        <div class="description"><p><a href="http://microsoft.com"><img src="/images/about/ms.png" alt="Microsoft"/></a><br/>Paravel designs and builds a brand new <a href="http://microsoft.com">Microsoft.com</a> homepage.</p>
1383</div>
1384        <div><time class="item-meta">October 2012</time></div>
1385      </li>
1386      
1387      <li class="item item-type-">
1388        <h3 class="item-title">
1389          <svg class="item-icon" height="16" width="16">
1390            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
1391          </svg>
1392          A List Apart
1393        </h3>
1394        
1395        <div class="description"><p><a href="http://alistapart.com/articles/mo-pixels-mo-problems/"><img src="/images/about/hotdog.png"/></a><br/><a href="http://www.alistapart.com/articles/mo-pixels-mo-problems/">Mo’ Pixels Mo’ Problems</a></p>
1396</div>
1397        <div><time class="item-meta">September 2012</time></div>
1398      </li>
1399      
1400      <li class="item item-type-">
1401        <h3 class="item-title">
1402          <svg class="item-icon" height="16" width="16">
1403            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1404          </svg>
1405          Unmatched Style Ep. 80
1406        </h3>
1407        
1408        <div class="description"><p><a href="http://unmatchedstyle.com/news/all-about-responsive-design-ep-80.php">All About Responsive Design</a></p>
1409</div>
1410        <div><time class="item-meta">September 2012</time></div>
1411      </li>
1412      
1413      <li class="item item-type-">
1414        <h3 class="item-title">
1415          <svg class="item-icon" height="16" width="16">
1416            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
1417          </svg>
1418          .net Magazine
1419        </h3>
1420        
1421        <div class="description"><p><a href="http://www.netmagazine.com/features/five-steps-gettin-flexy-responsive-web-design">5 Steps to Getting Flexy</a></p>
1422</div>
1423        <div><time class="item-meta">September 2012</time></div>
1424      </li>
1425      
1426      <li class="item item-type-">
1427        <h3 class="item-title">
1428          <svg class="item-icon" height="16" width="16">
1429            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1430          </svg>
1431          CSS Summit &amp; RWD Summit
1432        </h3>
1433        
1434        <div class="description"><p>Spoke at the <a href="http://csssummit.com">CSS Summit</a> &amp; <a href="http://rwdsummit.com">RWD Summit</a> put on by <a href="http://environmentsforhumans.com">Environments for Humans</a>.</p>
1435</div>
1436        <div><time class="item-meta">August 2012</time></div>
1437      </li>
1438      
1439      <li class="item item-type-">
1440        <h3 class="item-title">
1441          <svg class="item-icon" height="16" width="16">
1442            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1443          </svg>
1444          The East Wing
1445        </h3>
1446        
1447        <div class="description"><p><a href="http://theeastwing.net/episodes/21-dave">Just Microphones and Talking with Dave Rupert</a></p>
1448</div>
1449        <div><time class="item-meta">August 2012</time></div>
1450      </li>
1451      
1452      <li class="item item-type-">
1453        <h3 class="item-title">
1454          <svg class="item-icon" height="16" width="16">
1455            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
1456          </svg>
1457          The Phuse
1458        </h3>
1459        
1460        <div class="description"><p><a href="http://thephuse.com/dev-talk/dev-talk-with-dave-rupert/">Dev Talk with Dave Rupert</a></p>
1461</div>
1462        <div><time class="item-meta">July 2012</time></div>
1463      </li>
1464      
1465      <li class="item item-type-">
1466        <h3 class="item-title">
1467          <svg class="item-icon" height="16" width="16">
1468            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1469          </svg>
1470          TXJS
1471        </h3>
1472        
1473        <div class="description"><p><a href="">Javascript in Responsive Web Design</a></p>
1474</div>
1475        <div><time class="item-meta">June 2012</time></div>
1476      </li>
1477      
1478      <li class="item item-type-">
1479        <h3 class="item-title">
1480          <svg class="item-icon" height="16" width="16">
1481            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1482          </svg>
1483          Refresh Austin
1484        </h3>
1485        
1486        <div><time class="item-meta">June 2012</time></div>
1487      </li>
1488      
1489      <li class="item item-type-">
1490        <h3 class="item-title">
1491          <svg class="item-icon" height="16" width="16">
1492            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1493          </svg>
1494          Front End Design Conference
1495        </h3>
1496        
1497        <div class="description"><p><a href="http://frontenddesignconf.com"><img loading="lazy" src="/images/about/frontend.png" /></a><br/>
1498<a href="http://frontenddesignconf.com">Flexible Media in Responsive Web Design</a></p>
1499</div>
1500        <div><time class="item-meta">June 2012</time></div>
1501      </li>
1502      
1503      <li class="item item-type-">
1504        <h3 class="item-title">
1505          <svg class="item-icon" height="16" width="16">
1506            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1507          </svg>
1508          The Industry Radio Show
1509        </h3>
1510        
1511        <div class="description"><p><a href="http://theindustry.cc/2012/05/30/11-coda-2-and-diet-coda-launches-github-is-raising-a-round-and-spacex-dragon-makes-history/">
1511#11: Coda 2 and Diet Coda Launches, GitHub is Raising a Round and SpaceX Dragon Makes History</a></p>
1512</div>
1513        <div><time class="item-meta">May 2012</time></div>
1514      </li>
1515      
1516      <li class="item item-type-">
1517        <h3 class="item-title">
1518          <svg class="item-icon" height="16" width="16">
1519            <use xlink:href="/images/spritemap-about.svg#icon-microphone"></use>
1520          </svg>
1521          Non-Breaking Space Podcast
1522        </h3>
1523        
1524        <div class="description"><p><a href="http://nonbreakingspace.tv/shoptalk-crossover-with-chris-coyier-and-dave-rupert/">Chris Coyier and Dave Rupert (ShopTalk Crossover)</a></p>
1525</div>
1526        <div><time class="item-meta">March 2012</time></div>
1527      </li>
1528      
1529      <li class="item item-type-">
1530        <h3 class="item-title">
1531          <svg class="item-icon" height="16" width="16">
1532            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1533          </svg>
1534          ShopTalk
1535        </h3>
1536        
1537        <div class="description"><p><a href="http://shoptalkshow.com"><img loading="lazy" src="/images/about/shoptalkshow.png" /></a><br/>A podcast all about front end web design and development with Chris Coyier of <a href="http://css-tricks.com">CSS-Tricks</a></p>
1538</div>
1539        <div><time class="item-meta">January 2012</time></div>
1540      </li>
1541      
1542    </ul>
1543  </div>
1544
1545  <div class="timeline-year">
1546    <div>
1547      <h2 class="timeline-title">2011</h2>
1548    </div>
1549    <ul class="item-list">
1550      
1551      <li class="item item-type-">
1552        <h3 class="item-title">
1553          <svg class="item-icon" height="16" width="16">
1554            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1555          </svg>
1556          FitVids.js
1557        </h3>
1558        
1559        <div class="description"><p>Responsive video embeds with the help of <a href="http://chriscoyier.net/">Chris Coyier</a></p>
1560</div>
1561        <div><time class="item-meta">September 2011</time></div>
1562      </li>
1563      
1564      <li class="item item-type-">
1565        <h3 class="item-title">
1566          <svg class="item-icon" height="16" width="16">
1567            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1568          </svg>
1569          10k Apart
1570        </h3>
1571        
1572        <div class="description"><p>Paravel helped launch the Responsive 10k Apart contest with <a href="http://mixonline.com">Mix Online</a> and <a href="http://alistapart.com">A List Apart</a>.</p>
1573</div>
1574        <div><time class="item-meta">August 2011</time></div>
1575      </li>
1576      
1577      <li class="item item-type-">
1578        <h3 class="item-title">
1579          <svg class="item-icon" height="16" width="16">
1580            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1581          </svg>
1582          ConvergeSE
1583        </h3>
1584        
1585        <div class="description"><p><a href="https://github.com/Paravel/ConvergeSE">Web Type Workshop</a></p>
1586</div>
1587        <div><time class="item-meta">June 2011</time></div>
1588      </li>
1589      
1590      <li class="item item-type-">
1591        <h3 class="item-title">
1592          <svg class="item-icon" height="16" width="16">
1593            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1594          </svg>
1595          Goodfoot (for iPhone)
1596        </h3>
1597        
1598        <div class="description"><p><img loading="lazy" src="/images/about/goodfoot.jpeg"><br/>With the help of <a href="http://mattt.me">Mattt Thompson</a>, Paravel launched our first app <a href="http://goodfootapp.com">Goodfoot</a>, a Gowalla API-based pocket concierge.</p>
1599</div>
1600        <div><time class="item-meta">May 2011</time></div>
1601      </li>
1602      
1603      <li class="item item-type-">
1604        <h3 class="item-title">
1605          <svg class="item-icon" height="16" width="16">
1606            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1607          </svg>
1608          FitText.js
1609        </h3>
1610        
1611        <div class="description"><p>Launched <a href="http://fittextjs.com">FitText</a> a tiny jQuery plugin for scalable headlines.</p>
1612</div>
1613        <div><time class="item-meta">May 2011</time></div>
1614      </li>
1615      
1616      <li class="item item-type-">
1617        <h3 class="item-title">
1618          <svg class="item-icon" height="16" width="16">
1619            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1620          </svg>
1621          ATX Dribbble Meetup
1622        </h3>
1623        
1624        <div class="description"><p>Helped organize the first <a href="http://twitter.com/@atxwebshow/">Dribbble Meetup in Austin, TX</a>.</p>
1625</div>
1626        <div><time class="item-meta">April 2011</time></div>
1627      </li>
1628      
1629      <li class="item item-type-">
1630        <h3 class="item-title">
1631          <svg class="item-icon" height="16" width="16">
1632            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1633          </svg>
1634          Austin Javascript
1635        </h3>
1636        
1637        <div class="description"><p>
1637<a href="http://letteringjs.com">Lettering.js</a></p>
1638</div>
1639        <div><time class="item-meta">March 2011</time></div>
1640      </li>
1641      
1642      <li class="item item-type-">
1643        <h3 class="item-title">
1644          <svg class="item-icon" height="16" width="16">
1645            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1646          </svg>
1647          Regggionals
1648        </h3>
1649        
1650        <div class="description"><p>Launched <a href="http://regggionals.com">Regggionals</a>, a location based Dribbble browser with the help of <a href="http://mattt.me">Mattt Thompson</a> and <a href="http://drewyeaton.com/">Drew Yeaton</a>.</p>
1651</div>
1652        <div><time class="item-meta">February 2011</time></div>
1653      </li>
1654      
1655    </ul>
1656  </div>
1657
1658  <div class="timeline-year">
1659    <div>
1660      <h2 class="timeline-title">2010</h2>
1661    </div>
1662    <ul class="item-list">
1663      
1664      <li class="item item-type-">
1665        <h3 class="item-title">
1666          <svg class="item-icon" height="16" width="16">
1667            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1668          </svg>
1669          Lettering.js
1670        </h3>
1671        
1672        <div class="description"><p>Launched a <a href="http://letteringjs.com">glorified span injector</a>!</p>
1673</div>
1674        <div><time class="item-meta">September 2010</time></div>
1675      </li>
1676      
1677      <li class="item item-type-">
1678        <h3 class="item-title">
1679          <svg class="item-icon" height="16" width="16">
1680            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1681          </svg>
1682          Lost World's Fairs
1683        </h3>
1684        
1685        <div class="description"><p><a href="http://lostworldsfairs.com"><img loading="lazy" src="/images/about/atlantis.png"/></a><br/>Paravel teamed up with Naz Hamid, Frank Chimero, Jason Santa Maria and Microsoft to celebrate the launch of IE9.</p>
1686</div>
1687        <div><time class="item-meta">September 2010</time></div>
1688      </li>
1689      
1690      <li class="item item-type-">
1691        <h3 class="item-title">
1692          <svg class="item-icon" height="16" width="16">
1693            <use xlink:href="/images/spritemap-about.svg#icon-pencil"></use>
1694          </svg>
1695          .net Magazine
1696        </h3>
1697        
1698        <div class="description"><p>Co-wrote an article with Trent Walton on CSS3 Transitions.</p>
1699</div>
1700        <div><time class="item-meta">July 2010</time></div>
1701      </li>
1702      
1703      <li class="item item-type-">
1704        <h3 class="item-title">
1705          <svg class="item-icon" height="16" width="16">
1706            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1707          </svg>
1708          The Many Faces Of...
1709        </h3>
1710        
1711        <div class="description"><p>Paravel launches a site about our love of <a href="http://themanyfacesof.com">movies and Alan Rickman</a>.</p>
1712</div>
1713        <div><time class="item-meta">April 2010</time></div>
1714      </li>
1715      
1716      <li class="item item-type-">
1717        <h3 class="item-title">
1718          <svg class="item-icon" height="16" width="16">
1719            <use xlink:href="/images/spritemap-about.svg#icon-comment"></use>
1720          </svg>
1721          Refresh Austin
1722        </h3>
1723        
1724        <div class="description"><p>Talk on Webkit’s CSS Transitions</p>
1725</div>
1726        <div><time class="item-meta">April 2010</time></div>
1727      </li>
1728      
1729    </ul>
1730  </div>
1731
1732  <div class="timeline-year">
1733    <div>
1734      <h2 class="timeline-title">2009</h2>
1735    </div>
1736    <ul class="item-list">
1737      
1738      <li class="item item-type-">
1739        <h3 class="item-title">
1740          <svg class="item-icon" height="16" width="16">
1741            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1742          </svg>
1743          ATX Web Show
1744        </h3>
1745        
1746        <div class="description"><p><a href="http://atxwebshow.com"><img loading="lazy" src="/images/about/atx.jpeg" /></a></p>
1747</div>
1748        <div><time class="item-meta">October 2009</time></div>
1749      </li>
1750      
1751      <li class="item item-type-">
1752        <h3 class="item-title">
1753          <svg class="item-icon" height="16" width="16">
1754            <use xlink:href="/images/spritemap-about.svg#icon-location"></use>
1755          </svg>
1756          Moved back to Austin
1757        </h3>
1758        
1759        <div class="description"></div>
1760        <div><time class="item-meta">July 2009</time></div>
1761      </li>
1762      
1763    </ul>
1764  </div>
1765
1766  <div class="timeline-year">
1767    <div>
1768      <h2 class="timeline-title">Earlier</h2>
1769    </div>
1770    <ul class="item-list">
1771      
1772      <li class="item item-type-">
1773        <h3 class="item-title">
1774          <svg class="item-icon" height="16" width="16">
1775            <use xlink:href="/images/spritemap-about.svg#icon-heart"></use>
1776          </svg>
1777          Married Jessica Conklin
1778        </h3>
1779        
1780        <div class="description"><p>She was in <a href="http://www.rdio.com/artist/Bodies_Of_Water/">a rock band</a>, she stole my heart, so I married her.</p>
1781</div>
1782        <div><time class="item-meta">June 2008</time></div>
1783      </li>
1784      
1785      <li class="item item-type-">
1786        <h3 class="item-title">
1787          <svg class="item-icon" height="16" width="16">
1788            <use xlink:href="/images/spritemap-about.svg#icon-rocket"></use>
1789          </svg>
1790          Paravel
1791        </h3>
1792        
1793        <div class="description"><p>Formed <a href="http://paravelinc.com">Paravel</a> with good friends <a href="http://trentwalton.com">Trent Walton</a> and <a href="http://reaganray.com">Reagan Ray</a></p>
1794</div>
1795        <div><time class="item-meta">July 2007</time></div>
1796      </li>
1797      
1798      <li class="item item-type-">
1799        <h3 class="item-title">
1800          <svg class="item-icon" height="16" width="16">
1801            <use xlink:href="/images/spritemap-about.svg#icon-location"></use>
1802          </svg>
1803          JET Programme
1804        </h3>
1805        
1806        <div class="description"><p>Lived in Sasayama, Hyogo Prefecture teaching English on the <a href="http://www.jetprogramme.org/">JET Programme</a> from 2003–2006.</p>
1807</div>
1808        <div><time class="item-meta">July 2003</time></div>
1809      </li>
1810      
1811      <li class="item item-type-">
1812        <h3 class="item-title">
1813          <svg class="item-icon" height="16" width="16">
1814            <use xlink:href="/images/spritemap-about.svg#icon-graduation"></use>
1815          </svg>
1816          University of Texas at Austin
1817        </h3>
1818        
1819        <div class="description"><p>Graduated from the <a href="http://utexas.edu">University of Texas at Austin</a> with a degree in Japanese<br/>(日本語OK).</p>
1820</div>
1821        <div><time class="item-meta">August 2002</time></div>
1822      </li>
1823      
1824    </ul>
1825  </div>
1826
1827</section>
1828
1829  </div>
1830</article>
1831
1832  </main>
1833
1834  
1835  <footer id="footer" class="container outdent">
1836  <div class="copyright">&copy; 2026 Dave Rupert, LLC &middot; <a href="/atom.xml">RSS</a></div>
1837  <div class="flex">
1838    <div class="flex">
1839      <div>
1840        <ul>
1841          <li><a href="/about">/about</a></li>
1842          <li><a href="/uses">/uses</a></li>
1843          <li><a href="/likes">/likes</a></li>
1844          <li><a href="/support">/support</a></li>
1845        </ul>
1846      </div>
1847      <div>
1848        <ul>
1849          <li><a href="/archive">/archive</a></li>
1850          <li><a href="/projects">/projects</a></li>
1851          <li><a href="/stories">/stories</a></li>
1852          <li>
1852<a href="/bookshelf">/bookshelf</a></li>
1853        </ul>
1854      </div>
1855    </div>
1856    <div>
1857      <ul>
1858        <li><a rel="me" href="https://mastodon.social/@davatron5000">mastodon</a></li>
1859        <li><a rel="me" href="https://bsky.app/profile/davatron5000.bsky.social">bluesky</a></li>
1860        <li><a href="http://github.com/davatron5000/">github</a></li>
1861      </ul>
1862    </div>
1863  </div>
1864</footer>
1865
1866
1867  
1868
1869  
1869<script type="module">
1870    if (CSS.highlights && window.Highlight && document.querySelector('pre > code')) {
1871      import('/javascripts/microlighter/microlighter.min.js');
1872    }
1873  </script>
1873
1874  
1874<script>
1875    if ('serviceWorker' in navigator) {
1876      // Register a service worker hosted at the root of the
1877      // site using the default scope.
1878      navigator.serviceWorker.register('/service-worker.js').then(function(registration) {
1879        // console.log('Service worker registration succeeded:', registration);
1880      }).catch(function(error) {
1881        // console.log('Service worker registration failed:', error);
1882      });
1883    } else {
1884      console.log('Service workers are not supported.');
1885    }
1886
1887    // Set --hue-rotate to current day of year divided by 365
1888    const dayOfYear = date => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / (1000 * 60 * 60 * 24));
1889    const yearProgress = dayOfYear(new Date()) / 365;
1890    document.documentElement.style.setProperty('--hue-rotate', Math.floor(yearProgress * 360));
1891
1892  </script>
1892
1893</body>
1894</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.