Easier scrollytelling with position sticky
One of the biggest implementation pains with scrollytelling is the sticky graphic pattern, whereby the graphic scrolls into view, becomes “stuck” for a duration of steps, then exits and “unsticks” when the steps conclude. This post will focus on the easiest solution we’ve come up with yet: offloading the sticky complexity to CSS, using position: sticky.
css  cssbasics  sticky  scroll  javascript 
2 days ago
CSS Media Queries: Quick Reference & Guide
Media queries give us a very powerful way to adjust our styles according to factors like the type of device used, the viewport size, the screen’s pixel density, or even the device orientation. As media queries have been around for quite a while, you may already be familiar with the basic syntax and usage. This post therefore aims to be a good quick reference point, and hopefully you’ll also discover a few tricks you didn’t know were possible.
css  cssbasics  mediaqueries 
2 days ago
Creating a Bar Graph with CSS Grid
If you’re looking for more manageable ways to create bar graphs, or in search of use cases to practice CSS Grid layout, I got you!
css  cssbasics  grids  bars  graphs  charts  cssgrid  layout  customproperties  variables 
2 days ago
A Comprehensive Guide to Flexbox Alignment
Alignment is probably the most confusing aspect of flexbox. The flexbox layout module has a handful of alignment properties that behave differently under different circumstances, and when using them you might not necessarily understand what is happening or why. However, if you know what to pay attention to, alignment is less complicated than it first appears. This tutorial will help you understand flexbox alignment perfectly.
css  cssbasics  flexbox  grids  layout  alignment 
2 days ago
Death to the Boring Design System
Everyday a new design system, style guide, or component library is being made. It is wonderful how easy it is make one now! But we have gotten into era where we do not push the potential of a design system.​ Let’s explore how efforts, like CSS​ Grid, are allowing us to push what a design system does! We will preview what we are doing for a design system that supports 350,000 IBMers.
fridayfrontend  video  css  design  designsystem  patternlibrary  styleguide  css-in-js 
2 days ago
Practical Tips for Working with CSS Variables
I’ve been playing around with CSS variables (or custom properties) quite a lot recently and thought I’d share a few tips as I develop a practical strategy for integrating them into my workflow. Including types of variables, scoping, defaults, and preprocessor variables.
fridayfrontend  css  variables  customproperties  defaults  scope  sass 
2 days ago
Image Inconsistencies: How and When Browsers Download Images
If you’re making heavy use of background images and, for whatever reason, are not showing all of them for first render, beware that some browsers will go ahead and download them anyway: you might want to look into better strategies for hidden content (e.g. removal from the DOM rather than display: none;).
fridayfrontend  images  performance  lazyload  backgrounds  css  browser 
2 days ago
Your Brain on Front-End Development
I know when I look at a design (heck, even if I know I'm not going to be building it), my front-end brain starts triggering all sorts of things I know will be related to the task… Accessibility! Performance! Semantics! Design systems!
fridayfrontend  css  layout  accessibility  patterns  performance  semantics  designsystem  development  design 
2 days ago
The Layouts of Tomorrow
I went over to dribbble in search of fresh webdesign ideas - how hard is it to build a non-standard layout, given the modern CSS tools we have today?
fridayfrontend  css  layout  grids  cssgrid 
2 days ago
Reflections on building an MVP design system in 3 months
This case study aims to chronicle the creation of our working design system at Linqia. I’ll share insight into the questions we asked, our process for getting started, the tools we used to create and implement the system, and also how we document, maintain, and share the system with our team.
fridayfrontend  css  designsystem  patternlibrary  patterns  design  atomic 
2 days ago
Programming with Sass, by Alyssa Ross
Sass is more than a CSS preprocessor — it’s a very powerful programming language. But why would you want to use Sass as a programming language? How can programming with Sass make your life easier? What kind of programming can you do with Sass? How do you go about testing complex Sass code?
fridayfrontend  video  css  sass  programming 
5 days ago
Aspect Ratio Cells with CSS Grid Layout
I found myself recently building a layout in CSS Grid that would have previously needed JavaScript in order to work. It’s a layout based on equal sized square grid cells, where grid items could span one or two cells on the row and/or column axis. In other words, the grid cells needed to maintain an aspect ratio (1:1 in this case), but the actual grid items did not necessarily, something like this:
css  cssbasics  grids  cssgrid  layout  aspectratio 
11 days ago
Making Avengers ID Card In HTML And CSS
In this tutorial, we will build a sci-fi ID card for Avengers. You will learn Flexbox, Nested Flexbox, CSS animations, and a ton of other CSS techniques while building this interesting project.
css  cssbasics  avengers  cards  animation 
11 days ago
1 Element CSS Rainbow Gradient Infinity
I first got the idea to CSS something of the kind when I saw this gradient infinity logo by Infographic Paradise. After four hours and some twenty minutes, of which over four hours were spent on tweaking positioning, edges and highlights... I finally had the result below.
css  cssbasics  gradients  color  conic-gradient 
11 days ago
8 Emmet Tips You Might Not Know
Emmet (who remembers when it was called Zen Coding?) is a very useful code editor tool that brings snippets and supercharged shortcuts for generating HTML/markup and even CSS.
css  cssbasics  emmet  tools 
11 days ago
HSL() / HSLa() is great for programmatic color control
If you ever need to hand-manipulate a color in native CSS, HSL is pretty much the only way. HSL (the hsl() and hsla() functions in CSS) stands for hue, saturation, lightness, and optionally, alpha. We've talked about it before but we can break it down a little more and do some interesting things with it.
css  cssbasics  hsl  hsla  color 
11 days ago
Level up your CSS selector skills
Why would I need to do this? We all know selectors inside out by now, right?
The trouble is that (at least in my case) over time it’s easy to get used to using the same trusted set of selectors on every project to achieve what you need to do. So I took it upon myself to do an in-depth review of CSS selectors and came across some interesting ones that were either new to me or were used in a way that hadn’t occurred to me before.
css  cssbasics  selectors 
11 days ago
A Reference Guide For Typography In Mobile Web Design
In terms of how to handle typography in mobile web design, it appears that simpler and safer works best. In this article, we will break down the elements you need to pay attention to in mobile typography and then visit what the research says about how to handle them.
css  cssbasics  typography  webfonts  fonts  mobile 
11 days ago
Designing Web Content for watchOS
On Monday Apple announced that it was bringing Webkit to the Apple Watch with WatchOS 5. This will allow users to open links from the Mail and Messages apps directly on their watches. Naturally, as web developers, we wonder how this will work with our already responsive websites. Well here’s the basics.
fridayfrontend  css  mobile  watchOS  applewatch  responsive  guidelines 
11 days ago
Specificity in :not(), :has(), and :matches()
But how do we calculate the specificity of that whole selector?  Just add up all the pieces?  No.  The Working Group recently decided that the specificity contributed from inside a :not() will be equal to the single selector with the highest specificity.  So given div:not(.one, .two, #navbar) p, the #navbar will contribute 0,1,0,0 to the overall specificity of the selector, yielding a total of 0,1,0,2.  The specificities of .one and .two are ignored.
fridayfrontend  css  specificity  not  has  matches  selectors 
11 days ago
Inclusive Components: Cards
Some cards are just illustrated introductions to permalinks like blog posts; others are more autonomous and offer a lot of functionality. In this article, I'll be looking into a few permutations of a simple card component, emphasizing a balance between sound HTML structure and ergonomic interaction.
fridayfrontend  css  inclusive  components  cards  accessibility 
11 days ago
How to start with variable fonts on the web
Variable fonts are the font technology made for the digital era. They have the power to bring more typographic richness to the web at a lower file size. But with new possibilities and advantages new challenges and complexity arise. So what’s so hot about the next big thing since the introduction of web fonts (at least to all type nerds) and how can you use it?
fridayfrontend  css  fonts  typography  variablefonts  webfonts 
11 days ago
Combining the Powers of SEM and BIO for Improving CSS
Generally, SEM is concerned with high level CSS philosophy whereas BIO is an actual technique to help you write better CSS to achieve SEM. The main purpose of both SEM and BIO is to better handle the CSS specificity which is one of the most important concepts you should understand for CSS.
fridayfrontend  css  sem  bio  scalable  extensible  maintainability  bem  itcss  oocss  frameworks  specificity 
11 days ago
Designing for Inclusion with Media Queries
Did you know that media queries aren’t just limited to screen size? This talk will dive into some lesser-known media queries that can help developers and designers create experiences for people browsing the web using assistive technologies.
fridayfrontend  video  css  mediaqueries  featurequeries  inclusive  responsive 
17 days ago
Managing focus for accessibility
Single page web apps are awesome but may present interesting accessibility challenges. In particular, when the site loads new content, it needs to be able to inform an assistive technology user that the new content is available, and ideally move focus into the new area.
fridayfrontend  css  accessibility  focus  tabindex 
17 days ago
Solving Life’s Problems with CSS
Or: When all you have is a CSS hammer, the world looks like a CSS nail.
fridayfrontend  css  tech  culture  programming  design 
17 days ago
Build Multiple Stacking Sticky Sidebars with Pure CSS and Bootstrap 4
This will be a quick and pretty cool tutorial on a neat trick on how to have multiple sticky sidebars that stack without using any JavaScript!
fridayfrontend  css  sticky  sidebars  layout  bootstrap 
17 days ago
Colors at scale
We started to question about some aspects of our color palette. And these were the main problems: We had a lot of colors; No instructions about when to use each color; A low understanding of colors in a digital product context; There wasn’t enough contrast.
fridayfrontend  css  design  color  designsystem  contrast 
17 days ago
Building a responsive image
I got the idea to build a logo file for our company, that not only reacts to the browser width but instead adapts while respecting its aspect ratio. So you can use it anywhere, and the file itself chooses which version to show depending on the size it’s given.
fridayfrontend  svg  logos  responsive  aspectratio 
17 days ago
How CSS works: Understanding the cascade
The cascade is inherent to working with CSS—after all, it is what gives “Cascading Style Sheets” their cascading nature. The cascade can be a powerful tool, but using it wrong can lead to brittle stylesheets that give front-end developers nightmares any time they have to make a change. As we dive into the cascade, we’ll also look at a few ways to keep the cascade from getting out of hand.
css  cssbasics  cascade 
17 days ago
Z-Index Explained: How to Stack Elements Using CSS
I decided that I’d had enough of trial and error with z-index and that I wanted to get a better understanding. I hope this article can help you so you will never wonder why z-index is not doing what you expect it to do.
css  cssbasics  z-index 
17 days ago
The [svg] of .svg, by Sara Soueudan
Scalable Vector Graphics, or Documents? Both. SVG may be known more as an image format, perfect for displaying icons and illustrations, including animated ones. But there are other aspects of SVG that make it as powerful as it is, and those aspects stem from its nature as a document format, as well as its graphical nature. In this talk, Sara is going to highlight some SVG's document side and show you how it can be leveraged to improve and optimize the way we deliver content such as text and images for the Web, including SVG itself.
fridayfrontend  video  svg 
19 days ago
The SPICE of Life
The entire Dune cycle is based on a terrible pun. 1. The spice is called melange. 2. The spice confers power and longevity. 3. Melange is a French word for variety. In other words, variety is the spice of life. Why does no one ever talk about this?
dune  scifi  books  movies  puns  french 
19 days ago
Scrum Guide
Scrum is a framework for developing, delivering, and sustaining complex products. This Guide contains the definition of Scrum. This definition consists of Scrum’s roles, events, artifacts, and the rules that bind them together. Ken Schwaber and Jeff Sutherland developed Scrum; the Scrum Guide is written and provided by them. Together, they stand behind the Scrum Guide.
scrum  agile  process 
20 days ago
Getting Started With Variable Fonts
A variable font encapsulates the entire font family, not just one style or instance. With three out of the four major browsers already supporting variable fonts and the remainder soon to follow, the future is certainly bright for this new font technology. Explore the resources below and be ready to hit the ground running when it arrives.
css  cssbasics  fonts  typography  webfonts  variablefonts 
24 days ago
Accessible CSS-Only Floating Labels
Floating labels are a simple design pattern that can help make your forms livelier and more dynamic, in the right conditions. Today we will be looking at how to make CSS-only floating labels without losing readability by accessibility tools.
css  cssbasics  forms  labels  accessibility 
24 days ago
Text editing techniques every Front-End developer should know
Any Front-end developer is going to spend a lot of time typing and manipulating code. It pays to know how to ‘drive’ your editor to get the best performance.
css  cssbasics  editors  sublime  vscode  atom  keyboard  shortcuts 
24 days ago
Keep your labels clean
Providing contextual information within a form control’s associated label is a technique I’ve seen used to help make forms more accessible. This technique allows for form controls to have large hit areas to help those with motor disabilities, and ensure important instructions, or error messages, are announced to screen reader users.
css  cssbasics  forms  accessibility  labels 
24 days ago
Build Native Modals Using the Dialog Element
Previously, if we wanted to build a modal or a dialog box of any sort, we needed to arrange our markup in a way where we have a backdrop, a close button, keep events trapped within the dialog, find a way to pass message out of the dialog... It was really complicated. The dialog element solves all the problems above and more.
css  cssbasics  javascript  dialog  modals 
24 days ago
CSS Ruleset Terminology
Learn the difference between a ruleset, a selector, a declaration, and a property or value in CSS.
css  cssbasics  language  reference  rulesets  selectors  declarations  properties  values 
24 days ago
Styling buttons, the right way
In this tutorial we’ll create basic styles for <a> and <button> elements, and a custom .btn CSS component. You will find a demo page for each step of the process.
css  cssbasics  buttons  focus  links  reset  hover  focus-visible 
24 days ago
Getting Started With CSS Layout
Over the past couple of years, CSS Layout has dramatically changed as well as the way we develop the front end of our sites. We now have a real choice in terms of the layout methods we use in CSS to develop our sites, which means we often need to make a choice as to which approach to take. In this article, I will run through the various layout methods that you have available to you by explaining the basics of how they are used and what they are used for.
css  cssbasics  layout  cssgrid  grids  flexbox  floats  columns 
24 days ago
Dark Theme in a Day
This is a story of how a few new-ish CSS options came together like a bunch of superheroes in a summer blockbuster movie, and allowed for this project to indeed take up one afternoon, and not much more.
fridayfrontend  css  variables  customproperties  themes  dark  night  color  accessibility  contrast 
24 days ago
The Slow Death of Internet Explorer and the Future of Progressive Enhancement
Users have more browsers than ever to choose from, yet IE manages to single-handedly tie us to the pre-evergreen past of the web. If developing Chrome-only websites represents one extreme of bad development practice, shackling yourself to a vestigial, obsolete, zombie browser surely represents the other.
fridayfrontend  css  ie  progressive  enhancement 
24 days ago
Learning Gutenberg: a 7-Part Series
We have a special long-form series we’re kicking off here totally dedicated to Gutenberg, a major change to the WordPress editor. I’ve invited a dynamic duo of authors to bring you this series, which will bring you up to speed on what Gutenberg is, what it can do for your site, and how you can actually develop for it.
fridayfrontend  wordpress  gutenberg  editors  blocks  javascript 
24 days ago
Variable Fonts
A simple resource for finding and trying variable fonts. The goal is to help you become more familiar with variable fonts in a way that isn’t overwhelming, while also providing straightforward info about the font projects, who made them, and where to find more info or get the fonts to use.
fridayfrontend  css  variablefonts  fonts  typography  webfonts  design 
24 days ago
Creating The Feature Queries Manager DevTools Extension
In this article Ire explains how she developed the Feature Queries Manager. Find out how this tool can help you support older browsers, and also how to create your own DevTools extensions.
fridayfrontend  css  featurequeries  supports  browsers  plugins  extension 
24 days ago
The Power of the rgba() Color Function in CSS
But as the support of these CSS color functions is zero nowadays, we can temporarily use PostCSS and compile them as regular colors. Or we can experiment and discover the power of CSS rgba() color functions to change colors on the fly! Let's see how we can use it.
css  cssbasics  rgba  color  functions 
4 weeks ago
Never forget type=”button” on generated buttons!
<button> elements with no type attribute set are submit buttons by default! Quote from spec: The missing value default and invalid value default are the Submit Button state.. This makes no difference in most cases, UNLESS you’re inside a form.
css  cssbasics  forms  buttons 
4 weeks ago
How You Can Use HTML5 Custom Data Attributes and Why
In this article, I am going to show you how you can use HTML5 custom data attributes. I’m also going to present you with some use cases that you can find helpful in your work as a developer.
css  cssbasics  html  data  attributes  javascript 
4 weeks ago
How to create a simple CSS loading spinner & make it accessible
A loading spinner is a visual indication that something is happening on your webpage. With a few lines of JavaScript and a little extra HTML markup we can ensure that users that have visual impairments are informed that something is happening and when the task has been completed.
css  cssbasics  animation  loaders  spinners  accessibility 
4 weeks ago
7 Rules of Using Radio Buttons vs Drop-Down Menus
However, if we study about the usability of these controls, it becomes apparent that radio buttons and drop-downs should be used in certain scenarios to make it easier for user to select a given input.
css  cssbasics  forms  radio  dropdown  accessibility 
4 weeks ago
CSS !important and What We Can Use for It
Using !important keyword you can give more weight to a CSS declaration. You can do this not just in your stylesheets but the inline styles too, and if you do so, you make some mistake.
css  cssbasics  important  specificity 
4 weeks ago
Know your ARIA: 'Hidden' vs 'None'
A primer on appropriately using aria-hidden='true' and role='none/presentation'. They each do very different things to elements, but their purposes are sometimes confused by developers.
css  cssbasics  aria  accessibility  hidden 
4 weeks ago
Intro to CSS 3D transforms
3D transforms change how we approach blank canvas of web design. Or rather, they change canvas itself, trading in the flat surface for an voluminous installation.
css  cssbasics  3d  transforms  animation 
4 weeks ago
CSS Visibility Option: Collapse
You’re probably already familiar with the visibility CSS property. We use it to hide or show something on the page by toggling its value between visible and hidden. But there’s a third value you might not have noticed yet.
css  cssbasics  visibility  collapse  tables 
4 weeks ago
Custom List Number Styling
How about a classic CSS trick! This isn't even so tricky anymore, since CSS has counter-increment and counter-reset and such that is perfect for this. I just wanted to make sure you knew how it works and had some easy-to-copy examples at the ready.
css  cssbasics  lists  counters 
4 weeks ago
From Bootstrap to CSS Grid
CSS Grid, a proper layout tool for the web baked right into CSS itself, is here. It’s fantastic! It’s exactly what we’ve been waiting for! And yet, it seems to me that developers are hesitating. What’s the hold up?
css  cssbasics  grids  layout  cssgrid  bootstrap 
4 weeks ago
A Deeper Look at Generic Font Names in CSS
Generic font families are a fallback mechanism, a means of preserving some of the style sheet author’s intent when none of the specified fonts are available.
css  cssbasics  fonts  font-face  typography  webfonts  generic 
4 weeks ago
At Least 6 Ways to Win with CSS Modules, by Josh Johnston
Many newcomers to CSS Modules have run into frustration because the strategies they previously relied on now seem unnecessarily complicated. This is no accident; CSS Modules comes with some opinions about CSS and we can learn a lot of useful patterns by following the cowpath it paves. We'll explore these patterns and think out their implications.
fridayfrontend  video  css  modules  opinionated 
4 weeks ago
DesignSystems.com
A resource for learning, creating and evangelizing design systems.
fridayfrontend  css  design  designsystem 
4 weeks ago
A Strategy Guide To CSS Custom Properties
Dynamic properties provide opportunities for new creative ideas, but also the potential to add complexity to CSS. To get the most out of them, we might need a strategy for how we write and structure CSS with custom properties.
fridayfrontend  css  customproperties  variables 
4 weeks ago
Should You Chain or Extend CSS Classes?
CSS modularity relies on composition, which inevitably fattens the HTML. This collateral effect can be a significant rebuttal for many people because of the “bloat” it creates. In this article, we’ll compare two techniques: chaining and extending. We’ll see what they provide and what their shortcomings are so that you can make more thoughtful choices.
fridayfrontend  css  modular  chaining  extends  oocss  bem  smacss  frameworks  maintainability 
4 weeks ago
The Front-End Tooling Survey 2018 - Results
It's very easy to take for granted what tools are being used based on your own knowledge and habits. These results help to give an insight into the current trends in front-end tooling, as well as showing how usage is changing over time by looking at the figures from previous surveys.
fridayfrontend  surveys  tools  css  sass  less  postcss  bootstrap  frameworks  lint  autoprefixer  modernizr  stylelint  smacss  oocss  bem  itcss  suit  atomic  css-in-js 
4 weeks ago
Responsive tables, revisited
The usual idea is turning the table into key-value pairs so that cells become rows and there are only 2 columns total, which fit in any screen. So I wondered, is there any way to create it without duplicating content either in the markup or in the CSS? After a bit of thinking, I came up with two ways, each with their own pros and cons.
fridayfrontend  css  html  accessibility  responsive  tables 
4 weeks ago
What's new in web accessibility (Google I/O '18)
This session will cover new additions to Chrome's DevTools which make finding and debugging accessibility issues much faster. The Accessibility Object Model, a powerful low-level API designed to give developers total control over the accessibility of their sites, will also be discussed.
fridayfrontend  video  accessibility  api 
4 weeks ago
Container-Adapting Tabs With "More" Button
Or the priority navigation pattern, or progressively collapsing navigation menu. We can name it in at least three ways.
css  cssbasics  navigation  tabs  flexbox  layout  responsive  javascript 
5 weeks ago
How to debug front-end: optimising network assets
In this piece, I will cover (TL;DR): Measuring performance via Chrome Devtool Audit; Image optimisation; Web font optimisation; JavaScript Optimisation; Improvements for render blocking assets; Other performance measurement applications/extensions
css  cssbasics  performance  optimization  devtools 
5 weeks ago
Vertically Centering with Flexbox
Vertically centering sibling child contents is a task we've long needed on the web but has always seemed way more difficult than it should be. After playing with flexbox for the DevTools Debugger I've found that align-items: center; is the hero I've always needed.
css  cssbasics  flexbox  vertical  centered  align-items 
5 weeks ago
Overriding Default Button Styles
There are a variety of "buttons" in HTML. Plus, for better or worse, people like having links that are styled to match the look of other true buttons on the site. One challenge is getting all those elements to look and layout exactly the same. We'll cover that a few ways.
css  cssbasics  html  buttons  reset  normalize  defaults 
5 weeks ago
Managing Heading Levels In Design Systems
This poses a particular problem when developing pattern libraries for design systems. While individual patterns/components within a design system can — and should — use headings, it’s difficult to know which heading levels they should take. As isolated modules within a pattern library, the context of the component within a page is indeterminate. For reusable components the context will change, along with the level required.
css  cssbasics  designsystem  headers  headings  accessibility  react  design  javascript 
5 weeks ago
CSS Grid — Responsive layouts and components
Let’s make a photo gallery responsive quickly and using very few lines of CSS.
css  cssbasics  grids  cssgrid  layout  galleries  photos  responsive 
5 weeks ago
HTML5’s Global `hidden` Attribute
The hidden attribute is a Boolean that, when specified on an element indicates that the element is not yet, or is no longer, directly relevant to the page’s current state, or that it is being used to declare content to be reused by other parts of the page as opposed to being directly accessed by the user.
css  cssbasics  html  hidden 
5 weeks ago
The Relative Units of CSS
The units in CSS are critical as we work with these all the time. You can’t build anything without using these so we must know the units properly.
css  cssbasics  units  rem  ems  ch  ex  vh  vw  relative 
5 weeks ago
Inspecting Animations in DevTools
I stumbled upon the Animation panel in Chrome’s DevTools the other day and almost jumped out of my seat with pure joy. Not only was I completely unaware that such a thing exists, but it was better than what I could’ve hoped: it lets you control and manipulate CSS animations and visualize how everything works under the hood.
css  cssbasics  chrome  devtools  animation  firefox 
5 weeks ago
A Deep Dive into the Bootstrap Form Component
Ilya shows how to style form elements with the Bootstrap form component, using Bootstrap’s grid system, horizontal and inline layouts, and validation tools.
css  cssbasics  bootstrap  forms  validation  layout 
5 weeks ago
New CSS Features That Are Changing Web Design
Today, the design landscape has changed completely. We’re equipped with new and powerful tools — CSS Grid, CSS custom properties, CSS shapes and CSS writing-mode, to name a few — that we can use to exercise our creativity. Zell Liew explains how.
css  cssbasics  grids  cssgrid  layout  shapes  writing-mode  customproperties 
5 weeks ago
Decorating lines of text with box-decoration-break
The box-decoration-break: clone copies any border, spatial, and background designs applied on a fragmented inline box’s unbroken edges to its broken ones. This creates an even design across all the lines of the text, decorating them uniformly and can be super useful for all those blurbs of text that we commonly use on websites.
css  cssbasics  box-decoration-break  clone  highlight 
5 weeks ago
Make Frontend Shit Again
We used to make websites because it was fun and at a point we lost the way.
We need to make dumb shit! Make useless stuff; make the web fun again!
fridayfrontend  html  css  javascript  geocities  shit  fun  dumb 
5 weeks ago
« earlier      
5e accessibility advice agile alignment analytics animation api architecture aria async awesome backgrounds bem bestpractices bias books browsers burnout business buttons careers characters charts checklist chrome code color comics comments communication components conferences config contrast critical css cssbasics cssgrid culture customproperties defaults demos design designsystem development devtools discrimination diversity dnd documentation earthquakes economics editors email emergency ems engineering fantasy favicons features feminism filters firefox flexbox fluid focus fonts forms fout frameworks free fridayfrontend frontend functions games gender generator git github google gradients grids grunt guidelines harrassment health hiring history howto html icons ie images inclusive inspiration interviews ios iphone javascript jesncin jobs jquery keyboard language layout leadership learning less links lint lists mac magic maintainability management maps mediaqueries meetings mixins mobile modular movies myths names navigation oocss optimization osx parallax parenting patternlibrary patterns performance photos photoshop plugins polyfills preparation presentation process productivity programming progressive questions quickreference quotes racism readability recipes reference reset responsive reviews romance rpgs rules rwd safari salary sass science scifi screenreaders scripts scrum security selectors semantics sex sexism slides smacss social space speaking specs standards startrek starwars stock stress styleguide sublime support supports svg syntax tables tech television templates testing themes tips tools transforms transitions tutorials twitter typography ui usability ux validation variables video viewport webapps webfonts webkit windows wordpress work worklifebalance worldbuilding writing

Copy this bookmark:



description:


tags: