Jekyll Get
Plugin to save JSON data from API into Jekyll _data folder
jekyll  data  json  plugin 
5 weeks ago
Andy Budd::Blogography
Réflexions sur UX Design et Service Design et pourquoi ils se rapprochent de plus en plus.
andybudd  design  UX  service 
6 weeks ago
How I’m Using Jekyll in 2017 – Michael Rose – Medium
Insights sympa sur Jekyll et workflow (Travis CI, etc). Applicable à tous les SSG
static  jekyll  workflow  jamstack 
6 weeks ago
JavaScript: Learn Promises
JavaScript Promises made easy. Learn the basics in 5 minutes.
javascript  promises  tutorial  teaching 
10 weeks ago
Content Strategy: The Method Behind the (CMS) Madness
Intéressant pour créer une data structure digne de ce nom
craftcms  content  structure  teaching 
12 weeks ago
Connect: behind the front-end experience
The front end experience of Stripe: CSS grid, ES6, Animation API
animation  css  javascript  grid  fallback  onscroll 
october 2017
The Must-Have Fonts for Graphic Designers and Font Lovers
Script fonts mainly. Intéressant pour certains types de designs
font  script  typefaces  typography 
july 2017
Breaking Out with CSS Grid Explained
Rachel Andrew. CSS Grid et full width images dans un layout centrée
css  grid  full  width  breakout  centered  layout 
june 2017
Masking vs. Clipping: When to Use Each
Article sur masking et clipping en CSS. Use cases et differences par l'inévitable Sarah Drasner
css  masking  clipping  mask  clip  teaching 
june 2017
Design in the Era of the Algorithm
Super article par @globalmoxie sur le futur du design en lien avec les nouvelles interfaces, l'intelligence artificielle, voice control, etc.
design  bots  artificial  intelligence  voice  future 
june 2017
Background videos, multiple solutions
videos  background  css  teaching 
june 2017
The Rules for Modern Navigation | UX Booth
Aim for flat navigation and various best practices about navigation and IA
navigation  ux  webdesign  ui 
february 2017
SVG Animation with GreenSock Animation Platform (GSAP) | August
Complex timeline animations with Greensock. Tutorial and example on codepen
animation  greensock  svg  codepen  phone  booth  teaching 
february 2017
Responsive SVG machines
Animations project by Sarah Drasner. RWD SVG animations with Greensock
animations  greensock  machines  sarah  drasner  teaching 
february 2017
How to Create Spotify Colorizer Effects With CSS Blend Modes - Web Designer Wall - Design Trends and Tutorials
Mix blend mode en CSS. Bonne approche systématique à partir de couleurs et de photos diverses
css  mix  blend  modes  colorize 
january 2017
Vue.js Fundamentals - YouTube
The series starts off with the basics and how to get started with Vue.js and then moving into more advanced functionality
vuejs  vue  javascript  tutorial  videos 
november 2016
The Illusion Of Life: An SVG Animation Case Study – Smashing Magazine
Chouette article sur animations SVG et comment obtenir de bons résultat en restant simple.
animation  javascript  css  svg  tutorial 
august 2016
New York Time Olypics Athletes
Storytelling à l'aide de video. Très bien fait.
longform  news  video  storytelling 
august 2016
Using A Static Site Generator At Scale: Lessons Learned – Smashing Magazine
Superbe récapitulatif sur l'utilisation d'un SSG pour un site à grande échelle
cms  static  jekyll  metalsmith  scale  process 
august 2016
Content-First Prototyping – Smashing Magazine
Content first prototypes avec Jekkyll. VOilà qui remplace avantageusement les wireframes IMHO
content  design  webdesign  process  ux 
may 2016
The Way We Build : Airbnb Design
Nice article on how Airbnb are designing their app. Some interesting tidbits in there.
design  process  styleguide  ux 
april 2016
Nice little model implementation. Accessible and WCAG wompliant
modal  modals  accessible 
april 2016
Experiment: Using Flexbox Today - Chris Wright
Plein de chouette use cases pour Flexbox. Code examples galore!
css3  css  flexbox  layout  use  cases 
april 2016
Don't build a Bootstrap style grid-system with Flexbox. by Morgan Feeney on CodePen
Une approche intéressante pour construire une grille en Flexbox (anti-Bootstrap)
flexbox  css  grid 
april 2016
SEO and User-friendly Ajax Pagination / Blog / EllisLab
Ajax pagination. Approche intéressante prenant en compte fallback, accessibilité et SEO.
ajax  pagination  fallback 
march 2016
Modern CSS Layout
Un ensemble de démos flexbox et grid par Rachel Andrew
rachel  andrew  flexbox  grid  css  layout 
february 2016
VueJs: The Basics | coligo
Les bases pour comprendre Vue.js
js  vue  basics 
february 2016
A Quick Overview of `object-fit` and `object-position` | CSS-Tricks
Tout ce qu'il faut savoir concernant `object-fit` et `object-position`. Ces propriétés permettent de conserver les proportions des images lorsqu'elles ne sont pas utilisées en background. Un peu l'équivalent de `background-size` pour les <img> dans le contenu.
object-fit  object-position  proportions  images  rwd 
february 2016
Webstock '15: Frank Chimero - The Web's Grain on Vimeo
Probably one of the best talk about what it means to be of the web
frank  chimero  video  webdesign 
february 2016
Wrapup Slides for SVG Summit by chriscoyier
Excellent résumé de toute une série de techniques liées au SVG: text lockups, viewbox animations, etc.
svg  frontend  svgsummit 
january 2016
Bonne liste de ressources pour apprendre le JS
javascript  js  resources  teaching 
january 2016
A Complete Guide to Flexbox
Excellent résumé des différentes propriétés et valeurs liées à flexbox et de leurs utilisations.
flexbox  guide  css-tricks  bestpractices 
january 2016
Coloring SVGs in CSS Background Images by Noah Blon on CodePen
Technique intéressante pour les systèmes d'icones en SVG
svg  icons  teaching 
january 2016
Grid, Flexbox, Box Alignment: Our New System for Layout ◆ 24 ways
Un bon article de fond sur les trois spécifications qui vont (enfin) pourvoir CSS d'un système de layout efficace.
flexbox  grid  layout  css 
december 2015
Want to learn JavaScript in 2015 / 2016? — Medium
Chouette roadmap et liste de ressources pour apprendre le JS
javascript  learning  teaching 
december 2015
Flexbox’s Best-Kept Secret — Medium
Le pouvoir des marges automatiques combinées à Flexbox. Super utile!
flexbox  auto  margins  bestpractices  teaching 
december 2015
How to create data-driven navigation in Jekyll | Dale Tournemille
Creation d'une navigation avec des fichiers _data dans Jekyll.
jekyll  data  navigation 
december 2015
David Byrne - Digital Brasilia
On flat design and Brasilia. Brilliant article in the New Republic by Evgeny Morozov
design  flat  skeuomorphism 
december 2015
UX Methods & Deliverables —
Bonne liste des méthodologies / délivrables utilisés pour UI / UX
process  ui  ux  wireframes  taeching 
november 2015
Creative Typography with SVG
Typograhy in SVG ... most comprehensive talk I've seen to date! Thanks
design  svg  typography 
november 2015
When to use @extend; when to use a mixin
Article détaillé par Harry Roberts sur le fonctionnement de @extend en Sass et les problèmes que cela pose.
sass  @extend  bestpractices 
october 2015
Introduction | Front-end Handbook
Very impressive summary of what front-end is in 2015. Very thorough
frontend  definition  teaching 
october 2015
« earlier      
2012 2d 404 :after :before @extend @font-face accessibility add-on addon agencies ajax analytics andrew angular animation animations antispam api app applications art article asynchroneous audio background backgrounds basics bbc beginner bem best bestpractices blogging book books box brad browser browsers bugs build business buttons caching canvas categories change clearing client clip clipping closure cms code codeigniter color comments compatibility conference config configuration content context control cours craftcms craig criteria critical css css3 cssgrid cssmediaqueries csswizardry cufon custom data dates debug deployment design developement development dom editor editorial education emulator enhancement equal es6 example exercise expressionengine extension facebook fallback fields file filters firebug firefox fireworks first fixed flash flex flexbox flexible float fluid font force forms framework free freeware frontend frost full future galleries gallery generator giraudel git github global goldenratio google gradients greensock grid gridlayout grunt gsap guide guidelines gulp hacks height hoisting howto htaccess html html5 hugo iconfont icons ie6 ie7 ie8 ifttt iife image images impact import in-house infographics inspiration install interface introduction ios ipad iphone japan javascript jekyll jeremy jquery js json keith kickoff layout learning less librairy lightbox liquid lists logos longform low luke lukew magasine magazine management maps marcotte markdown marketing markup mask masking matrix media media-queries meetings menus microformats middleman minimalist mobile mobilism mod modal modernizr modes modular module mozilla multilingual multiple namespace native navigation news newspapers npm online onresize onscroll oocss oop optimisation overlay page pairing palette parallax pattern patterns pc performance performances photography php picture plugin png polyfills press pricing print process programming progressive project promises prototype publishing queries rachel redactor reference regex rendering report reset resources responsive retina rgba roundedcorners ruby runner rwd sara sass scale script scroll search section security selectors semantics server servers sifr sketch sketchapp smil snippets soueidan speed spritemaps sprites stash static stats sticky stock storytelling strategy structure styleguide sublime sublimetext svg syntax task teaching template templates terminal test this tinymce toddmotto tool tools touch transforms transitions transparency trend tricks tutorial twig twitter typekit types typography ui unix url usability use ux validation validator vanilla variables version versioning video videos virtualbox visualisation vue vuejs w3c web web2 webdesign webkit website wireframes wireframing workflow wroblewski wysiwyg xhtml xml yepnope zeldman

Copy this bookmark: