Les préprocesseurs ne font pas tout

je trouve interéssant l article sur le workflow géré par gulp avec less et plein de modules ( en vert) ..? ainsi que les outils ( pagespeed ...) .


Mais on n'aborde pas le chemin entre le design et le css et encore moins celui du design vers CMS. En gros comment améliorer sont workflow pour
1- prendre la position et la taille d'un élément du design et le convertir en données CSS ?
2- export design vers raster ( fin du slice , layer slice, ou peu de raster !!! )
3- template html/Css : partir de rien , partir d'un template statique à adapter à un template/theme CMS , partir d'un template CMS ?

Concernant le choix du préprocesseur pourquoi avoir privilégié LESS par rapport a sass ? : compétence javascript en interne pour créer des fonctions par rapport à compass ( ruby )


J'ai étudié un site de qualité ( designer intégrateur nommé dans le lien mention légale ) fait avec un CMS, l'adaptation a été si bien faite qu'il est difficile de penser que le thème du CMS a été acheté et customisé mais c'est le cas ( après étude du source et des path , des nom des sélecteurs ) . Le site est simple et éfficace (en fr) avec belle typographie et chartre graphique et jolies assortiments de couleurs .



Cordialement
....
https://bensmann.no/full-score-google-pagespeed-pingdom-gtmetrix/

Modifié par 75lionel (03 Dec 2015 - 02:11)

Bonjour,

Il s'agit de Ébauche de workflow Gulp : tâches courantes, unCSS, includes HTML et critical-CSS je suppose ?

75lionel a écrit :
1- prendre la position et la taille d'un élément du design et le convertir en données CSS ?
2- export design vers raster ( fin du slice , layer slice, ou peu de raster !!! )

Pour minimiser le travail à faire, améliorer le design et même éviter les erreurs possibles, respecter une grille est une bonne pratique.
Pour faire le travail, malheureusement le standard de fait - PSD - est d'une complexité abyssale et rares ou inexistants sont les outils capables d'accéder aux calques d'un PSD (à part chez Adobe).
Il y a http://assets.adobe.com (ex-Project Parfait) et des plugins pour Photoshop mais là c'est pas mon rayon, plutôt Stéphanie.
Perso j'ouvre les PSD dans un bête outil de graphisme mais y a pas les calques ou aucun détail de typographie (c'est l'équivalent d'un PNG).

75lionel a écrit :
3- template html/Css : partir de rien , partir d'un template statique à adapter à un template/theme CMS , partir d'un template CMS ?

À titre perso, j'ai de telles exigences qu'aucun template tout fait ne me convient. Je peux en utiliser un mais je refais à peu près tout...
À titre pro, on a des clients qui viennent nous voir parce qu'aucun template n'est adapté à leur besoin ; ça fausse la réponse
Dans un gabarit donné, la difficulté n'est AMHA plus la mise en page mais son adaptation au RWD et là ça dépend tellement du contenu qu'il n'y a rien de tout fait, au mieux des aides pour le faire plus vite...

75lionel a écrit :
Concernant le choix du préprocesseur pourquoi avoir privilégié LESS par rapport a sass ? :

Sass est plus complet que LESS (d'où le nom "LESS")
Perso je n'ai pas besoin de Sass et ne veut pas en avoir besoin : ça complexifie le projet inutilement. Oui on peut inventer des mixins de folie et non ce n'est pas une bonne chose (à long terme avec des équipes disparates côté agence et/ou côté client).
PostCSS est vraiment très bien mais je préfère utiliser des variables concises et un peu de règles (un peu) imbriquées donc du LESS (et ça empêche pas de passer le code CSS généré dans PostCSS et l'indispensable Autoprefixer)

1- je ne connaissais pas parfait (Merci pour l'information ) . J'ai discuter avec un designer ( ai psd) ; il fait le design et l exporte en raster ( la page web et les éléments graphiques ) et les intégrateurs utilisent ses fichiers. Les intégrateurs cliquent/ouvrent donc sur les images raster pour connaitre la taille et utilisent le raster de la page web pour positionner les éléments avec css . L'utilisation d un outil comme specctr est elle utilisée par le designer pour faciliter le travail des intégrateurs ( je suppose que specctr facilite le travail ! ? ).

alsa creation est un site pour intégrateur css /javascript . Quel site forum aborde la partie design graphiste palette..Couleur font d'un point de vue web ?

Les problèmes / contraintes qui se posent à l intégrateur doivent être les mêmes que le graphiste qui travaillent toujours sous photoshop/illustrator/FW pour export svg/raster ( dans le monde professionnel ? ) !
-travailler pour le design toujours en résolution 200 dpi ( si outil raster ) ?
-utiliser toujours avec 3 grids ( phone tablet desktop ) dont le 960 px ?
-un psd general et un psd part type de liens/page (blog , form contact , homepage,emploi) ?
-


merci
Modifié par 75lionel (04 Dec 2015 - 00:01)