Le Blog

Le blog laboratoire de F.L.D. Studio
0

ToDoList 2016

To Do List 2015

Responsive Design

Adopter un framwork CSS

Taille écran

  • La fin du support de IE8 afin de ne plus mesurer en pixel mais en unité relative (rem et em) pour améliorer la notion de réponse dynamique de l’interface à travers le navigateur.
  • Utilisation de Sass plutôt que Less pour une compilation plus rapide et profiter d’une large communauté active.
  • Amélioration du système de grilles
  • Une réécriture complète de tous les plugins JavaScript pour profiter des nouvelles améliorations.
  • Une documentation largement améliorée.

Un outil pour tester le responsive : https://responsivedesign.is/resources/testing/ish avec convertisseur PS/EM intégré

Des ressources pour comprendre les contraintes du responsive design et des solutions : 

Connaissance des médias

Système de navigation

http://navnav.co/

Délivrer la bonne image au bon format

Utiliser les balises HTML srcset et size, articles à lire : 

En français

Anglais

http://responsiveimages.org/

Le systeme de la BBC : https://github.com/BBC-News/Imager.js

Polyfill : 

Service en ligne de redim d'image (gratuit pour 100 image par mois puis payant ensuite)

https://www.sizzlepig.com/pricing

http://cloudinary.com/

Générateur de srcset : http://cloudinary.com/blog/introducing_intelligent_responsive_image_breakpoints_solutions

Outil de cloudinary : http://www.responsivebreakpoints.com/

Solutions PHP coté serveur :

A lire :

Flexbox

Flexbox

et encore 

Cas concrets

Etude de cas avec tout le code : https://www.isotoma.com/blog/2016/09/07/going-all-in-on-flexbox/?utm_source=codropscollective

Flexbox et les fallback : http://www.smashingmagazine.com/2015/11/flexbox-interfaces-tracks-case-study/

pattern : http://philipwalton.github.io/solved-by-flexbox/

Videos : 20 vidéos gratuites : http://flexbox.io/#/

Le polyfil pour IE8,IE9 : https://github.com/10up/flexibility

Des composants aux format FlexBox : http://www.flexboxpatterns.com/home

Composer un numéro de tél

    <a href="tel:+33102030405"> Appeler la société xxx </a> 

 

Faire un formulaire avec post en AJAX

ajax

Image vectoriel SVG

Bitmap et SVG

Utiliser la technique du sprite SVG.

Site One Page

CSS

et lire et relire :  http://iamvdo.me/blog/ce-que-vous-avez-toujours-voulu-savoir-sur-css

a voir et revoir absolument :  https://stylesheets.co/ (Collection de ressources pour et autour du CSS )

et aussi :

OUTILS

OUTILS MAISON

Commentaires: Pas de commentaires

Envoyer un commentaire