css.json

{
    "css": [
        {
            "url": "http://dbushell.com/2012/04/23/modularity-and-style-guides/",
            "title": "Modularity and Style Guides",
            "author": "David Bushell",
            "tags": [
                "code style guides",
                "css best practises",
                "oocss"
            ]
        },
        {
            "url": "http://operatino.github.io/MCSS/en/",
            "title": "Multilayer CSS",
            "description": "Multilayer CSS organization methodology is based on BEM and OOCSS principles. It was invented in Odnoklassniki.ru (Top 10 world social network) developers team and is recommended for other developers as core for own documentation and team based methodologies.",
            "author": "Robert Haritonov",
            "author-link": "http://rhr.me",
            "author-mail": "r@rhr.me",
            "id": "mcss",
            "tags": [
                "css methodologies",
                "code style guides"
            ]
        },
        {
            "url": "http://smacss.com/",
            "title": "Scalable and Modular Architecture for CSS",
            "description": "SMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process. It is an attempt to document a consistent approach to site development when using CSS.",
            "author": "Jonathan Snook",
            "author-link": "http://snook.ca/",
            "tags": [
                "css methodologies",
                "code style guides"
            ]
        },
        {
            "url": "http://csswizardry.com/2013/07/writing-dryer-vanilla-css/",
            "title": "Writing DRYer vanilla CSS",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://csswizardry.com/2013/05/scope-in-css/",
            "title": "‘Scope’ in CSS",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://csswizardry.com/2012/11/code-smells-in-css/",
            "title": "Code smells in CSS",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://csswizardry.com/2012/07/shoot-to-kill-css-selector-intent/",
            "title": "Shoot to kill; CSS selector intent",
            "description": "A great article about writing efficient selectors in CSS.",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://csswizardry.com/2012/04/the-single-responsibility-principle-applied-to-css/",
            "title": "The single responsibility principle applied to CSS",
            "description": "Taking best practises from OO programming.",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://css-tricks.com/one-two-three/",
            "title": "One, Two, or Three",
            "author": "Chris Coyier",
            "tags": [
                "css best practises"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2012/07/13/coding-qa-with-chris-coyier-code-smell-type-grid/",
            "title": "Coding Q&A With Chris Coyier: Code Smell And Type On A Grid",
            "author": "Chris Coyier",
            "tags": [
                "css best practises"
            ]
        },
        {
            "url": "http://github.com/necolas/idiomatic-css",
            "title": "Principles of writing consistent, idiomatic CSS",
            "description": "The following document outlines a reasonable style guide for CSS development. These guidelines strongly encourage the use of existing, common, sensible patterns. They should be adapted as needed to create your own style guide.",
            "author": "Nicolas Gallagher",
            "author-link": "http://nicolasgallagher.com",
            "author-mail": "nicolas@nicolasgallagher.com",
            "tags": [
                "css best practises",
                "code style guides",
                "best practises"
            ]
        },
        {
            "url": "http://www.css3.info/preview/box-shadow/",
            "title": "Box-shadow, one of CSS3's best new features",
            "tags": [
                "box-shadow"
            ]
        },
        {
            "url": "http://css3gen.com/box-shadow/",
            "title": "CSS3 Box Shadow Generator",
            "tags": [
                "box-shadow"
            ]
        },
        {
            "url": "http://updates.html5rocks.com/2012/06/The-amazing-powers-of-CSS",
            "title": "The amazing powers of CSS",
            "author": "Ilmari Heikkinen",
            "tags": [
                "tricks",
                "pseudo class",
                "selectors"
            ]
        },
        {
            "url": "http://www.netmagazine.com/tutorials/more-efficient-css3-transitions",
            "title": "More efficient CSS3 transitions",
            "author": "Val Head",
            "tags": [
                "transition"
            ]
        },
        {
            "url": "http://alistapart.com/article/understanding-css3-transitions/",
            "title": "Understanding CSS3 Transitions",
            "description": "I like to think of CSS transitions like butter, smoothing out value changes in your stylesheets when triggered by interactions like hovering, clicking, and focusing. Unlike real butter, transitions aren’t fattening—they’re just a few simple rules in your stylesheet to enrich certain events in your designs.",
            "tags": [
                "transition",
                "animation"
            ]
        },
        {
            "url": "http://demosthenes.info/blog/540/Animating-CSS3-Image-Filters",
            "title": "Animating CSS3 Image Filters",
            "author": "Dudley Storey",
            "tags": [
                "transition",
                "images",
                "filters",
                "animation"
            ]
        },
        {
            "url": "http://www.css3.info/preview/css3-transitions/",
            "title": "An Introduction to CSS3 Transitions",
            "description": "CSS3 Transitions are a presentational effect which allow property changes in CSS values, such as those that may be defined to occur on :hover or :focus, to occur smoothly over a specified duration – rather than happening instantaneously as is the normal behaviour.",
            "tags": [
                "transition",
                "animation"
            ]
        },
        {
            "url": "https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transitions",
            "title": "Using CSS transitions",
            "description": "CSS transitions let you decide which properties to animate (by listing them explicitly), when the animation will start (by setting a delay), how long the transition will last (by setting a duration), and how the transition will run (by defining a timing function, e.g. linearly or quick at the beginning, slow at the end).",
            "tags": [
                "transition",
                "animation",
                "mdn"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/",
            "title": "CSS Specificity: Things You Should Know",
            "author": "Vitaly Friedman",
            "tags": [
                "specificity"
            ]
        },
        {
            "url": "http://www.typotheque.com/articles/opentype_features_in_web_browsers",
            "title": "OpenType features in web browsers",
            "author": "Gustavo Ferreira",
            "tags": [
                "fonts",
                "opentype",
                "draft"
            ]
        },
        {
            "url": "http://www.paulirish.com/2009/fighting-the-font-face-fout/",
            "title": "Fighting the @font-face FOUT",
            "author": "Paul Irish",
            "tags": [
                "fonts",
                "@font-face"
            ]
        },
        {
            "url": "http://designshack.net/articles/css/a-beginners-guide-to-using-google-web-fonts/",
            "title": "A Beginner’s Guide to Using Google Web Fonts",
            "author": "Joshua Johnson",
            "tags": [
                "fonts"
            ]
        },
        {
            "url": "http://nicolasgallagher.com/micro-clearfix-hack/",
            "title": "A new micro clearfix hack",
            "author": "Nicolas Gallagher",
            "tags": [
                "clearfix",
                "float"
            ]
        },
        {
            "url": "http://philipwalton.github.io/solved-by-flexbox/",
            "title": "Solved by Flexbox",
            "author": "Philip Walton",
            "tags": [
                "flexbox"
            ]
        },
        {
            "url": "http://dev.opera.com/articles/view/advanced-cross-browser-flexbox/",
            "title": "Advanced cross-browser flexbox",
            "author": "Chris Mills",
            "tags": [
                "flexbox"
            ]
        },
        {
            "url": "http://net.tutsplus.com/tutorials/html-css-techniques/an-introduction-to-css-flexbox/",
            "title": "An Introduction to the CSS Flexbox Module",
            "author": "Umar Hansa",
            "tags": [
                "flexbox"
            ]
        },
        {
            "url": "http://www.phpied.com/css-variables/",
            "title": "CSS variables",
            "author": "Stoyan Stefanov",
            "tags": [
                "variables"
            ]
        },
        {
            "url": "http://www.xanthir.com/blog/b4JF0",
            "title": "How CSS Handles Errors",
            "author": "Tab Atkins Jr.",
            "tags": [
                "css3",
                "errors",
                "valid code"
            ]
        },
        {
            "url": "http://lab.cubiq.org/css3mad/",
            "title": "CSS3 Mad",
            "author": "Cubiq",
            "tags": [
                "css3"
            ]
        },
        {
            "url": "http://csswizardry.com/2012/07/quasi-qualified-css-selectors/",
            "title": "Quasi-qualified CSS selectors",
            "author": "Harry Roberts",
            "author-link": "http://csswizardry.com",
            "author-mail": "harry@csswizardry.com",
            "tags": [
                "css3",
                "performance"
            ]
        },
        {
            "url": "http://www.igvita.com/2012/06/14/debunking-responsive-css-performance-myths/",
            "title": "Debunking Responsive CSS Performance Myths",
            "author": "Ilya Grigorik",
            "tags": [
                "css3",
                "responsive",
                "performance"
            ]
        },
        {
            "url": "http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/perfectly-rotate-and-mask-thumbnails-with-css3/",
            "title": "Perfectly Rotate and Mask Thumbnails With CSS3",
            "author": "Jim Nielsen",
            "tags": [
                "css3",
                "images",
                "rotate",
                "design"
            ]
        },
        {
            "url": "http://www.developerdrive.com/2012/07/introduction-to-sass/",
            "title": "Introduction to Sass",
            "author": "Alex Ball",
            "tags": [
                "preprocessors",
                "sass"
            ]
        },
        {
            "url": "http://www.developerdrive.com/2012/04/learning-less-an-introduction/",
            "title": "Learning LESS",
            "author": "Alex Ball",
            "tags": [
                "preprocessors",
                "less"
            ]
        },
        {
            "url": "http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/",
            "title": "How to unprefix -webkit-device-pixel-ratio",
            "author": "W3C",
            "tags": [
                "media rules",
                "best-practices",
                "media-queries",
                "responsive"
            ]
        },
        {
            "url": "http://dev.opera.com/articles/view/responsive-images-problem/",
            "title": "Responsive images: what's the problem, and how do we fix it?",
            "author": "Matt Wilcox",
            "tags": [
                "responsive",
                "rwd"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2013/11/05/killer-responsive-layouts-with-css-regions/",
            "title": "Killer Responsive Layouts With CSS Regions",
            "author": "CJ Gammon",
            "tags": [
                "responsive",
                "rwd",
                "regions"
            ]
        },
        {
            "url": "http://www.campaignmonitor.com/guides/mobile/",
            "title": "Responsive Email Design",
            "author": "Campaign Monitor",
            "tags": [
                "responsive",
                "email"
            ]
        },
        {
            "url": "http://palantir.net/blog/responsive-design-s-dirty-little-secret",
            "title": "Responsive Design’s Dirty Little Secret",
            "author": "John Albin Wilkins",
            "tags": [
                "responsive"
            ]
        },
        {
            "url": "http://miekd.com/articles/using-css-sprites-to-optimize-your-website-for-retina-displays/",
            "title": "Using CSS Sprites to optimize your website for Retina Displays",
            "author": "Maykel Loomans",
            "tags": [
                "sprites",
                "retina"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2012/06/14/coding-qa-with-chris-coyier-box-sizing-and-css-sprites/",
            "title": "Coding Q&A With Chris Coyier: Box-Sizing and CSS Sprites",
            "author": "Chris Coyier",
            "tags": [
                "sprites",
                "box-sizing"
            ]
        },
        {
            "url": "http://css-tricks.com/show-markup-in-css-comments/",
            "title": "Show Markup in CSS Comments",
            "author": "Chris Coyier",
            "tags": [
                "comments",
                "markup"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2006/09/02/list-of-css-tools/",
            "title": "List of CSS Tools",
            "author": "Sven Lennartz",
            "tags": [
                "tools"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2007/01/19/53-css-techniques-you-couldnt-live-without/",
            "title": "53 CSS-Techniques You Couldn’t Live Without",
            "author": "Vitaly Friedman",
            "tags": [
                "techniques"
            ]
        },
        {
            "url": "http://www.thecssninja.com/css/reveal-effect",
            "title": "Curtain reveal effect using CSS",
            "author": "Ryan Seddon",
            "tags": [
                "techniques"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2007/02/21/printing-the-web-solutions-and-techniques/",
            "title": "Printing the Web: Solutions and Techniques",
            "author": "Vitaly Friedman",
            "tags": [
                "print"
            ]
        },
        {
            "url": "http://coding.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/",
            "title": "CSS Float Theory: Things You Should Know",
            "author": "Vitaly Friedman",
            "tags": [
                "float"
            ]
        },
        {
            "url": "http://generatedcontent.org/post/26407228072/split-feature",
            "title": "Creating an angled split feature area with CSS transforms",
            "author": "David Storey",
            "tags": [
                "transform"
            ]
        },
        {
            "url": "http://css-tricks.com/media-queries-sass-3-2-and-codekit/",
            "title": "Media Queries, Sass 3.2, and CodeKit",
            "author": "Chris Coyier",
            "tags": [
                "media-queries"
            ]
        },
        {
            "url": "http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/",
            "title": "The EMs have it: Proportional Media Queries FTW!",
            "author": "Lyza Gardner",
            "tags": [
                "media-queries"
            ]
        },
        {
            "url": "http://davidwalsh.name/css-columns",
            "title": "CSS Columns",
            "author": "David Walsh",
            "tags": [
                "columns"
            ]
        },
        {
            "url": "http://www.html5rocks.com/en/tutorials/regions/adobe/",
            "title": "Magazine-like Layout for the Web with CSS Regions and Exclusions",
            "author": "Christian Cantrell",
            "tags": [
                "regions"
            ]
        },
        {
            "url": "http://filamentgroup.com/lab/how_we_learned_to_leave_body_font_size_alone/",
            "title": "How we learned to leave default font-size alone and embrace the em",
            "author": "Filament Group",
            "tags": [
                "em"
            ]
        },
        {
            "url": "http://davidwalsh.name/text-align-start",
            "title": "text-align: start & RTL",
            "author": "David Walsh",
            "tags": [
                "text-align"
            ]
        },
        {
            "url": "http://blogs.adobe.com/webplatform/2012/07/17/new-blending-features-in-css/",
            "title": "New blending features in CSS",
            "author": "Rik Cabanier",
            "tags": [
                "blend"
            ]
        },
        {
            "url": "http://blogs.adobe.com/cantrell/archives/2012/07/css-regions-arent-just-for-columns.html",
            "title": "CSS Regions Aren’t Just For Columns",
            "author": "Christian Cantrell",
            "tags": [
                "regions"
            ]
        },
        {
            "url": "http://www.html5rocks.com/en/mobile/high-dpi/",
            "title": "High DPI Images for Variable Pixel Densities",
            "author": "Boris Smus",
            "tags": [
                "hight dpi"
            ]
        },
        {
            "url": "http://demosthenes.info/blog/568/Create-Rich-Web-Typography-With-CSS3-&-OpenType-Discretionary-Ligatures-&-True-Small-Caps",
            "title": "Create Rich Web Typography With CSS3 & OpenType: Discretionary Ligatures & True Small Caps",
            "author": "Dudley Storey",
            "tags": [
                "typography",
                "opentype",
                "fonts"
            ]
        },
        {
            "url": "http://www.sketchingwithcss.com/samplechapter/cheatsheet.html",
            "title": "The Ultimate Flexbox Cheat Sheet",
            "tags": [
                "flexbox"
            ]
        },
        {
            "url": "https://github.com/csswizardry/CSS-Guidelines",
            "title": "General CSS notes, advice and guidelines",
            "author": "Harry Roberts",
            "author-mail": "harry@csswizardry.com",
            "author-link": "http://csswizardry.com",
            "tags": [
                "code style guides",
                "css best practises",
                "best practises"
            ]
        },
        {
            "url": "http://designshack.net/articles/css/5-steps-to-drastically-improve-your-css-knowledge-in-24-hours/",
            "title": "5 Steps to Drastically Improve Your CSS Knowledge in 24 Hours",
            "author": "Joshua Johnson",
            "tags": [
                "fast learning"
            ]
        },
        {
            "url": "http://www.kirupa.com/html5/introduction_to_animation_html.htm",
            "title": "Introduction to Animation in HTML",
            "description": "In HTML, there isn't just a single animation implementation that you can use. You actually have three flavors of animation to choose from, and each one is specialized for certain kinds of tasks.",
            "author": "Kirupa Chinnathambi",
            "tags": [
                "animation"
            ]
        },
        {
            "url": "http://blog.millermedeiros.com/solid-css/",
            "title": "Solid CSS",
            "author": "Miller H. Borges Medeiros"
        },
        {
            "url": "http://www.adobe.com/devnet/html5/articles/using-css3-transitions-a-comprehensive-guide.html",
            "title": "Using CSS3 transitions: A comprehensive guide",
            "author": "Louis Lazaris",
            "id": "Z16R8L0"
        },
        {
            "url": "http://davidwalsh.name/pointer-media-query",
            "title": "Pointer Media Query",
            "author": "David Walsh",
            "tags": [
                "media queries"
            ]
        },
        {
            "url": "http://hop.ie/blog/stereoscopic/",
            "title": "Stereoscopic CSS",
            "author": "Donovan Hutchinson",
            "tags": [
                "3d"
            ]
        },
        {
            "url": "http://html5hub.com/after-float/",
            "title": "After: float",
            "author": "Kyle Simpson",
            "tags": [
                "float"
            ]
        },
        {
            "url": "http://www.creativebloq.com/css3/avoid-css-mistakes-10135080",
            "title": "10 CSS mistakes every web designer must avoid",
            "author": "Pam Selle",
            "tags": [
                "fast learning"
            ]
        },
        {
            "url": "http://frontender.info/the-cat-and-the-hat-css-selectors/",
            "title": "«Котик» и «Домик» — новые CSS-селекторы",
            "author": "robdodson",
            "tags": [
                "selectors"
            ]
        },
        {
            "url": "http://alistapart.com/article/web-animation-at-work/",
            "title": "Web Animation at Work",
            "description": "Just as hierarchy guides users through content, animation guides them through interactions by helping them understand relationships, structure, cause, and effect. Animation shouldn’t be a nice-to-have. It is critical to communication.",
            "author": "Rachel Nabors",
            "tags": [
                "animation"
            ]
        },
        {
            "url": "http://blog.tumult.com/2013/02/28/transform-translate-vs-top-left/",
            "title": "Myth busting the HTML5 performance of transform:translate vs. top/left",
            "author": "Jonathan Deutsch",
            "tags": [
                "animation",
                "performance"
            ]
        },
        {
            "url": "http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/",
            "title": "High Performance Animations",
            "description": "Modern browsers can animate four things really cheaply: position, scale, rotation and opacity. If you animate anything else, the chances are you’re not going to hit a silky smooth 60fps.",
            "author": "Paul Lewis, Paul Irish",
            "tags": [
                "animation",
                "performance"
            ]
        },
        {
            "url": "http://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/",
            "title": "Why Moving Elements With Translate() Is Better Than Pos:abs Top/left",
            "author": "Paul Irish",
            "tags": [
                "animation",
                "performance"
            ]
        },
        {
            "url": "http://css-tricks.com/css-animation-tricks/",
            "title": "CSS Animation Tricks: State Jumping, Negative Delays, Animating Origin, and More",
            "description": "To create the animations as I imagine them using as few elements as possible, I've found some tricks to make CSS do things you might not know it could do. I'd like to share them with you.",
            "author": "Zach Saucier",
            "tags": [
                "animation"
            ]
        },
        {
            "url": "http://www.beyondkinetic.com/motion-ui-design-principles/",
            "title": "Motion Ui Design Principles",
            "description": "With the increasing emphasis on motion its important that it is implemented with the same integrity and purpose as all the other aspects of Ui design. With the exclusion of skeuomorphic design there is now a freedom for content to behave in an unrestricted manner.",
            "author": "Grant Liddall",
            "tags": [
                "animation",
                "UX"
            ]
        },
        {
            "url": "http://alistapart.com/article/ui-animation-and-ux-a-not-so-secret-friendship/",
            "title": "UI Animation and UX: A Not-So-Secret Friendship",
            "description": "When used as more than just a subtle design detail, animation can provide cues, guide the eye, and soften the sometimes-hard edges of web interactions. It can improve the user experience. And we can do it with CSS.",
            "author": "Val Head",
            "tags": [
                "animation",
                "UX"
            ]
        },
        {
            "url": "http://css-tricks.com/myth-busting-css-animations-vs-javascript/",
            "title": "Myth Busting: CSS Animations vs. JavaScript",
            "description": "CSS Animations have been talked about endlessly at conferences where phrases like \"hardware accelerated\" and \"mobile-friendly\" tickle the ears of the audience. JavaScript-based animation was treated as if it was antiquated and \"dirty\". But is it?",
            "author": "Jack Doyle",
            "tags": [
                "animation",
                "performance"
            ]
        },
        {
            "url": "http://www.smashingmagazine.com/2014/04/15/understanding-css-timing-functions/",
            "title": "Understanding CSS Timing Functions",
            "description": "The timing function is a bit of a hidden gem when it comes to CSS animation, and you could well be surprised by just how much you can do with it.",
            "author": "Stephen Greig",
            "tags": [
                "animation",
                "transition"
            ]
        },
        {
            "url": "http://www.smashingmagazine.com/2013/10/23/smart-transitions-in-user-experience-design/",
            "title": "Smart Transitions In User Experience Design",
            "description": "Some websites outperform others, whether in their content, usability, design, features, etc. Details of interaction design and animation make a fundamental difference on modern websites. We’ll share some lessons drawn from various models and analyze why these simple patterns work so well.",
            "author": "Adrian Zumbrunnen",
            "tags": [
                "animation",
                "transition",
                "UX"
            ]
        },
        {
            "url": "http://www.html5rocks.com/en/tutorials/speed/css-paint-times/",
            "title": "CSS Paint Times and Page Render Weight",
            "author": "Colt McAnlis",
            "tags": [
                "performance"
            ]
        }
    ]
}