Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

Dreamweaver à l'heure du smartphone et des tablettes
La version de CS6 génère un code unique qui couvre les écrans de tous les appareils

Le , par Gordon Fowler

0PARTAGES

3  0 
« Développé une fois, fonctionne partout ». Cette devise de Java est également, depuis aujourd’hui, un des principaux arguments de la nouvelle version de Dreamweaver, l’outil de création de sites de Adobe annoncée officiellement ce matin.

Le but de cette version est en effet de mettre fin au casse-tête des différentes tailles d’écran pour les Webdesigners. « C’est aujourd’hui un des plus gros problèmes des développeurs » affirme Scott Fegette en charge du produit chez Adobe. « Avec Dreamwaever CS6, je crois que l’on peut dire qu’il est résolu ».

Comment ?

Dreamweaver CS6 permet de définir trois modèles d’affichage d’un même site en fonction de la taille de l’écran. Un écran de PC de bureau de 21 pouces affichera par exemple un site sur 5 ou 6 colonnes, une tablette de 7 à 10 pouces un site sur 3 ou 4 colonnes, et un smartphone une page sur une ou deux colonnes. C’est ce que Adobe nomme le « Fluid Grid Layout ».

Concrètement, le développeur définit une seule fois les contenus. Il n’a plus ensuite qu’à indiquer quelles <div> disparaissent entre chaque version de l’affichage et à définir les repositionnements de celles qui restent.

Le résultat est un développement unique et un site unique. Mais qui s’adapte au contexte avec un repositionnement automatique. Le parfait exemple (qui l’illustre mieux qu’un long discours) est la page du Boston Globe, réalisée avec une pré-version de l’outil :

Boston Globe, version "PC" :


Boston Globe, version "Tablette" :


Boston Globe, version "Smartphone" :

Pour accompagner ce « Fluid Grid Layout », Dreamweaver embarque également un nouvel outil de prévisualisation (« Multiscreen Preview »). Trois boutons distincts permettent d'accéder à tout moment à ce qui sera effectivement affiché pour chacune des trois versions du site.

Dans un domaine différent, mais toujours dans le même mouvement vers le développement mobile, Dreamweaver CS6 améliore son support de jQuery Mobile, le framework qui permet de créer des applications natives pour iOS et Android directement dans l’éditeur.

A noter également une autre nouveauté importante. Lors de cette présentation, Scott Fegette a bien mis en avant la meilleure prise en charge des effets de transitions qui s'appuient sur CSS3. Signe supplémentaire du virage "post-Flash" de Adobe ?

Dreamweaver CS6 est officiellement prévu pour le 7 mai.

Source : Developez.com et Adobe France



Et vous ?

Intéressé(e) par le « Fluid Grid Layout » ? Va-t-il simplifier vos développements ?
Que pensez-vous de cette nouvelle version : séduit(e) ou attendiez-vous d'autres fonctionnalités ?

Une erreur dans cette actualité ? Signalez-le nous !

Avatar de RPGamer
Membre actif https://www.developpez.com
Le 23/04/2012 à 14:09
Intéressant comme fonctionnalité. Bootstrap Responsive le fais depuis quelques temps déjà, gratuitement et accompagné de pleins d'autres fonctionnalités. A voir à l'utilisation dans Dreamweaver, on a pas plus de détails.
1  0 
Avatar de camus3
Membre éprouvé https://www.developpez.com
Le 24/04/2012 à 14:34
Le travail d'un développeur web ne saurait se résumer à la conversion de mockups en HTML.
Je n'ai jamais parlé de "développement" web ( développeur quoi ? ) mais bien d'intégration . si tu comptes faire autre chose que ça avec DREAMWEAVER alors tu perds encore plus ton temps effectivement.

Enfin Développeur web cela ne veut rien dire et ne dénote d'aucune technique ou compétence. développeur web ? j2ee ? php ? net ? rails ? node ? ça veut dire quoi développeur web ?
1  0 
Avatar de Benjamin Delespierre
Expert éminent https://www.developpez.com
Le 23/04/2012 à 16:13
Je demande à voir, jusqu'ici Dreamweaver à été pour moi plus une source de problèmes vu toutes les pages faites avec cet outils que j'ai eu à remettre d'équerre.
0  0 
Avatar de Benjamin Delespierre
Expert éminent https://www.developpez.com
Le 24/04/2012 à 10:30
Citation Envoyé par camus3 Voir le message
Certains préfèrent taper leur html au bloc note , tant mieux si ils ont du temps à perdre.
Le travail d'un développeur web ne saurait se résumer à la conversion de mockups en HTML.
0  0 
Avatar de Vil'Coyote
Modérateur https://www.developpez.com
Le 24/04/2012 à 14:13
et la vie ne s'arrête pas à DW ainsi qu'à l'html
0  0 
Avatar de alex_vino
Membre émérite https://www.developpez.com
Le 24/04/2012 à 23:30
Citation Envoyé par camus3 Voir le message
Je n'ai jamais parlé de "développement" web ( développeur quoi ? ) mais bien d'intégration . si tu comptes faire autre chose que ça avec DREAMWEAVER alors tu perds encore plus ton temps effectivement.

Enfin Développeur web cela ne veut rien dire et ne dénote d'aucune technique ou compétence. développeur web ? j2ee ? php ? net ? rails ? node ? ça veut dire quoi développeur web ?
Chaque nom de métier ne veux rien dire...

Ceci dit il est bon de voir que Adobe s'investit maintenant a fond dans le futur du Web, tant du point de vue implémentation que recherche.
0  0 
Avatar de dejabu
Candidat au Club https://www.developpez.com
Le 25/04/2012 à 21:54
Bonjour,

J'ai trouvé ça dommage que maintenant que je me suis mi à apprendre l'Objective C et que j'arrive à développer une application native, ils sortent ces outils. Je suis curieux de voir la performance des ces applications.
0  0 
Avatar de Dge-06
Futur Membre du Club https://www.developpez.com
Le 26/04/2012 à 18:28
J'ai un peu du mal à comprendre.

Pour adapter un site en fonction de l'écran, il suffit de passer les div en 100% (width). Je ne vois pas ce que cette version apportera de plus...

L'apercu multi écran existe déjà sur la cs5.5

Curieux de voir la différence.
0  0 
Avatar de alex_vino
Membre émérite https://www.developpez.com
Le 26/04/2012 à 21:54
Citation Envoyé par Dge-06 Voir le message
J'ai un peu du mal à comprendre.

Pour adapter un site en fonction de l'écran, il suffit de passer les div en 100% (width). Je ne vois pas ce que cette version apportera de plus....
Non, les sites web concus pour smartphones contiennent moins d'informations que celui pour PC,
et surtout ces informations sont présentées différemmennt (un écran pc est au format paysage, un smartphone format papier).
Regarde bien les screenshot de l'article, ils sont tres réprésentatifs justement.

Par ailleurs faire un site web avec des div a 100% et des textes qui d'adaptent est fortement déconseillé.
0  0 
Avatar de Dge-06
Futur Membre du Club https://www.developpez.com
Le 27/04/2012 à 11:18
Je ne vois pas d'ou ça contient moins d'informations...

Je développe des sites web mobile depuis maintenant 2 ans, et je peux te dire que c'est pareil!!

Et quand tu dis: "un écran pc est au format paysage, un smartphone format papier" Il faut savoir que aucun smartphone a la même résolution ou voir très peu.

C'est là que jquery mobile intervient. Il passe dalleurs ses div en pourcentage et non en pixels.

De toute façon à l'heure actuelle, un site ne peut être développé que en tableaux ou en div. (enfin à ma connaissance).

C'est pour celà que je ne vois pas ce que cette version apportera de plus quand ils parlent d'adapter un site à l'écran vu que ça se fait déjà depuis des années en paramétrant en pourcentage et non en pixels.

Quand tu dis: "Par ailleurs faire un site web avec des div a 100% et des textes qui d'adaptent est fortement déconseillé. "

Je suis d'accord avec toi pour les sites version pc ou mac, mais version mobile, tu n'as pas le choix.
0  0