Avoid Placeholder Text by Animating Form Labels — Knowbility
Knowbility is a nonprofit organization with the goal of improving technology access for millions of youth and adults with disabilities all over the world.
accessibility  animation  labels  placeholders  css  forms 
7 weeks ago
Setting up Yarn Workspaces for Theme Development | GatsbyJS
Gatsby themes are a new way to share functionality across multiple Gatsby sites.
Yarn workspaces are an excellent way to set up a…
yarn  gatsby  theme  gatsby-theme  gatsbyjs 
7 weeks ago
A macOS app for Twitter DM & tweeting from the menu bar
twitter  app  mac:app 
11 weeks ago
A modern font loading strategy with the vanilla JS FontFaceSet.load() method | Go Make Things
Custom typefaces make the web gorgeous. But, they can also be a major bottleneck for perceived performance, particularly on mobile devices and in developing nations with less reliable internet connections.
Let’s dig in.
The problem In many browsers, if a custom typeface is declared but hasn’t finished downloading and parsing yet, browsers will leave space for the text but not render it until the file is ready.
This is often called a Flash Of Invisible Text (or FOIT).
vanilla  facebook  vanillajs  fonts  javascript 
12 weeks ago
Bringing A Healthy Code Review Mindset To Your Team — Smashing Magazine
Take a moment to remember the last time you collaborated in a code review. Did your team overcome feedback resistance and manage time expectations? Fostering a healthy mindset is the key to build trust and sharing knowledge with your colleagues.
smashing  team-culture  code-review 
june 2019
Using Cypress to Write Tests for a React Application | CSS-Tricks
End-to-end tests are written to assert the flow of an application from start to finish. Instead of handling the tests yourself — you know, manually
testing  react  css-tricks 
june 2019
Dark Mode in CSS | CSS-Tricks
With the introduction of dark mode in macOS, Safari Technology Preview 68 has released a new feature called prefers-color-scheme which lets us detect
dark-mode  css  tutorial  css-tricks 
may 2019
Redesigning your product and website for dark mode — Stuff & Nonsense
If you’re reading this entry using Safari Technology Preview 68 on MacOS Mojave 10.14, and you’ve selected Dark appearance in System Preferences, you’ll notice that I’ve implemented a brand new dark mode version of my website. — Web design North Wales UK, website design and consultancy based in North Wales, offering design and art direction for businesses in North Wales, the UK, and worldwide.
color  css  design  darkmode  webdesign  dark-mode  howto 
may 2019
Build Node.js RESTful APIs in 10 Minutes | Codementor
In this tutorial, we will learn how to create a RESTful API using Node.js.
api  javascript  nodejs  programming  rest  heroku  mongodb  node  simplicity  tutorial 
may 2019
Why, How, and When to Use Semantic HTML and ARIA | CSS-Tricks
building websites for Safari Reader Mode and other reading apps
accessibility  css  html  semantic 
may 2019
Introduction — MaintainableCSS - an approach to writing modular, scalable and maintainable CSS | By Adam Silver
MaintainableCSS is an approach to writing modular, scalable and maintainable CSS. Not only does this guide explain how to do this, but more importantly it explains why.
css  guide  webdesign  maintainable 
may 2019
Better npm search, with ranking and such
npm  search 
april 2019
Chapter 1: Introduction - An Introduction to APIs | Zapier
first chapter of a very easy to follow API explanation/tutorial
howto  api  learning  tutorial 
april 2019
Keeping your ES6 JavaScript code simple - DEV Community 👩‍💻👨‍💻
How to improve your JavaScript files reducing complexity while increasing readability
javascript  es6 
april 2019
How to Scale SVG | CSS-Tricks
The following is a guest post by Amelia Bellamy-Royds. Amelia has lots of experience with SVG, as the co-author of SVG Essentials and author of the
css  svg  css-tricks 
april 2019
Convert a React Class-Based Component to a Functional One Using a State Hook
A walk through showing you how to easily convert a class-based component to a functional component using the useState hook in React.
tutorial  react  react-hooks  react-state 
february 2019
Useful :nth-child Recipes | CSS-Tricks
"I get a little giddy when I come across perfect uses for :nth-child or :nth-of-type (read about the difference). The better you understand them, the more css nerdgasms you get to have!

In these simple "recipes" (really: expressions) I'll arbitrarily use a flat list of list items and randomly chosen numbers. But it should be fairly obvious how to alter them to get similar selections. "
css  nth-child  css-tricks 
february 2019
The Micro Blot Community
some resources for microblog and blot.im
blot  micro.blog  microblog 
february 2019
Designing A Font Based On Old Handwriting — Smashing Magazine
Are you considering transforming old cursive handwriting into a modern digital font? In this article, Carolyn Porter gives advice on what to keep in mind when designing and releasing a new font.
fonts  handwriting  typography  smashing-magazine 
january 2019
BAM! is a lightweight
serverless framework for deploying applications with Node.js and AWS
serverless  framework  aws 
january 2019
CSS Specificity - DEV Community 👩‍💻👨‍💻
CSS Specificity is the set of the rules applied to CSS selectors in order to determine which style is applied to an element. The more specific a CSS style is, the higher point value it accrues, and the likelier it is to be present on the element's style.
css  specificity  devto 
january 2019
« earlier      
100daysofhealthing 30min 3d 960 a11y absolute accessibility accessible actions adaptive adobe advice airtable alfred algorithm alias alignment alt-tags amazing-slideshow amazon analytics angular angularjs animation animation-svg animations apache api apollo app apple-watch apps aria atom atomic authentication aws backend bandcamp bash basics beacon beaker bem bio blocks blot boilerplate bokeh book books bots bourbon bower box braiiiiiins brain brains breakpoints broken-images browsers bugs build bujo bullet bullet-journal bundle cards carousel casey-liss cdn centering cfp checklist chrome-dev-tools class classes cli client clojure cms code code-review codepen coe coffeescript color colors command-line commandline comments compiler component components computer-science conference conferences config containers contentful context continuous contribution cookies crofflr cron cross-platform cs cs50 css css-blocks css-grid css-layout css-paint css-pattern-library css-trick css-tricks css-variables csstricks dark-mode darkmode database dave-rupert dayone deck demo deploy deployment design design+systems design-system destructuring dev-tools development devto discussion docker documentation doge drop-shadow dropdown dropdowns drupal drupal7 ebook editor electron elm em email ember emberjs emmet emoji ems es6 examples exercises express expressjs facebook firebase firmware fixed flexbox flip flipping.js float flow fluid-width focus font fontawesome fonts footer form forms formspree foundation fountain-pens framework free freecodecamp freelance from from-syntax front-end frontend ftp fullstack functional functional-programming functions gameboy gamedev games gatsby gatsby-theme gatsbyjs gems generator getting-started gifs git github github-actions glei glitch goals goldenratio good-shit google google-maps gradient graphql grid guide guidebox gulp hackernoon handbook handwriting harp headers headless headless-cms headlesscms herman heroku high-sierra history hosting houdini how-to howto html html5 http2 https hugo hybrid hyper hyperterminal icons ide imac indieweb intro ionic ios isomorphic jade jamstack javascript jekyll jen-simmons jenkins jobs journal jquery js json json-feed jss karabiner keyboard keys kindle kirby labels labs lacroix lambda laws layout lazy-load lazy-loading learning less letterboxd libraries library lightningtalks linkedin links lint linting liquid lists logging logomono logos loops mac mac:app machine-learning macosx magicforce mailchimp maintainable markdown marked markup marsedit mdn mechanical-keyboard media-queries mental-health mentalhealth merlin merlinmann mern metalsmith meteor micr micro.blog microblog micropub microsub middleware migration mixin mob mob-programming mobile mobile-app mobilefirst mocktails modal modals modalz mongodb monocle mooc motion motivation movies mozilla music mutationobserver mutationobserver-api mvc nas native navigation net netlify new-relic newdynamic nextjs nintendp node node-js nodehero nodejs normalize now npm nth-child nuclide nuxt objects onepage open-source opensource optimization osfeels osx pagination parallax parcel pattern-library patterns pebble peer-to-peer pen pens performance personal personal-site personalgoals php pinboard placeholders playlists plugins pluralsight podcast popmotion portfolio ports positioning posters postgres preprocessor presentations productivity programming progressive progressive-enhancement proposals prose prototyping psychology pull-request pwa python quill rachel-andrew random rasp raspberrypi react react-context react-hooks react-native react-state reactjs rebble recipe recommended-books reduce redux refills regex relative rem rems rendering resources responsive responsive_images rest resume retro-51 rollup ruby sanity-cms sans-serif sarah-drasner sass search security selectors semantic serverless setup shadow-dom shapes shell shoptalkshow simplicity sitecore sitemaps skillcrush slack slides slideshow slogger slots smartwatch smashing smashing-magazine social software-engineering speaking spec specificity specs spotify spread-syntax ssd starter stat static static-site static-site-generator staticsite status-code storage storybook style styleguide styleguides styling stylus surge svg swift switch system-fonts talk talks task-management tasks tdd team-culture teams template template-literals terminal terpstra test testing text texteditor theme themer themes thinkclearly thinking timber tips todo together tools toolsday towatch transitions tu tutorial tutorials tween twitter typeface typescript typography una unit-testing ux vanilla vanillajs variables vector video video-games videos virtual-reality vr vue vuejs vuido watchbands watchkit wayfinding web web-design webapps webdesign webdev webfonts webforms webmentions webp webpack website wii windows wireframe wordpress writing wufoo yarn youtube zeit zendrupal

Copy this bookmark: