<?xml version="1.0" encoding="UTF-8"?>
 <rdf:RDF xmlns="http://purl.org/rss/1.0/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" xmlns:syn="http://purl.org/rss/1.0/modules/syndication/" xmlns:admin="http://webns.net/mvcb/">
  <channel rdf:about="http://pinboard.in">
    <title>Pinboard (jtyost2)</title>
    <link>https://pinboard.in/u:jtyost2/public/</link>
    <description>recent bookmarks from jtyost2</description>
    <items>
      <rdf:Seq>	<rdf:li rdf:resource="https://twitter.com/davidonionball/status/1134862173790973953/photo/1"/>
	<rdf:li rdf:resource="https://www.reddit.com/r/css/comments/bul1oh/so_my_colleague_just_wrote_some_interesting_css/"/>
	<rdf:li rdf:resource="https://cloudfour.com/thinks/see-no-evil-hidden-content-and-accessibility/"/>
	<rdf:li rdf:resource="https://css-tricks.com/downsides-of-smooth-scrolling/"/>
	<rdf:li rdf:resource="https://notlaura.com/a-quick-css-algorithm-for-handling-the-wp-admin-bar-with-a-fixed-menu/"/>
	<rdf:li rdf:resource="https://github.com/mozdevs/cssremedy"/>
	<rdf:li rdf:resource="http://sassmeister.com/gist/070d070859f89edaa2e8"/>
	<rdf:li rdf:resource="http://benfrain.com/browser-representatives-on-css-performance/"/>
	<rdf:li rdf:resource="http://css-tricks.com/simple-css-row-column-highlighting/"/>
	<rdf:li rdf:resource="http://calendar.perfplanet.com/2014/hardware-accelerated-css-the-nice-vs-the-naughty/"/>
	<rdf:li rdf:resource="http://css-tricks.com/positioning-offset-background-images/"/>
	<rdf:li rdf:resource="http://24ways.org/2014/five-ways-to-animate-responsibly/"/>
	<rdf:li rdf:resource="http://www.quirksmode.org/blog/archives/2014/11/android_gradien.html"/>
	<rdf:li rdf:resource="http://codersblock.com/blog/fun-times-with-css-counters/"/>
	<rdf:li rdf:resource="http://css-tricks.com/scroll-fix-content/"/>
	<rdf:li rdf:resource="https://github.com/SlexAxton/css-colorguard"/>
	<rdf:li rdf:resource="http://css-tricks.com/probably-dont-base64-svg/"/>
	<rdf:li rdf:resource="http://blog.8thlight.com/nelsol-batalla/2014/08/01/bem-basics.html"/>
	<rdf:li rdf:resource="https://medium.com/@fat/mediums-css-is-actually-pretty-fucking-good-b8e2a6c78b06"/>
	<rdf:li rdf:resource="https://twitter.com/thomasfuchs/status/493790680397803521"/>
	<rdf:li rdf:resource="https://pchiusano.github.io/2014-07-02/css-is-unnecessary.html"/>
	<rdf:li rdf:resource="https://medium.com/p/3d1b0a9b810e"/>
	<rdf:li rdf:resource="http://j.eremy.net/confused-about-rem-and-em/"/>
	<rdf:li rdf:resource="http://css-tricks.com/line-menu-icon-menu/"/>
	<rdf:li rdf:resource="http://calendar.perfplanet.com/2013/the-runtime-performance-checklist/"/>
	<rdf:li rdf:resource="http://daverupert.com/2014/01/4K-RWD/"/>
	<rdf:li rdf:resource="http://css-tricks.com/make-sure-columns-dont-collapse-horizontally/"/>
	<rdf:li rdf:resource="http://demosthenes.info/blog/775/Which-CSS-Measurements-To-Use-When"/>
	<rdf:li rdf:resource="http://sethfowler.org/blog/2013/09/13/new-in-firefox-26-css-image-orientation/"/>
	<rdf:li rdf:resource="http://css-tricks.com/just-one-of-those-weird-things-about-css-background-on-body/"/>
	<rdf:li rdf:resource="http://daneden.me/type/"/>
	<rdf:li rdf:resource="http://css-tricks.com/replace-the-image-in-an-img-with-css/"/>
	<rdf:li rdf:resource="http://dabblet.com/gist/3979221/"/>
	<rdf:li rdf:resource="https://37signals.com/svn/posts/3511-recent-versions-of-google-chrome-on-os-x"/>
	<rdf:li rdf:resource="http://css-tricks.com/magic-numbers-in-css/"/>
	<rdf:li rdf:resource="https://github.com/zmoazeni/csscss"/>
	<rdf:li rdf:resource="http://tjvantoll.com/2013/04/15/list-of-pseudo-elements-to-style-form-controls/"/>
	<rdf:li rdf:resource="http://paulirish.com/2013/webkit-for-developers/"/>
	<rdf:li rdf:resource="http://css-tricks.com/mixing-responsive-design-and-mobile-templates/"/>
	<rdf:li rdf:resource="http://www.netmagazine.com/opinions/jeffrey-zeldman-dream-standards-based-web"/>
	<rdf:li rdf:resource="http://www.webstandards.org/2013/03/01/our-work-here-is-done/"/>
	<rdf:li rdf:resource="http://intridea.github.com/stately/"/>
	<rdf:li rdf:resource="http://bootswatch.com/"/>
	<rdf:li rdf:resource="http://www.campaignmonitor.com/blog/post/3921/outlook.com-drops-margin-and-float-support-entirely"/>
	<rdf:li rdf:resource="http://css-tricks.com/berg-cloud-buttons/"/>
	<rdf:li rdf:resource="http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email"/>
	<rdf:li rdf:resource="http://css-tricks.com/fly-in-newly-added-content-to-a-page/"/>
	<rdf:li rdf:resource="http://www.marco.org/2012/11/15/text-rendering-optimize-legibility"/>
	<rdf:li rdf:resource="http://maker.github.com/ratchet/"/>
	<rdf:li rdf:resource="http://css-tricks.com/the-facebook-loading-animation-in-css/"/>
	<rdf:li rdf:resource="http://stopdesign.com/archive/2012/10/11/ten-years-later.html"/>
	<rdf:li rdf:resource="http://blog.pictonic.co/post/32869817328/svgs-are-cool-but-icon-fonts-are-just-10-of-their"/>
	<rdf:li rdf:resource="http://codepen.io/joshnh/pen/ohbHl"/>
	<rdf:li rdf:resource="https://github.com/adobe/Source-Code-Pro"/>
	<rdf:li rdf:resource="http://html.adobe.com/edge/webfonts/"/>
	<rdf:li rdf:resource="http://www.xanthir.com/b4Ko0"/>
	<rdf:li rdf:resource="https://github.com/freqDec/slabText/"/>
	<rdf:li rdf:resource="http://www.campaignmonitor.com/blog/post/3780/removing-the-60-character-line-limit-on-plain-text-email"/>
	<rdf:li rdf:resource="http://codepen.io/chriscoyier/pen/lzjqh"/>
	<rdf:li rdf:resource="http://davidwalsh.name/text-align-start"/>
	<rdf:li rdf:resource="http://css-tricks.com/saving-the-day-with-scoped-css/"/>
	<rdf:li rdf:resource="http://jtauber.github.com/articles/css-hexagon.html"/>
	<rdf:li rdf:resource="http://mathiasbynens.be/notes/unquoted-font-family"/>
	<rdf:li rdf:resource="http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/"/>
	<rdf:li rdf:resource="http://www.ryancollins.me/?p=1041"/>
	<rdf:li rdf:resource="http://designshack.net/articles/css/whats-the-deal-with-display-inline-block/"/>
	<rdf:li rdf:resource="https://github.com/darcyclarke/Front-end-Developer-Interview-Questions"/>
	<rdf:li rdf:resource="http://playground.deaxon.com/css/progress-bar/"/>
	<rdf:li rdf:resource="http://www.frankieroberto.com/responsive_text"/>
	<rdf:li rdf:resource="http://dev.w3.org/csswg/css3-hierarchies/"/>
      </rdf:Seq>
    </items>
  </channel><item rdf:about="https://twitter.com/davidonionball/status/1134862173790973953/photo/1">
    <title>(429) https://twitter.com/davidonionball/status/1134862173790973953/photo/1</title>
    <dc:date>2019-06-05T01:22:00+00:00</dc:date>
    <link>https://twitter.com/davidonionball/status/1134862173790973953/photo/1</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[RT @davidonionball: This is the most disgusting thing I've seen in ages. 
From here:  #css #webdev ]]></description>
<dc:subject>css webdev</dc:subject>
<dc:source>https://twitter.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:8c6213e8a713/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdev"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://www.reddit.com/r/css/comments/bul1oh/so_my_colleague_just_wrote_some_interesting_css/">
    <title>So my colleague just wrote some interesting CSS... One of those &quot;just because you can doesn't mean you should&quot; cases. : css</title>
    <dc:date>2019-06-05T01:22:00+00:00</dc:date>
    <link>https://www.reddit.com/r/css/comments/bul1oh/so_my_colleague_just_wrote_some_interesting_css/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[RT @davidonionball: This is the most disgusting thing I've seen in ages. 
From here:  #css #webdev ]]></description>
<dc:subject>css webdev</dc:subject>
<dc:source>https://twitter.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:1df9f8e51ecd/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdev"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://cloudfour.com/thinks/see-no-evil-hidden-content-and-accessibility/">
    <title>See No Evil: Hidden Content and Accessibility</title>
    <dc:date>2019-03-16T18:24:33+00:00</dc:date>
    <link>https://cloudfour.com/thinks/see-no-evil-hidden-content-and-accessibility/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[When I first started learning web development I thought hiding content was simple: slap display: none; onto your hidden element and call it a day. Since then I’ve learned about screen readers, ARIA attributes, the HTML5 hidden attribute, and more!

It’s important to ensure our websites are accessible to everyone, regardless of whether or not they use a screen reader, but with this myriad of options, how do we know when to use what?

There are four main scenarios where you may wish to hide content:
1. Hiding content for everyone, regardless of whether they use a screen reader
2. Hiding content for screen readers while showing it to other users
3. Showing additional content for screen readers while hiding it from other users
4. Hiding content at specific screen sizes

Let’s dive deeper into each of those scenarios to learn how to handle them.]]></description>
<dc:subject>design software webdesign webdevelopment accessibility css html</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ee7eca63c2b3/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:accessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://css-tricks.com/downsides-of-smooth-scrolling/">
    <title>Downsides of Smooth Scrolling | CSS-Tricks</title>
    <dc:date>2019-03-11T21:50:33+00:00</dc:date>
    <link>https://css-tricks.com/downsides-of-smooth-scrolling/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[I can see not being able to adjust timing being a downside, but that wasn't what made me ditch smooth scrolling. The thing that seemed to frustrate a ton of people was on-page search. It's one thing to click a link and get zoomed to some header (that feels sorta good) but it's another when you're trying to quickly pop through matches when you do a Find on the page. People found the scrolling between matches slow and frustrating. I agreed.]]></description>
<dc:subject>css software html javascript webdesign webdevelopment</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:90cc763ca070/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://notlaura.com/a-quick-css-algorithm-for-handling-the-wp-admin-bar-with-a-fixed-menu/">
    <title>A quick CSS algorithm for handling the WP Admin bar with a fixed menu | Lara Schenck</title>
    <dc:date>2019-03-07T00:32:50+00:00</dc:date>
    <link>https://notlaura.com/a-quick-css-algorithm-for-handling-the-wp-admin-bar-with-a-fixed-menu/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Two very popular things that are kind of annoying when used together are fixed menu bars and WordPress. Why? Well, if the person writing CSS for your theme…]]></description>
<dc:subject>wordpress css</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:321abf22502f/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:wordpress"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/mozdevs/cssremedy">
    <title>CSS Remedy</title>
    <dc:date>2019-03-04T16:54:28+00:00</dc:date>
    <link>https://github.com/mozdevs/cssremedy</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Start your project with a remedy for the technical debt of CSS.A gift to you from Mozilla Developer Outreach. This project is just getting started. It's too…]]></description>
<dc:subject>css software webdevelopment webdesign framework</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:0b8df376048e/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:framework"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://sassmeister.com/gist/070d070859f89edaa2e8">
    <title>SassMeister | The Sass Playground!</title>
    <dc:date>2015-04-08T23:20:12+00:00</dc:date>
    <link>http://sassmeister.com/gist/070d070859f89edaa2e8</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[]]></description>
<dc:subject>css tooltips webdesign webdevelopment software programming</dc:subject>
<dc:source>https://twitter.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:4ca3e2f1c285/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:tooltips"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://benfrain.com/browser-representatives-on-css-performance/">
    <title>Browser representatives on CSS performance - Author and responsive web developer Ben Frain</title>
    <dc:date>2015-04-04T17:19:23+00:00</dc:date>
    <link>http://benfrain.com/browser-representatives-on-css-performance/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[If you’ve developed on the web for any non-trivial period of time you will know that the answer to most web related questions is ‘it depends’. I hate that there are no simple, cast-iron rules in relation to CSS performance that can be banked upon in every situation. I’d genuinely love to write those rules out here in a nice little paragraph and believe they would be universally true. But I can’t because there simply aren’t any universal truths in relation to performance. There can’t ever be any because there are simply too many variables. Engines update, layout methods become optimised,every DOM tree is different, all CSS files are different. On and on ad infinitum. You get the picture. I’m afraid the best I can offer is to not sweat things like CSS selectors or layout methods in advance. It’s unlikely they will be your problem (but, you know, they just might). Instead, concentrate on making ‘the thing’. Then, when ‘the thing’ is made, test ‘the thing’. If it’s slow or broke, find the problem and fix ‘the thing’.]]></description>
<dc:subject>css performance webdesign webdevelopment javascript browser</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:68b802b1dde4/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:performance"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:browser"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/simple-css-row-column-highlighting/">
    <title>Simple CSS-Only Row and Column Highlighting | CSS-Tricks</title>
    <dc:date>2015-02-01T04:05:51+00:00</dc:date>
    <link>http://css-tricks.com/simple-css-row-column-highlighting/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Highlighting rows of a table is pretty darn easy in CSS. tr:hover { background: yellow; } does well there. But highlighting columns has always been a little trickier, because there is no single HTML element that is parent to table cells in a column. A dash of JavaScript can handle it easily, but Andrew Howe recently emailed me to share a little trick he found on StackOverflow, posted by Matt Walton.

It was a few years old, so I thought I'd just clean it up and post it here.]]></description>
<dc:subject>css webdesign webdevelopment table highlight javascript</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:67c0ec86c4cd/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:table"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:highlight"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://calendar.perfplanet.com/2014/hardware-accelerated-css-the-nice-vs-the-naughty/">
    <title>Performance Calendar » Hardware Accelerated CSS: The Nice vs The Naughty</title>
    <dc:date>2015-01-01T20:09:19+00:00</dc:date>
    <link>http://calendar.perfplanet.com/2014/hardware-accelerated-css-the-nice-vs-the-naughty/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Everyone is fascinated with the smooth animation at 60 frames/second. It is hardly a surprise that one of the most prevalent performance advices to web developers is to use hardware accelerated CSS. In some extreme cases, it is not uncommon to imply that forcing it via translate3d will automatically boost your application performance (hint: it is not the case).

Modern web browsers can take advantage of the GPU (graphics processing unit) to accelerate page rendering. Among many different features of a GPU, it can hold a limited number of textures (a rectangle of pixels) and manipulate those textures efficiently, including applying a certain transformation (translation, scaling, rotating, etc). This is extremely useful to achieve a fluid animation. Instead of drawing the pixels for every animation frame, the browser will “snapshot” the DOM element and store it as a GPU texture (often called as layer). Later, the browser will simply tell the GPU to transform the said texture to give the perception of an animating DOM element. This is called GPU compositing, naturally referred to as “hardware acceleration”.

Unfortunately, a web browser is a complex piece of software (Firefox comprises millions of lines of code). Because of this, a blanket simplified statement such as “use translate3d for performance” is likely a hit-and-miss. It is thus imperative to understand a little more as to what happens under hood so that you can understand the situation better.]]></description>
<dc:subject>css software performance browser</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:92ba05f0ce45/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:performance"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:browser"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/positioning-offset-background-images/">
    <title>Positioning Offset Background Images | CSS-Tricks</title>
    <dc:date>2014-12-30T00:32:04+00:00</dc:date>
    <link>http://css-tricks.com/positioning-offset-background-images/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[If you need to position a background-image in CSS 20px from the left and 10px from the top, that's easy. You can do background-position: 20px 10px;. But what if you wanted to position it 20px from the right and 10px from the bottom?

Let's also assume we don't know the exact width and height of the element, which is likely, because fluid layouts and dynamic content. If we did, we could just do a little scratchpad math and use the normal background-position syntax.]]></description>
<dc:subject>css image</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:1c0e7cb7e7b2/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:image"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://24ways.org/2014/five-ways-to-animate-responsibly/">
    <title>Five Ways to Animate Responsibly ◆ 24 ways</title>
    <dc:date>2014-12-15T02:53:18+00:00</dc:date>
    <link>http://24ways.org/2014/five-ways-to-animate-responsibly/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Animation is a powerful tool in our web design arsenal. But we must take care: if we abuse animation it might get a bad reputation; if we underestimate it, it won’t be prioritized. But if we wield it thoughtfully, use it where it is both necessary and useful, and empower users to turn it off, animation is a tool that will help us build things that are easier to use and more delightful for years to come.]]></description>
<dc:subject>webdesign design css animation</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:c4f61bd09f50/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:animation"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.quirksmode.org/blog/archives/2014/11/android_gradien.html">
    <title>Android gradient screenshot madness - QuirksBlog</title>
    <dc:date>2014-11-26T04:08:03+00:00</dc:date>
    <link>http://www.quirksmode.org/blog/archives/2014/11/android_gradien.html</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[The real point here is that Android screenshots (and remote testing solutions that depend on them) are not reliable enough for web developers to use.]]></description>
<dc:subject>googleandroid software programming usability css webdesign webdevelopment hardware</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:f0d46253eabd/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:googleandroid"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:hardware"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://codersblock.com/blog/fun-times-with-css-counters/">
    <title>Coder's Block Blog / Fun Times with CSS Counters</title>
    <dc:date>2014-11-19T02:57:05+00:00</dc:date>
    <link>http://codersblock.com/blog/fun-times-with-css-counters/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[CSS counters are one of those “oh neat, didn’t know CSS could do that” features with a lot of interesting potential. In simple terms, they let you keep a running tally of things in CSS — no JavaScript needed.]]></description>
<dc:subject>css software webdesign webdevelopment</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ad170a4c5099/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/scroll-fix-content/">
    <title>Scroll-Then-Fix Content | CSS-Tricks</title>
    <dc:date>2014-11-06T01:21:15+00:00</dc:date>
    <link>http://css-tricks.com/scroll-fix-content/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Like most good tricks, there isn't much to it. All we do is think of (and design for) the two different possible states:

Search bar in its scrollable position
Search bar in its fixed header position
We toggle between them simply by changing a class name. There is no trickery with having two search forms that reveal themselves in different scenarios. That's good, as we don't want to smurf around with keeping those in sync. Much easier to just move a single one around.]]></description>
<dc:subject>design webdesign webdevelopment css html javascript</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ce02610bc8fa/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/SlexAxton/css-colorguard">
    <title>SlexAxton/css-colorguard</title>
    <dc:date>2014-10-26T00:11:49+00:00</dc:date>
    <link>https://github.com/SlexAxton/css-colorguard</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Every CSS project starts out with good intentions, but inevitably, one too many people eye-dropper colors into nooks and crannies that you never knew existed. CSS Colorguard helps you maintain the color set that you want, and warns you when colors you've added are too similar to ones that already exist. Naturally, it's all configurable to your tastes.]]></description>
<dc:subject>css color webdesign webdevelopment npm</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:05dd9121921e/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:color"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:npm"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/probably-dont-base64-svg/">
    <title>Probably Don't Base64 SVG | CSS-Tricks</title>
    <dc:date>2014-10-22T02:30:38+00:00</dc:date>
    <link>http://css-tricks.com/probably-dont-base64-svg/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[So that makes sense, right? If it's 4 characters for every 3 bytes, that's 133% bigger, with the variation coming from uneven lengths and thus padding.

Anyway, maybe this is all super obvious. But it just seems to me if you're going to use a data URI for SVG there is no reason to ever base64 it.]]></description>
<dc:subject>svg css base63 encoding webdesign webdevelopment</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:100f123a54a9/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:svg"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:base63"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:encoding"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://blog.8thlight.com/nelsol-batalla/2014/08/01/bem-basics.html">
    <title>BEM Basics | 8th Light</title>
    <dc:date>2014-09-27T23:21:44+00:00</dc:date>
    <link>http://blog.8thlight.com/nelsol-batalla/2014/08/01/bem-basics.html</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[My first foray into CSS methodologies came in the form of OOCSS and SMACSS. Both methodologies aim to make CSS more scalable and maintainable; where they differ is in their implementation. On a broad level, OOCSS focuses on separation of structure from skin, and separating container from content. On the other hand, SMACSS focuses on categorization of code that falls under five distinct categories. A third CSS methodology, BEM, is part of a holistic approach to front-end development that I think is an interesting way to organize CSS and HTML components.

BEM stands for Block, Element, Modifier. It focuses on organizing sections of a website into purposeful blocks, which are comprised of their functional elements, and are then manipulated by modifiers. BEM also employs a hierarchical naming convention that allows a team of developers to uniformly and immediately understand the lay of the land.]]></description>
<dc:subject>css software softwareengineering</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:c1c4527c74af/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:softwareengineering"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://medium.com/@fat/mediums-css-is-actually-pretty-fucking-good-b8e2a6c78b06">
    <title>Medium’s CSS is actually pretty fucking good.</title>
    <dc:date>2014-09-01T00:44:31+00:00</dc:date>
    <link>https://medium.com/@fat/mediums-css-is-actually-pretty-fucking-good-b8e2a6c78b06</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Undoubtedly we are in a better place then we were 2 years ago. Writing CSS at Medium is actually pretty pleasant and devs with different experience levels are contributing some pretty great stuff.

That said, the next CSS project will have to be around performance. As we continue to grow our story pages and push them to the next level, you can imagine how getting accurate, reliable measuring tools around layout and rendering performance is incredibly important… and kinda just sad that we don’t already have in 2014.

So that’s it. There’s more to do, but I’m feeling pretty good about it all at the moment. Which again, is better than usual I think.

Cheers if you made it to the bottom of this long boring post.]]></description>
<dc:subject>css software design programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:e9bf27f69fa6/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://twitter.com/thomasfuchs/status/493790680397803521">
    <title>Twitter / thomasfuchs: Two CSS properties walk into ...</title>
    <dc:date>2014-07-28T18:04:16+00:00</dc:date>
    <link>https://twitter.com/thomasfuchs/status/493790680397803521</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Two CSS properties walk into a bar.

A barstool in a completely different bar falls over.]]></description>
<dc:subject>humor webdesign webdevelopment programming css</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:7041e3fdbce2/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:humor"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://pchiusano.github.io/2014-07-02/css-is-unnecessary.html">
    <title>Paul Chiusano: CSS is unnecessary given a layout language with means of abstraction and combination</title>
    <dc:date>2014-07-04T22:20:00+00:00</dc:date>
    <link>https://pchiusano.github.io/2014-07-02/css-is-unnecessary.html</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[It’s true that in using a language like Elm for layout, one loses the ability to cut and paste random CSS found on Stack Overflow in cargo-cult fashion without understanding what it does. I consider this limitation a feature. Layout code can and should be managed using the regular tools that programmers have developed for managing complexity and factoring out duplication.]]></description>
<dc:subject>css software programming abstraction</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:d176004e4d1d/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:abstraction"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://medium.com/p/3d1b0a9b810e">
    <title>Improve the payment experience with animations — Medium</title>
    <dc:date>2014-04-19T19:52:16+00:00</dc:date>
    <link>https://medium.com/p/3d1b0a9b810e</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[It’s easy to see how designing forms can be seen as a chore that detracts from the time that could be spent on more exciting parts. Yet, if you think about it, the payment form is part of the checkout flow, the point at which a user is on the verge of committing to trusting you and your business with their vote of confidence. This experience should really be as great as possible, and using animations correctly can really improve this experience.

The goal of animations should not solely be entertaining the user, but rather, they should be helping the user better understand what’s going on and how to use your product most effectively. If you disable animations, the flow should feel broken; if it is not, this might mean your animations are superfluous.]]></description>
<dc:subject>animation design css webdesign webdevelopment userexperience userinterface</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:785551325dd5/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:animation"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:userexperience"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:userinterface"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://j.eremy.net/confused-about-rem-and-em/">
    <title>Confused About REM and EM? | Jeremy Church</title>
    <dc:date>2014-02-28T03:48:35+00:00</dc:date>
    <link>http://j.eremy.net/confused-about-rem-and-em/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Both rem and em are relative units, px is not. Before considering rem, it’s important to understand the relationship between em, markup and inheritance.

Below, the example demonstrates how each nested child assumes the parent is 1em(100%). Thus children inherit size by scaling in relation to the parent font size.]]></description>
<dc:subject>css webdesign webdevelopment software</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:c6ccbaa4c650/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/line-menu-icon-menu/">
    <title>Line Menu Icon... That Is A Menu | CSS-Tricks</title>
    <dc:date>2014-02-16T23:33:17+00:00</dc:date>
    <link>http://css-tricks.com/line-menu-icon-menu/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[I had a dumb little idea the other night so I just coded it up (as you do). You know those little icons that have come represent navigation? We've called them Three Line Menu icons around here, but otherwise known as Navicon (clever) or Hamburger (dumb). The point of that icon is that it looks like a little menu, so hopefully it's obvious you click it to reveal a real menu. But what if that icon wasn't an icon at all, but the actual menu, just shrunken?]]></description>
<dc:subject>menu navigation webdesign webdevelopment css html</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:83bae1dd4800/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:menu"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:navigation"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://calendar.perfplanet.com/2013/the-runtime-performance-checklist/">
    <title>Performance Calendar » The Runtime Performance Checklist</title>
    <dc:date>2014-02-09T23:59:17+00:00</dc:date>
    <link>http://calendar.perfplanet.com/2013/the-runtime-performance-checklist/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[It’s really tempting to memorize a bunch of do’s and don’ts when it comes to performance, but you’ll end up with a couple problems:

You’ll misapply the rule because you haven’t established the context in which to use it. (The classic here is -webkit-transform: translateZ(0); it gets a lot of abuse.)
Implementations change so you apply the rule when it no longer makes sense. Worse it might now be an antipattern!
Instead commit to learning about and using the profilers available to you in the browser. They reflect the implementation, so they’re the best source of truth!]]></description>
<dc:subject>optimization performance css browser javascript</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:a0ff964e8c2f/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:optimization"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:performance"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:browser"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://daverupert.com/2014/01/4K-RWD/">
    <title>2014: The year we all go 4K - daverupert.com</title>
    <dc:date>2014-01-18T00:37:00+00:00</dc:date>
    <link>http://daverupert.com/2014/01/4K-RWD/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[I typically regard “What do we do about large screens?” as an extremely first world problem. It’s a top 1% of the top 1% globally sort of issue. Based on data trends, we should all be thinking mobile first, considering desktop as a bonus. Mobile is king. With that in mind, let’s examine yet another curio in our glass menagerie of web-enabled devices.

4K displays really reaffirm the need for a responsive images solution. If you choose to support 3840×2160 or 1920×1080@2× with full bleed imagery, it would require a 10 megapixel image. As it happens, you can’t even send a 10 megapixel image to all devices because iOS will simply will not accept them. Womp womp. Fingers crossed, however, there’s some good momentum in the RICG.]]></description>
<dc:subject>responsivedesign webdesign webdevelopment software design css</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:81abd2a1cdcc/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:responsivedesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/make-sure-columns-dont-collapse-horizontally/">
    <title>Make Sure Your Columns Don't Collapse Horizontally | CSS-Tricks</title>
    <dc:date>2013-12-31T18:55:13+00:00</dc:date>
    <link>http://css-tricks.com/make-sure-columns-dont-collapse-horizontally/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[You might be familiar with elements collapsing vertically. If an element only contains other elements that are floated, the parent element will collapse to zero height. We often employ the clear fix for that. But if an element doesn't contain anything, it can collapse horizontally as well, which can be quite awkward for layout.]]></description>
<dc:subject>float css design webdesign webdevelopment</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:e7223a57d9b2/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:float"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://demosthenes.info/blog/775/Which-CSS-Measurements-To-Use-When">
    <title>demosthenes.info – Which CSS Measurements To Use When</title>
    <dc:date>2013-11-05T05:31:10+00:00</dc:date>
    <link>http://demosthenes.info/blog/775/Which-CSS-Measurements-To-Use-When</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Amidst the diversity of CSS measurement systems it can be difficult for web developers to understand which units to use where, and when, on their pages. The instinct is to use just one system for everything, but that decision can severely limit the execution of your designs.

What follows is a list of suggestions, not absolute rules. If you have a differing opinion or working practice (and a rationale to back it up), please share in the comments.]]></description>
<dc:subject>css webdesign typography</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:0992637d2c85/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typography"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://sethfowler.org/blog/2013/09/13/new-in-firefox-26-css-image-orientation/">
    <title>CSS Image Orientation Lands in Firefox 26 - Psychic Core Dump</title>
    <dc:date>2013-09-19T01:18:56+00:00</dc:date>
    <link>http://sethfowler.org/blog/2013/09/13/new-in-firefox-26-css-image-orientation/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[These problems are all solved by the new CSS image-orientation property, which is now supported by Firefox 26. When the style image-orientation: from-image is applied to a JPEG image, the browser will take its EXIF orientation tag into account when performing layout and rendering. This means smartphone and digital camera images can now be displayed in their proper orientation natively by the browser, just by adding a single CSS property!

Here’s the first image in this article again, but this time with image-orientation applied. If you’re using Firefox 26, you’ll see this image rendered as it was intended, with the sky on top and the ground on the bottom.]]></description>
<dc:subject>css webdesign webdevelopment image</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:6f6a0c2da966/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:image"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/just-one-of-those-weird-things-about-css-background-on-body/">
    <title>Just One of Those Weird Things About CSS: Background on &lt;body&gt; | CSS-Tricks</title>
    <dc:date>2013-07-20T21:27:33+00:00</dc:date>
    <link>http://css-tricks.com/just-one-of-those-weird-things-about-css-background-on-body/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[In the absence of a background on the html element, the body background will cover the page. If there is a background on the html element, the body background behaves just like any other element.

Somewhere along the line, a background-color got set on the html element.

Perhaps you're using normalize.css 2.1.1, which included setting the background to white on the html element to "Prevent system color scheme's background color being used in Firefox, IE, and Opera." This has since been reverted, presumably because it caused this issue too widely.

To "fix" it, just remove the background on the html element, or move whatever you want to "flood" always to the html element as its behavior is consistant.]]></description>
<dc:subject>html css</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:8b9b79f8db65/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://daneden.me/type/">
    <title>Just My Type</title>
    <dc:date>2013-06-26T01:13:35+00:00</dc:date>
    <link>http://daneden.me/type/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[A collection of nice font pairings from Typekit.

Pairings with a price label indicate that certain fonts are only available on one of Typekit’s paid plans. ]]></description>
<dc:subject>typography typeface css typekit</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:addaee269cee/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typography"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typeface"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typekit"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/replace-the-image-in-an-img-with-css/">
    <title>Replace the Image in an &lt;img&gt; with CSS | CSS-Tricks</title>
    <dc:date>2013-05-21T04:37:21+00:00</dc:date>
    <link>http://css-tricks.com/replace-the-image-in-an-img-with-css/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[It worked beautifully. Here's what's cool:

It works on just about any element, even empty ones like <img> or <hr>
Browser support is excellent (Chrome, Firefox, Opera, Safari, IE8+) http://caniuse.com/#feat=css3-boxsizing
Refrains from using SEO unfriendly display: none or other properties]]></description>
<dc:subject>css images webdevelopment webdesign javascript</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:f2a157be9ced/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:images"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://dabblet.com/gist/3979221/">
    <title>Circular Tooltip (SO) ✿ dabblet.com</title>
    <dc:date>2013-05-02T07:29:18+00:00</dc:date>
    <link>http://dabblet.com/gist/3979221/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[radial menu in css]]></description>
<dc:subject>css webdesign webdevelopment software programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:6ac23363efcc/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://37signals.com/svn/posts/3511-recent-versions-of-google-chrome-on-os-x">
    <title>Photo: Recent versions of Google Chrome on OS X… by Jason Z. of 37signals</title>
    <dc:date>2013-04-25T22:52:33+00:00</dc:date>
    <link>https://37signals.com/svn/posts/3511-recent-versions-of-google-chrome-on-os-x</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Recent versions of Google Chrome on OS X mangle native input buttons. I don’t know precisely when it started but no amount of CSS brute-force seems to correct the text alignment. Have you found a work-around? Do you know a little birdie on the Chrome team?]]></description>
<dc:subject>GoogleChrome osx webdevelopment webdesign css html</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ce47e70c746b/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:GoogleChrome"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:osx"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/magic-numbers-in-css/">
    <title>Magic Numbers in CSS | CSS-Tricks</title>
    <dc:date>2013-04-23T00:09:49+00:00</dc:date>
    <link>http://css-tricks.com/magic-numbers-in-css/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Despite the super fun sounding name, magic numbers are a bad thing. It is an old school programming term for "unnamed numerical constant". As in, just some number plunked into the code that is probably vital to things working correctly but are very difficult for anyone not intimately familiar with the code to understand what it is for. CSS is loaded with unnamed numerical constants, but they are usually paired with properties and in the context of a selector so there is little mystery. There are magic numbers in CSS though, and they are still bad.


Magic numbers in CSS refer to values which "work" under some circumstances but are frail and prone to break when those circumstances change. They are usually always related to fonts in some way or another. They are created by an author who likely only tested in their own browser under ideal conditions. Let's take a look at some examples so we all know what they are and hopefully can avoid them in the future.]]></description>
<dc:subject>css webdesign webdevelopment programming software html</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:67cb428bb2fb/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/zmoazeni/csscss">
    <title>zmoazeni/csscss · GitHub</title>
    <dc:date>2013-04-20T23:41:07+00:00</dc:date>
    <link>https://github.com/zmoazeni/csscss</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[A CSS redundancy analyzer that analyzes redundancy.]]></description>
<dc:subject>ruby css webdesign webdevelopment programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:e0f7049eb2b4/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:ruby"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://tjvantoll.com/2013/04/15/list-of-pseudo-elements-to-style-form-controls/">
    <title>List of Pseudo-Elements to Style Form Controls - TJ VanToll - Tutorials, Thoughts, and Ramblings on Front End Development</title>
    <dc:date>2013-04-17T04:04:03+00:00</dc:date>
    <link>http://tjvantoll.com/2013/04/15/list-of-pseudo-elements-to-style-form-controls/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Styling form elements is a pain point when developing web applications. Historically, web developers have had to accept the form controls the browser provided with little hope of customization. However, web rendering engines are increasingly adding hooks through pseudo-elements to give authors some control over the display.

While all of these pseudo-elements are rendering engine specific (and therefore behind vendor prefixes), they can still be handy for customizing the display for that engine. The following is my best attempt at compiling a complete list of the pseudo-elements available in Trident, Gecko, and WebKit. At the time of this writing Blink is a recent fork of WebKit, so the pseudo-elements provided are identical. I am not aware of any form related pseudo-elements that Presto provides.]]></description>
<dc:subject>css css3 form html webdesign webdevelopment programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:c6ae3e4e0daf/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:form"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://paulirish.com/2013/webkit-for-developers/">
    <title>WebKit for Developers - Paul Irish</title>
    <dc:date>2013-03-05T02:07:46+00:00</dc:date>
    <link>http://paulirish.com/2013/webkit-for-developers/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[First, let’s review the commonalities shared by all WebKit ports.

You know it’s funny. I tried writing this a few times. 
Each time I got corrected by Chrome team members, as you’ll see…
So first, WebKit parses HTML the same way. Well, except Chromium is the only port so far to enable threaded HTML parsing support.
… Okay, but once parsed, the DOM tree is constructed the same. Well, actually Shadow DOM is only turned on for the Chromium port, so DOM construction varies. Same goes for custom elements.
… Okay, well WebKit creates a window object and document object for everyone. True, though the properties and constructors it exposes can be conditional on the feature flags enabled.
… CSS parsing is the same, though. Slurping up your CSS and turning it into CSSOM’s pretty standard. Yeah, though Chrome accepts just the -webkit- prefix whereas Apple and other ports accept legacy prefixes like -khtml- and -apple-.
… Layout.. positioning? Those are the bread and butter. Same, right? Come on! Sub-pixel layout and saturated layout arithmetic is part of WebKit but differs from port to port.
Super.]]></description>
<dc:subject>webkit browser programming software standards css html safari googlechrome opera webdevelopment webdesign</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:73d72b93b7e9/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webkit"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:browser"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:safari"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:googlechrome"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:opera"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/mixing-responsive-design-and-mobile-templates/">
    <title>Mixing Responsive Design and Mobile Templates | CSS-Tricks</title>
    <dc:date>2013-03-05T00:28:31+00:00</dc:date>
    <link>http://css-tricks.com/mixing-responsive-design-and-mobile-templates/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[You need a mobile strategy for your site. You have to pick Responsive Design or a dedicated mobile site, right? Maybe not. Maybe you can mix and match a variety of strategies.]]></description>
<dc:subject>webdesign webdevelopment software css html programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:1a648b0086e5/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.netmagazine.com/opinions/jeffrey-zeldman-dream-standards-based-web">
    <title>Jeffrey Zeldman on the dream of a standards-based web | Opinion | .net magazine</title>
    <dc:date>2013-03-05T00:23:54+00:00</dc:date>
    <link>http://www.netmagazine.com/opinions/jeffrey-zeldman-dream-standards-based-web</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[By my lights, it succeeded around 2003, or maybe 2005. I was surprised that The Web Standards Project kept going as long as it did. From the outside, it sometimes seemed that nothing much was happening at The WaSP. But then again, this coincided with the period where IE6 stayed on the market for five or six years with no real changes, so it may have seemed like standards had been taken as far as they could be. From the outside, the persistence of webstandards.org was like the persistence of Dixieland music — a pleasant but fairly irrelevant reminder of the past!

Toward the end, over the past few years, I know there was some good educational work going on inside WaSP, although it wasn't always wildly apparent to the outside world, and I think many people's attention had moved on to other problems, such as multi-device design, which of course ironically recapitulates the whole standards struggle. (And standards are the answer in multi-device design as well. It's just that the standards that fully address some of the concerns of multi-device design are still evolving, like the devices—again, a perfect echo of the standards struggle during the years of the browser wars and Flash.) Once that educational piece got handed off to the W3C (finally!), it made sense for The WaSP to close up shop. And now they have.

A tip of the blue beanie to each and every person who helped make the dream of a standards-based web come true.]]></description>
<dc:subject>webdevelopment webdesign standards programming software css html</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ffc4a767cefa/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.webstandards.org/2013/03/01/our-work-here-is-done/">
    <title>Our Work Here is Done - The Web Standards Project</title>
    <dc:date>2013-03-02T23:33:53+00:00</dc:date>
    <link>http://www.webstandards.org/2013/03/01/our-work-here-is-done/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[When The Web Standards Project (WaSP) formed in 1998, the web was the battleground in an ever-escalating war between two browser makers—Netscape and Microsoft—who were each taking turns “advancing” HTML to the point of collapse. You see, in an effort to one-up each other, the two browsers introduced new elements and new ways of manipulating web documents; this escalated to the point where their respective 4.0 versions were largely incompatible.
Realizing that this fragmentation would inevitably drive up the cost of building websites and ran the risk of denying users access to content and services they needed, Glenn Davis, George Olsen, and Jeffrey Zeldman co-founded WaSP and rallied an amazing group of web designers and developers to help them push back. The WaSP’s primary goal was getting browser makers to support the standards set forth by the World Wide Web Consortium (W3C).
In 2001, with the browser wars largely over, WaSP began to shift its focus. While some members continued to work with browser vendors on improving their standards support, others began working closely with software makers like Macromedia to improve the quality of code being authored in tools such as Dreamweaver. And others began the hard slog of educating web designers and developers about the importance of using web standards, culminating in the creation of WaSP InterAct, a web curriculum framework which is now overseen by the W3C.
Thanks to the hard work of countless WaSP members and supporters (like you), Tim Berners-Lee’s vision of the web as an open, accessible, and universal community is largely the reality. While there is still work to be done, the sting of the WaSP is no longer necessary. And so it is time for us to close down The Web Standards Project.]]></description>
<dc:subject>standards webdesign webdevelopment programming css browser internet</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:fc03efe9105e/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:browser"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:internet"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://intridea.github.com/stately/">
    <title>Stately | The simple map font</title>
    <dc:date>2013-02-07T07:27:28+00:00</dc:date>
    <link>http://intridea.github.com/stately/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Stately is a symbol font that makes it easy to create a map of the United States using only HTML and CSS. Each state can be styled independently with CSS for making simple visualizations. And since it's a font, it scales bigger and smaller while staying sharp as a tack.]]></description>
<dc:subject>css font map html webdesign webdevelopment</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:b9be14d6960b/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:font"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:map"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://bootswatch.com/">
    <title>Bootswatch: Free themes for Twitter Bootstrap</title>
    <dc:date>2013-02-07T07:25:03+00:00</dc:date>
    <link>http://bootswatch.com/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Saving the web from default Bootstrap]]></description>
<dc:subject>css design bootstrap webdesign webdevelopment programming</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:cf7b23c49356/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:bootstrap"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.campaignmonitor.com/blog/post/3921/outlook.com-drops-margin-and-float-support-entirely">
    <title>Outlook.com drops margin and float support entirely - Campaign Monitor</title>
    <dc:date>2013-02-04T23:27:28+00:00</dc:date>
    <link>http://www.campaignmonitor.com/blog/post/3921/outlook.com-drops-margin-and-float-support-entirely</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[After Hotmail's butterfly-like re-emergence as Outlook.com last year, we were certain there would be changes. However, we didn't think they'd be as trivial, yet as utterly maddening as dropping support for the margin CSS property.Naturally, it didn't take long for our email designer friends to notice that without margins, elements in their email newsletters were collapsing into each other like bros at a Twister party. Our forums almost immediately lit up with reports that spacing between paragraphs, images and articles had vanished with margin and its variants - margin-top, margin-right, margin-bottom and margin-left.Our first response was 'well wait, there has to be a workaround'. So we proceeded to hack away with attribute selectors, !important and even the esoteric .ExternalClass. Every time, Outlook.com stripped all mentions of margin from our HTML email code, simply leaving tantalizing semi-colons, like prawn tails after a seafood dinner.]]></description>
<dc:subject>webdesign email css software</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:68406daf285c/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:email"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/berg-cloud-buttons/">
    <title>BERG Cloud Buttons | CSS-Tricks</title>
    <dc:date>2013-01-07T06:42:52+00:00</dc:date>
    <link>http://css-tricks.com/berg-cloud-buttons/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[The buttons at BERG Cloud are pretty sweet looking. It's not a hugely big deal, but the way they have created them uses two separate images (not sprited) and two internal spans. In this tutorial we will recreate them with some modern tricks. We'll use no images (more efficient), less markup (more semantic), and function smoother (no javascript controlling states).]]></description>
<dc:subject>css css3 webdesign webdevelopment programming software button</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:88d4cd9683dd/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:button"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email">
    <title>Using web fonts in email - Campaign Monitor</title>
    <dc:date>2012-12-14T03:17:30+00:00</dc:date>
    <link>http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Display of web fonts in email clients is far from universal. However, given that many major clients do support them (including Lotus Notes 8, surprisingly!) and the rest gracefully use any provided fallbacks instead, it's fairly safe to use. So without any further introduction, here's what web font support across the most popular email clients looks like today:]]></description>
<dc:subject>webdesign email typography css</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:57881f746662/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:email"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typography"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/fly-in-newly-added-content-to-a-page/">
    <title>Fly in Newly Added Content to a Page | CSS-Tricks</title>
    <dc:date>2012-11-30T01:59:53+00:00</dc:date>
    <link>http://css-tricks.com/fly-in-newly-added-content-to-a-page/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Say that for any reason, a new module of content needs to appear on a page. By simply appending that new module into the DOM it will instantly appear. That might be enough of an "entrance" - or it might be too subtle. I'd think when you add new content to a page, you want people to see it. Animation might be the ticket. It technically slows down the entrance of the new content, but the visual effect will certainly make it more noticeable. Let's write some code to make all new modules added to a page "fly in."]]></description>
<dc:subject>css jquery webdesign webdevelopment software</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ebfba0b78497/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:jquery"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.marco.org/2012/11/15/text-rendering-optimize-legibility">
    <title>text-rendering: optimizeLegibility; – Marco.org</title>
    <dc:date>2012-11-15T23:40:02+00:00</dc:date>
    <link>http://www.marco.org/2012/11/15/text-rendering-optimize-legibility</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[There are actually significant, effectively fatal performance problems (such as 30-second loading delays, or longer) on mobile devices when using optimizeLegibility for long pages. Apply it only if you know what the maximum text length will be. (Also, avoid using it for Android clients, at least on the older versions that everyone still uses: its font renderer often has very strange bugs when this mode is enabled.)

I did some testing with Instapaper to determine approximate optimizeLegibility performance limits. A 5,000-word article in Instapaper for iOS, for instance, will only use optimizeLegibility on devices with an A5-class or greater CPU. To avoid problems on older iOS devices, I wouldn’t recommend using optimizeLegibility blindly and unconditionally on any pages longer than about 1,000 words. And I wouldn’t recommend enabling it on Android at all.]]></description>
<dc:subject>css typeface typography ios</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:9af272b048ba/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typeface"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typography"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:ios"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://maker.github.com/ratchet/">
    <title>Ratchet</title>
    <dc:date>2012-11-15T10:26:28+00:00</dc:date>
    <link>http://maker.github.com/ratchet/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Prototype iPhone apps with simple HTML, CSS and JS components.]]></description>
<dc:subject>iphone prototype mobile ios programming software html css javascript</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:d71236ad5fe4/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:iphone"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:prototype"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:mobile"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:ios"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/the-facebook-loading-animation-in-css/">
    <title>The Facebook Loading Animation in CSS | CSS-Tricks</title>
    <dc:date>2012-11-06T23:55:52+00:00</dc:date>
    <link>http://css-tricks.com/the-facebook-loading-animation-in-css/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Hey everyone! CSS3 is just plain awesome. The development is fast and the possibilities are endless. Today I want to show you how to make an awesome animation using multiple background images and linear gradients in CSS. We will build the Facebook loading animation using just a single HTML element.

For simplicity, you will not see any vendor prefixes in the CSS. Before we dive into creating the Facebook loading animation I will explain the basic techniques.]]></description>
<dc:subject>html css css3 webdesign webdevelopment programming politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:e1acbb542016/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://stopdesign.com/archive/2012/10/11/ten-years-later.html">
    <title>Ten years later</title>
    <dc:date>2012-10-12T02:58:33+00:00</dc:date>
    <link>http://stopdesign.com/archive/2012/10/11/ten-years-later.html</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Ten years ago today, we pulled back the curtains on a redesign of Wired.com. The actual design and the code that rendered it is long gone. But they were significant in their time.

The redesign of Wired News in 2002 marked the first time a large, well-known, daily-content publisher had dropped tables for layout, and embraced the separation of markup and style in a rather new (at the time) approach to web design. Several prominent blogs, and niche content sites (zeldman.com, meyerweb.com, alistapart.com) had broken ground, and were already using and evangelizing a greater adoption of Web Standards.

Halfway through the redesign process, I started plotting how Wired could support the standards movement not just by publishing stories about it, but by adopting it outright. If pure, valid XHTML to mark up the content and simple CSS for layout and style was enough for other sites, it should work for Wired too. I contacted Jeffrey Zeldman and Eric Meyer to let them know what we were up to. Their excitement over the prospect of Wired jumping on board hinted that this might be a big deal. We dove in head first, and never looked back. Not long after Wired took that leap, many other large, well-known sites and companies began following suit.]]></description>
<dc:subject>webdesign css html politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:f41eea7efc25/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://blog.pictonic.co/post/32869817328/svgs-are-cool-but-icon-fonts-are-just-10-of-their">
    <title>Pictonic blog - svgs are cool, but icon fonts are just 10% of their file size |</title>
    <dc:date>2012-10-08T00:47:11+00:00</dc:date>
    <link>http://blog.pictonic.co/post/32869817328/svgs-are-cool-but-icon-fonts-are-just-10-of-their</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[For the specific use case of theming websites and user interfaces with icons, its pretty hard to beat icon fonts, both in terms of ease of integration and performance. This goes a large way towards explaining their unprecedented rise in popularity in recent months.

However, SVGs are literally amazing. With them, you’re pretty much limited by your imagination and that’s about it. Here at creative sloth, we’re looking forward to seeing how their use in the web develops over time, and believe them to be an important part of its evolution. Thats why we’ve decided to include svgs with every icon font pack downloaded from pictonic.co.

That concludes our comparison, but we very much look forward to hearing your thoughts and opinions on both!]]></description>
<dc:subject>CSS WebDesign WebDevelopment programming software SVG politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:beb83203efc5/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:SVG"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://codepen.io/joshnh/pen/ohbHl">
    <title>Pure CSS Under Construction GIF · CodePen</title>
    <dc:date>2012-10-03T15:35:30+00:00</dc:date>
    <link>http://codepen.io/joshnh/pen/ohbHl</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[1) @paul_irish #lazyweb's wanting classic  construction man GIF in CSS

2) @_joshnh builds on @CodePen with 1 element ]]></description>
<dc:subject>gif css css3 html webdesign politics</dc:subject>
<dc:source>https://twitter.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:fff102d26aa9/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:gif"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/adobe/Source-Code-Pro">
    <title>adobe/Source-Code-Pro</title>
    <dc:date>2012-10-03T05:18:57+00:00</dc:date>
    <link>https://github.com/adobe/Source-Code-Pro</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Source Code Pro is a set of OpenType fonts that have been designed to work well in user interface (UI) environments. In addition to a functional OpenType font, this open source project provides all of the source files that were used to build this OpenType font by using the AFDKO makeotf tool.

]]></description>
<dc:subject>webdesign WebDevelopment programming CSS typeface font politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:aa8318500282/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typeface"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:font"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://html.adobe.com/edge/webfonts/">
    <title>Adobe Edge Web Fonts | Edge Tools &amp; Services | Adobe &amp; HTML</title>
    <dc:date>2012-10-03T05:18:15+00:00</dc:date>
    <link>http://html.adobe.com/edge/webfonts/</link>
    <dc:creator>jtyost2</dc:creator><dc:subject>webdesign WebDevelopment programming CSS typeface font politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:13ef7f5d211c/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typeface"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:font"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.xanthir.com/b4Ko0">
    <title>- Tab Completion</title>
    <dc:date>2012-09-05T02:57:44+00:00</dc:date>
    <link>http://www.xanthir.com/b4Ko0</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[There has never been a CSS4. There will never be a CSS4. CSS4 is not a thing that exists.

The term "CSS3" refers to everything published after CSS 2.1.

"But", you might object, "I saw things like CSS4 Images, or Selectors 4! Aren't they part of CSS4?".

No. As I just said, there is no CSS4. ^_^

While trying to finish CSS 2.1, we (the CSSWG) realized that big monolithic "versions" weren't any good. They were difficult to maintain, and slow to develop.

Instead, we decided to split up the CSS language into a bunch of independent modules. Each module can level up independently, and contains only a smallish set of features, so it's harder for a large set of features to be slowed down by a single stubborn feature.

Some of our modules start out at level 3, if they extend something from CSS2.1. Others start out at level 1, if they're something new (for example, Flexbox). However, the level that a module is at has no correlation with what version of CSS it's in. They're all CSS3, regardless of what level they're at.

Our URLs don't help the matter much, of course. We use URLs with things like css4-backgrounds in them, which totally sounds like CSS4. On behalf of the CSSWG, I apologize for the confusion. All that means is that it's CSS Background & Borders Level 4, which is implicitly part of CSS3.

So, now you know. There's no such thing as CSS4. There is only CSS3, and each module can level up independently. Pass it on!]]></description>
<dc:subject>css css3 css4 webdesign webdevelopment politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:e6bc1cfd3aec/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css4"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/freqDec/slabText/">
    <title>freqdec/slabText</title>
    <dc:date>2012-09-03T06:05:59+00:00</dc:date>
    <link>https://github.com/freqDec/slabText/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[A jQuery plugin for producing big, bold & responsive headlines]]></description>
<dc:subject>jquery javascript typography webdesign webdevelopment programming css politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:ea52f7b38593/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:jquery"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:typography"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.campaignmonitor.com/blog/post/3780/removing-the-60-character-line-limit-on-plain-text-email">
    <title>Removing the 60 character line limit on plain-text email - Campaign Monitor</title>
    <dc:date>2012-08-23T05:56:04+00:00</dc:date>
    <link>http://www.campaignmonitor.com/blog/post/3780/removing-the-60-character-line-limit-on-plain-text-email</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Our new recommendation is simple - when designing plain text emails, let text wrap naturally, instead of manually inserting line breaks into paragraphs.]]></description>
<dc:subject>email design css html politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:421f29e7a001/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:email"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://codepen.io/chriscoyier/pen/lzjqh">
    <title>256 Classes Overrides One ID · CodePen</title>
    <dc:date>2012-08-15T17:53:54+00:00</dc:date>
    <link>http://codepen.io/chriscoyier/pen/lzjqh</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Uhm. Whhhatt. 

256 class names override an ID : 

via @HugoGiraudel]]></description>
<dc:subject>css politics</dc:subject>
<dc:source>https://twitter.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:1b06d3de2805/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://davidwalsh.name/text-align-start">
    <title>text-align: start</title>
    <dc:date>2012-08-07T01:28:55+00:00</dc:date>
    <link>http://davidwalsh.name/text-align-start</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[As you’ve probably heard me mention a billion times on Twitter, I’ve been proudly work on the Mozilla Developer Network revamp.  This is my first real experience with working on websites with a fair amount of RTL readers. One thing I quickly recognized when browsing in RTL mode was that text wasn’t always lining up on the correct side — I would see text on the left where the browser should have displayed it on the right.  After digging into the stylesheets, I saw explicit text-align:left directives and started queueing up selectors I’d need to change to text-align: right.  Before doing so, however, I took the time to research a better way…and found it quickly.

text-align: left; /* as backup */
text-align: start;
allows the browser to decide how to best align text based on the user’s LTR or RTL preference.  There’s also an “end” value if you prefer the text to show up on the right in LTR mode, and visa versa.  Browser support is good at this point, with Internet Explorer supporting this property within IE10.

Even if RTL isn’t a requirement of your website, keep in mind — it’s a very simple change that could be a big boost to your RTL visitors!]]></description>
<dc:subject>css webdevelopment webdesign programming software politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:06e9a87956cb/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://css-tricks.com/saving-the-day-with-scoped-css/">
    <title>Saving the Day with Scoped CSS</title>
    <dc:date>2012-04-19T02:33:04+00:00</dc:date>
    <link>http://css-tricks.com/saving-the-day-with-scoped-css/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Over the last couple years HTML5 and CSS3 have rocked our worlds and the way we approach common website issues. Every few days it seems there is some new fangled snippet or approach that is a game changer. Today might just be another one of those days (kind of).

One little known feature of HTML5 is Scoped CSS. It’s an attribute for style blocks that may change the way we tackle certain styling challenges in the future.]]></description>
<dc:subject>html5 css3 css html webdesign webdevelopment programming politics</dc:subject>
<dc:identifier>https://pinboard.in/u:jtyost2/b:05f4ab658c29/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html5"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://jtauber.github.com/articles/css-hexagon.html">
    <title>CSS Hexagon Tutorial (github.com)</title>
    <dc:date>2012-04-07T19:43:02+00:00</dc:date>
    <link>http://jtauber.github.com/articles/css-hexagon.html</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[And that’s how we get a hexagon in CSS. The 30:52 ratio in the border widths is approximately 1:√3 which is ratio required for a hexagon.
]]></description>
<dc:subject>CSS WebDesign WebDevelopment programming politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:76d62b2e3be8/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://mathiasbynens.be/notes/unquoted-font-family">
    <title>Unquoted font family names in CSS</title>
    <dc:date>2012-04-04T02:17:32+00:00</dc:date>
    <link>http://mathiasbynens.be/notes/unquoted-font-family</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Are the quotes in font-family: 'Comic Sans MS' required, or not?

According to the the CSS validator, the quotes are required in this case because the font family name contains spaces:

Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space.

However, this is an error in the CSS validator. The warning message suggests that all font family names containing whitespace should be quoted, which is simply not true. font-family: Comic Sans MS (without quotes) is perfectly valid CSS that works the way you’d expect it to.

In reality, it’s a bit more complex. To grok the rules on font family names, we need to understand the difference between CSS strings and identifiers first.]]></description>
<dc:subject>CSS WebDesign politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:9527497f6389/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:WebDesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/">
    <title>The CSS3 :not() selector • CSS &amp; (X)HTML • Kilian Valkhof</title>
    <dc:date>2012-03-29T05:07:32+00:00</dc:date>
    <link>http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[There isn’t a lot of information to be found about the :not() selector. The specifications only offer 3 lines of text and a couple of examples. So lets see what it can do!

The Specification

The negation pseudo-class, :not(X), is a functional notation taking a simple selector […] as an argument. It represents an element that is not represented by the argument.

What it says here, is that a selector with a :not() in it will match all elements that do not match what’s between the parenthesis.

A simple selector is a term used in the specifications. A simple selector is: a single element, attribute selector, class, id or pseude-class.]]></description>
<dc:subject>css css3 programming webdesign webdevelopment software politics</dc:subject>
<dc:identifier>https://pinboard.in/u:jtyost2/b:62cdb477ff0c/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.ryancollins.me/?p=1041">
    <title>Pure CSS Clickable Events Without :target</title>
    <dc:date>2012-03-22T06:55:44+00:00</dc:date>
    <link>http://www.ryancollins.me/?p=1041</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Click on the drop downs above. That’s done all in CSS; no kind of javascript whatsoever. Pretty cool, eh? It’s a fun use of the :active and :hover selectors. You can browse the source code for the demo above here. If you’d like a more in-depth tutorial of how to accomplish this, continue reading.]]></description>
<dc:subject>css dropdown menu clickevent html programming webdesign webdevelopment politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:75d8e4ddc0df/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:dropdown"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:menu"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:clickevent"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://designshack.net/articles/css/whats-the-deal-with-display-inline-block/">
    <title>What’s the Deal With Display: Inline-Block? | Design Shack</title>
    <dc:date>2012-03-18T19:14:02+00:00</dc:date>
    <link>http://designshack.net/articles/css/whats-the-deal-with-display-inline-block/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[To be honest, I’ve never really played around with inline-block too much before today, but I’ve been seeing more and more suggestions in the comments that I explore this method as an alternative to floats so I thought I’d take the advice. I was hopeful going into it that it was indeed some magic, no-hassle way around floats, but in truth it really isn’t. There are still several unexpected behaviors that you have to know about and respond to, resulting in some hacky code much like we often see with float clearing fixes.

To be fair though, it is in fact a pretty simple way to accomplish float-like layouts. More importantly, the CSS that you have to implement to make sure it’s cross-browser compatible is briefer than even the popular micro clearfix hack from Nicolas Gallagher. This may make it a better way to go for many projects.

Ultimately, I think I will in fact begin adding this method to my bag of tricks. I suspect that certain times will arise when floats aren’t ideal (example: right floats render everything in reverse) and this will be a great alternative to have in those situations.

What do you think? Is inline-block a good alternative to floats? What situations can you think of where one clearly has an advantage over the other?]]></description>
<dc:subject>programming CSS HTML webdesign politics</dc:subject>
<dc:source>https://instapaper.com/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:9f20501e6e03/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:CSS"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:HTML"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="https://github.com/darcyclarke/Front-end-Developer-Interview-Questions">
    <title>darcyclarke/Front-end-Developer-Interview-Questions</title>
    <dc:date>2012-03-08T07:24:46+00:00</dc:date>
    <link>https://github.com/darcyclarke/Front-end-Developer-Interview-Questions</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[A list of questions you can use to help interview potential candidates for a front-end development position.]]></description>
<dc:subject>programming css html javascript interview career work politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:8e2d371e3166/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:interview"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:career"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:work"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://playground.deaxon.com/css/progress-bar/">
    <title>Progress Bar</title>
    <dc:date>2012-02-29T06:37:30+00:00</dc:date>
    <link>http://playground.deaxon.com/css/progress-bar/</link>
    <dc:creator>jtyost2</dc:creator><dc:subject>html5 webdesign webdevelopment programming javascript css politics</dc:subject>
<dc:identifier>https://pinboard.in/u:jtyost2/b:81de77a0faf7/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html5"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:javascript"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.frankieroberto.com/responsive_text">
    <title>Responsive text</title>
    <dc:date>2012-02-16T06:32:45+00:00</dc:date>
    <link>http://www.frankieroberto.com/responsive_text</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[Some websites now contain 'responsive images'. These scale (or crop) depending upon your screen's viewing area, so the image sizes remain appropriate whether you're looking at the website on a mobile phone, or on a huge flat screen monitor.

This is an example of responsive text.

The amount of textual detail scales relative to your screen size.

The effect is achieved using simple HTML class names and CSS media queries which show or hide the content depending upon the current screen width.]]></description>
<dc:subject>webdesign webdevelopment programming software html css css3 design politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:1a27ffdecc80/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://dev.w3.org/csswg/css3-hierarchies/">
    <title>CSS Hierarchies Module Level 3</title>
    <dc:date>2012-02-07T05:03:57+00:00</dc:date>
    <link>http://dev.w3.org/csswg/css3-hierarchies/</link>
    <dc:creator>jtyost2</dc:creator><description><![CDATA[CSS is a language for describing the rendering of structured documents (such as HTML and XML) on screen, on paper, in speech, etc. This module contains the features of CSS level 3 relating to the hierarchical nesting of style rules. It includes and extends the functionality of CSS level 2 [CSS21], which builds on CSS level 1 [CSS1]. The main extension compared to level 2 is the ability to nest a style rule within another rule, allowing greater modularisation and readibility of CSS documents.]]></description>
<dc:subject>css html css3 w3c standards webdesign webdevelopment programming politics</dc:subject>
<dc:source>https://pinboard.in/</dc:source>
<dc:identifier>https://pinboard.in/u:jtyost2/b:463184e0b031/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:css3"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:w3c"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:webdevelopment"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:programming"/>
	<rdf:li rdf:resource="https://pinboard.in/u:jtyost2/t:politics"/>
</rdf:Bag></taxo:topics>
</item>
</rdf:RDF>