Se former au web quand on vient du print

[ricounet]

Salut à tous

Nous sommes 3 graphistes print dans un petit studio attaché à une imprimerie.
On va pouvoir se détacher un peu du print et se former au web (objectif, faire des sites simples dans un premier temps, un peu d'animation aussi).

Dans l'idéal, financièrement parlant, ce serait intéressant d'exploiter les outils CC, vu qu'on est abonnés : Muse, Edge animate et autres outils Edge. Est-ce que ça suffit pour commencer ? Est-ce intéressant d'aller directement vers dreamweaver qui semble plus complet, un peu usine à gaz peut-être ?

Y-a-t-il d'autres produits intéressants ?

Faut-il aller directement dans une formation html 5 + CSS pour ne pas être limité ?

On ne se rend pas trop compte du degré de difficulté de tout ça.
Vu qu'on est 3 (et que les formation accordées ne sont pas illimitées, 3 à 5 jours par personne au max), est-ce intéressant de se former chacun à un domaine (1 ou 2 personnes sur la construction de site / une autre sur l'animation html 5) ?

Merci de vos avis et de vos retours d'expérence.

 

[fredj]

Bonjour.

Je suis graphiste print et je fais parfois des sites web depuis une dizaine d'années. La logique est assez différente. En web il faut penser "langage" avant de penser "outil".
Alors oui, une formation html/CSS est indispensable. Apprendre les bases de ces deux langages est relativement accessible pour un graphiste.

Mais quand j'ai commencé on pouvait encore se contenter de monter des sites html/CSS. Aujourd'hui ce n'est plus le cas. Je ne sais pas si des sites statiques se montent encore, quand je vois que la moindre asso a besoin d'une base de données adhérents etc... tout ça c'est du php et c'est un boulot d'informaticien (javascript idem).

A mon échelle (indépendant) une solution consiste à passer par un CMS (Joomla!, dans mon cas). Le CMS intègre des modules avec des fonctionnalités avancées. C'est beaucoup moins souple que de partir d'une "feuille blanche" pour créer un site, et il faut fouiller dans le code CSS pour arriver à ses fins. Mais au moins le résultat est assez costaud en terme de programmation et aux normes.

J'utilise Dreamweaver pour créer rapidement des feuilles de style et les tester, ensuite je les intègre au CMS.
Il faut surtout estimer les besoins potentiels des clients en amont pour y répondre de manière sure. Si demain, on me proposait un site marchand, je ne m'y lancerais pas sans l'appui d'un développeur compétent, même en restant sur une base Joomla!.

 

[ricounet]

Merci pour ton retour d'expérience.

On remarque en effet que les CMS ont le vent en poupe. Au premier abord, on est pas super emballés. On a eu une présentation de joomla et avec mes collègues on a ressenti une certaine frustration quand à la "liberté de création". Tout doit rentrer dans des templates.

Dans l'idéal, on aimerait pouvoir partir d'une feuille blanche à chaque fois, et sortir de l'esthétique qu'on voit partout.

Maintenant, en effet, il y a aussi pas mal de possibilités d'intégration (php et autres) qui sont fort intéressantes…

J'ai l'impression qu'on voit peu de sites issus de Muse / Edge.
C'est si limité que ça ?

 

[Bambouille]

On peut très bien aussi mêler le classique avec un CMS.
Pour ma part, je construit mon site à "l'ancienne" avec Photoshop, Fireworks pour la mise en page du site et Dreamweaver pour le code HTML que je peux modifier à la main ensuite. J'introduit ensuite des boucles de Spip dans mes pages pour le côté dynamique.
Le client a une page d'administration du site ou tout le contenu est modifiable par ses soins.
Ça donne ça ou encore ça.

 

[flippy]

Bonjour. Peut-être commercer avec le b-a-ba au niveau langage pour raisonner dés maintenant en terme HTML. Ce site est pas mal pour débuter et comprendre la mécanique :
www.siteduzero.com ou alsacreations.fr
Après on assimile assez rapidement et la pensée graphiste peut jouer au niveau créa...

 

[momo-fr]

Venir du print vers le web c'est ce que j'ai fait il y a… 10 ans. Au début en copiant/collant du code pompé dans les sites (menu Affichage -> Afficher le code source), après j'ai "aspiré" quelques sites pour en comprendre le principe, à l'époque on était en statique pour une grande partie de sites.
Le principal écueil reste intellectuel, on ne pense pas une page web comme une page print, itou pour la gestion du texte, le web est un média "fluide", encore plus actuellement avec le responsif.
Il faut abandonner une large partie de vos savoirs… et en apprendre des nouveaux.

Pour ce qui est de la technique je dirais que c'est selon les personnalités, je ne pensais pas au début pouvoir un jour "penser" une page en HTML/CSS, hors c'est que je fait aujourd'hui en travaillant à distance sur des framework de projets en développement un peu partout en France, en Europe et même aux US.

Oubliez les outils Adobe qui sont des pièges de conception (j'ai pratiqué Dreamweaver et Flash 6 ans), avec trop de béquilles qui vont vous masquer le code, les principes, les règles du web. C'est pareil en CSS, pas de menu de choix, il faut comprendre la sémantique et les règles de parenté CSS, les filiations, et maintenant le LESS CSS.

HTML5 apporte un peu de clarté dans la structure HTML et c'est tant mieux, la construction est plus "transparente" en regard du code à fournir.

N'oubliez pas une chose, tout ce que vous voulez saloir sur le web s'y trouve, il suffit de chercher. Je ne parle même pas des tonnes de tutoriels disponibles.

OpenClassRooms

Je n'ai suivi qu'une formation sur un CMS de e-commerce (3 jours) pour apprendre l'usage des boucles SPIP. Tout le reste c'est sur le tas et quelques bons bouquins (de E. Meyer entre autres).

Commencer avec un CMS moderne comme WordPress peut être un atout (Joomla a vieilli), apprenez surtout a vous démerder devant un navigateur et à utiliser un module comme FireBug + un éditeur HTML comme Brackets et vous aurez la liberté de concevoir ou de modifier le web à votre guise… ou presque.

Une formation est conseillée… mais encore faut-il qu'elle soit de qualité. :rolleyes:

Bon courage à vous trois, et bon web…

 

[bompi]

Cela dépend un peu du goût de chacun : tout le monde n'a pas forcément envie de rentrer du code...
Toutefois, si utiliser des outils de CMS est pratique et permet de démarrer, on est rapidement amené à creuser un peu, ne serait-ce que pour bien appréhender les bugs qui ne manqueront pas de survenir.

Je préconiserais donc, parallèlement à l'apprentissage pratique d'un outil classique de gestion de contenu, une formation un peu plus technique sur HTML/CSS, mais aussi sur l'architecture des sites Web, au moins pour bien comprendre les flux et le stockage d'information.
Ça peut paraître un peu rugueux mais toute l'informatique en réseau (et le Web est exemplaire sur ce point) ne peut se comprendre sans cela. Et quand on comprend bien ce qui se passe, c'est-à-dire qu'est-ce qui transite, comment il le fait et comment on le conserve, comment tout ça s'articule, hé bien le reste devient plus facile aussi.

Bien entendu, l'idée n'est pas d'apprendre le coeur des protocoles réseaux ou à développer d'emblée dans du code genre Ruby/Python/PHP/... ou faire du (No)SQL mais bien d'avoir une vision d'ensemble.

 

[ricounet]

Merci pour ces retours d'expérience.

Je m'aperçois qu'aucun d'entre vous n'utilise les solutions Adobe : Muse / Edge reflow / Edge Code / Edge inspect / Edge Animate). Est-ce un choix délibéré ou vous aviez déjà choisi vos outils avant que cette suite n'existe ?

 

[bompi]

Personnellement, je ne suis pas graphiste mais informaticien, donc je viens de l'autre côté de la chaîne
C'est sans doute pour cela que je me souligne l'importance d'avoir une bonne vision de ce qui se passe, non pas pour mettre les mains dans les engrenages, mais parce qu'il est important de comprendre les objets qu'on manipule.

[Je travaillais un peu avec les produits Adobe quand je travaillais pour la Presse, ne serait-ce que parce que mes programmes créaient du PostScript (puis (un peu) du PDF) pour l'affichage (DPS) et l'impression. Mais pour le Web, j'ai commencé à développer des sites alors qu'on en était encore au statique puis aux CGI (autant dire, l'antiquité quoi). Donc j'ai assez peu utilisé de générateurs automatiques de code, c'est plutôt nous qui créions des modules générant du code
Bien sûr, on en est venu à utiliser des moteurs mais avec des pincettes et plutôt pour des prototypes que pour des sites en production.]

 

[momo-fr]

Je m'aperçois qu'aucun d'entre vous n'utilise les solutions Adobe : Muse / Edge reflow / Edge Code / Edge inspect / Edge Animate). Est-ce un choix délibéré ou vous aviez déjà choisi vos outils avant que cette suite n'existe ?

Le problème avec le web c'est que tu es amené à maîtriser (ou du moins essayer) le poids des données que tu mets en ligne, coder en HTML peut se faire de multiples façons, les Normes, si elles existent, cohabitent pour garder de la souplesse.

Tu peux avoir une page simple qui "pèse" le double parce que certains fichiers sont plus ou moins bien écrits. Là dessus Adobe n'a pas vraiment fait des logiciels qui "pondent" du code léger, c'est plutôt le contraire.

Dès que Javascript rentre en jeu les logiciels Adobe ont tendance à faire du lourd là où un script bien foutu pèse presque rien.

Un fil parlait récemment du responsif sur Muse, ça demande plein de manipulations là où un framework comme Bootstrap est simple d'usage. Tu as d'ailleurs plein de solutions en ligne pour pondre du code propre et léger (ça reste relatif) en HTML5/CSS3 sur cette base très connue.

Je viens du print et de la création (je fait encore pas mal de taf en print), il faut vraiment sortir de "l'aspect" visuel pour penser "dans" le web, car comme te le dit Bompi, plus tu maîtriseras les aspect techniques du web, l'ergonomie sous-jacente, plus ta créativité aura du "sens" sur ce média. Rester sur la surface ne vas pas te mener loin et tu vas te heurter à pas mal de problèmes d'optimisation.

Après c'est comme tout, on voit ça de loin et ça paraît sur certains points "monstrueux" alors qu'en fait une fois les principes acquis sa "coule" de source.

J'ai formé 3 graphistes venus du print vers le web durant ces dernières années, 1 seule s'en sort honorablement, elle avait déjà la curiosité et le sens de la démerde dans le sang, ça l'a considérablement aidé.

 

[magicPDF]

Je m'aperçois qu'aucun d'entre vous n'utilise les solutions Adobe : Muse / Edge reflow / Edge Code / Edge inspect / Edge Animate). Est-ce un choix délibéré ou vous aviez déjà choisi vos outils avant que cette suite n'existe ?

On attend toujours que Muse soit capable de générer facilement et simplement des sites responsives…
Et même s'il y arrivait un jour, il serait toujours à une année-lumière d'un Wordpress ou d'un Joomla.
:rateau:

 

[ricounet]

Bon… tout ça a le mérite d'être assez clair… Muse et Edge ne semblent pas être très utilisés.
J'ai d'ailleurs du mal à trouver des sites faits avec Muse…

Maintenant, on nous accorde 3 jours de formation pour savoir créer des sites vitrine simples et fonctionnels… (mise en page / hébergement / référencement). 3 jours, c'est jouable pour se former à Wordpress ?

 

[bompi]

Je dirais que oui. Mais avec une mise en pratique immédiatement après [comme pour toute formation, d'ailleurs...]

 

[momo-fr]

Bon… tout ça a le mérite d'être assez clair… Muse et Edge ne semblent pas être très utilisés.
J'ai d'ailleurs du mal à trouver des sites faits avec Muse…

Si il y a un show room des sites sous Muse… mais bof bof, si tu regardes le code pour ce qui est à l'écran ça fait peur…

Maintenant, on nous accorde 3 jours de formation pour savoir créer des sites vitrine simples et fonctionnels… (mise en page / hébergement / référencement). 3 jours, c'est jouable pour se former à Wordpress ?

3 jours c'est court, tout dépend de ce que tu veux faire, je forme mes clients au back-end en 2x2h00, après c'est assistance à distance par forfait horaire selon leurs besoins.

3 jours pour comprendre :
- Ce qu'est un CMS
- Comment gérer les thèmes
- Personnalisation
- Les extensions et WordPress
- Installation
- Comment faire un site pour son référencement
- La gestion des images
- Les médias vidéo et son
- Mais surtout la personnalisation d'un thème
- Le système du thème enfant (child thème)
- L'intégration des réseau sociaux
- Pourquoi on parle de thème Premium et ce que cela cache
- Et tout le reste et j'en passe

C'est un peu court, pour te mettre le pied à l'étrier c'est faisable mais si tu n'as pas de bases web ou html/CSS ça va pas le faire.

OpenClassRooms est un excellent site pour dégrossir avant une formation.

Pour WordPress je te conseille l'excellent WordPress Channel bourré de tutoriels…

 

[ricounet]

Merci pour toutes ces infos.
En effet 3 jours, ça va être très juste, voire impossible.

A titre personnel, j'ai démarré la formation html5 - CSS sur openclassroom.
C'est plutôt bien expliqué, bonne formation gratuite.

Ensuite pour les formation dans le cadre du travail… déjà on va attendre que la direction valide la demande… il paraît que tout le budget formation 2014 est dépensé… :mouais:

 

[magicPDF]

Merci de vos avis et de vos retours d'expérence.

Cet article a été écrit pour toi : http://www.creativepro.com/article/translating-print-skills-to-web-design

 

[ricounet]

Merci MagicPDF pour le lien.

En effet, ça va dans le sens ou Muse permet de se faire la main quand on vient du print et de produire quelque chose de fonctionnel assez rapidement.

Mais j'imagine bien qu'il y a des limites à la génération de code automatique (il me semble probable que des pages conçues dans Muse, puis modifiées, remodifiées, corrigées, recorrigées… vont petit à petit générer du code instable) et que des problèmes d'affichage vont se produire sur des navigateurs… et devoir être réglés dans la mesure ou on vend une prestation à un client.

Et là, à part connaître le code, je ne vois pas d'autre solution.

Je vois d'ailleurs que Muse génère pas mal de Javascript !
S'il faut se mettre là dedans en plus du HTML + CSS, je sais pas si je vais m'en sortir… :mouais:

 

[momo-fr]

Magic fait du prosélytisme Adobe… si Muse était un bon produit de dev web ça se saurait… ça ne se sait pas, tout simplement parce que ça ne l'est pas.

Le web c'est sans Adobe en général (hors Flash), point barre.

PS : je ne dis pas que l'on ne peut pas faire de Web avec les applications Adobe, mais ce serait comme bricoler sa voiture avec 3 clés et 2 tournevis, tu galères grave, alors qu'avec la boîte Facom qui va bien c'est bien plus facile…

 

[bompi]

Je souscris pleinement à cette assertion sans apple. :zen:

 

[magicPDF]

Magic fait du prosélytisme Adobe…

Non, pas sur ce coup là. C'est surtout que j'ai trouvé l'article intéressant mais il provient d'un blog Adobien, il suffit de remplacer le mot "Muse" par un autre.

si Muse était un bon produit de dev web ça se saurait…

C'est un bon produit pour mettre le pied à l'étrier aux débutant.
Pour le reste on est bien d'accord.

Le web c'est sans Adobe en général (hors Flash), point barre.

Mais pas sans Photoshop !