Publicité

conception web libreLorsque vous pensez à des outils que vous pouvez utiliser pour créer des pages Web, vous pensez probablement à des choses comme Kompozer ou Pyromane Guide de l'amateur pour personnaliser la conception de sites Web avec FireBug Lire la suite . Cependant, que se passe-t-il si je vous dis qu'un outil qui peut vraiment stimuler votre créativité quand il s'agit de formuler une mise en page de conception Web est une carte mentale?

Nous avons couvert de nombreux outils de mind mapping ici chez MUO. Nancy a évalué Boîtes à pensées Thoughtboxes: Mind-Mapping répond à votre liste de tâches Lire la suite et Jeffry a couvert Outils de Mindmapping pour Mac MindMapping: 3 logiciels de cartographie d'idées simples pour Mac Lire la suite . Je pense que mon application de mindmapping préférée est le projet open source FreeMind.

Esprit libre est l'un de ceux merveilleusement simples à utiliser, mais aussi complexe que vous en avez besoin quand vous en avez vraiment besoin. C’est ça la beauté. Ainsi, pour les personnes particulièrement créatives, une application comme FreeMind libère littéralement votre esprit pour explorer dans quelle direction vous voulez aller. Lorsque vous essayez de faire quelque chose d'aussi abstrait et complexe que de concevoir le flux et la fonction d'un site Web, c'est le type de flexibilité dont vous avez besoin.

Chez MUO, nous cherchons à aider les lecteurs à "utiliser" des applications d'une manière que vous n'auriez peut-être pas envisagée auparavant. Je suis sûr que certains d'entre vous ont utilisé des outils de mindmapping à cette fin - c'est une foule intelligente après tout. Mais, pour ceux d'entre vous qui n'ont jamais envisagé d'utiliser un outil de mindmapping pour aménager votre tout nouveau site Web, permettez-moi de vous faire une promenade dans le jardin de conception Web FreeMind.

Concevoir un site Web avec FreeMind

Dans sa forme la plus simple, je pense qu'il devient très évident très rapidement pourquoi un outil de mindmapping comme FreeMind est idéal pour la conception web. En seulement quelques minutes, en utilisant uniquement l'option "New Child Node" dans FreeMind, j'ai généré une carte de haut niveau de mon blog.

Comme vous pouvez le voir, FreeMind vous permet de commencer à partir d'une page principale - il n'est pas nécessaire que ce soit la page principale de votre site, il peut s'agir de n'importe quelle page de démarrage - puis de tracer le chemin des liens à travers votre nouveau site.

conception web libre

Dans cet exemple, j'ai conçu une page principale avec six liens de navigation pour les six sous-sections principales de mon site. J'aurais probablement dû également ajouter une page "fonctionnalités" ou "articles", car c'est tout l'intérêt d'un blog. Mais c'est la beauté d'une carte mentale - vous pouvez la modifier et la modifier pour l'adapter à toutes les idées de conception qui vous viennent à l'esprit en cours de route.

Bien sûr, lorsque vous commencez à créer votre site Web et que vous avez des pages à afficher, vous pouvez ajouter des hyperliens vers ces pages directement à partir de votre carte mentale. Ainsi, lorsque vous créez votre site à partir de votre plan FreeMind, vous pouvez littéralement suivre tout directement depuis le plan lui-même.

esprit libre pour la cartographie de sites Web

Vous souhaitez consulter la page Contact que vous avez modifiée il y a quelque temps? Ne vous embêtez pas à prendre le temps d'ouvrir votre navigateur et de taper l'URL, cliquez simplement sur votre lien FreeMind et vous y êtes.

esprit libre pour la cartographie de sites Web

Vous pouvez voir l'URL du lien en survolant le nœud - il apparaît dans la barre d'état inférieure.

La création d'hyperliens facilite l'accès aux pages que vous concevez, ce qui rendra bien sûr l'ensemble de votre processus de conception Web plus efficace. La carte mentale de votre site Web peut servir de plaque tournante centrale - votre feuille de route de conception Web - à partir de laquelle vous pouvez travailler pour achever votre projet de conception.

Une autre fonctionnalité vraiment sympa de FreeMind est la possibilité d'ajouter des images aux nœuds. Cliquez simplement sur Insérer - Image dans le menu, ou cliquez sur le nœud et appuyez sur Alt-K. Accédez simplement au fichier image que vous souhaitez utiliser. C'est beaucoup plus facile si vous redimensionnez l'image de manière à ce qu'elle soit de la taille d'une miniature - sinon vous devrez modifier la vue Code HTML dans FreeMind après avoir importé l'image.

esprit libre pour la cartographie de sites Web

Cliquez sur l'image, et un outil d'édition apparaît qui vous permet d'ajouter une petite légende sous l'image. Vous pouvez l'utiliser pour ajouter un peu de pizzaz à votre carte mentale de conception Web. Je l'ai utilisé pour montrer les images des écrivains, et le nœud lui-même représente leur page de profil sur le site.

site web freemind

Si cela ne vous dérange pas que votre carte devienne énorme, vous pouvez même insérer des aperçus instantanés des pages, les images que vous pensez représenter le but de la page, ou toute autre utilisation pour les images de noeud que vous pouvez venir avec. Personnellement, j'aime utiliser des images dans ma carte mentale de conception Web, car elle lui donne plus de caractère et offre un petit aperçu du contenu de la page pour tous ceux qui peuvent consulter la carte pour la première fois temps.

Une autre fonctionnalité vraiment sympa de FreeMind qui s'intègre parfaitement dans le jeu d'outils de conception Web est l'outil de gestion du temps intégré à FreeMind. Vous pouvez y accéder en allant dans "Outils" puis en choisissant "Afficher le calendrier". Cela fera apparaître une grande fenêtre «Gestion du temps» du calendrier.

site web freemind

Vous pouvez appliquer des dates aux nœuds en cliquant sur «Ajouter la date aux nœuds sélectionnés». C'est une façon intéressante de faire un contrôle de version sur vos pages, en horodatant le nœud avec la date à laquelle cette page particulière a été créée ou mise à jour.

La date que vous avez choisie sera ajoutée à la fin du texte du nœud.

site web freemind

Mieux encore, pourquoi ne pas configurer un calendrier afin qu'une fois votre site terminé, vous puissiez recevoir un rappel lorsqu'il est temps de mettre à jour une page sur le site. C'est un moyen génial de planifier systématiquement un calendrier de mise à jour pour un site, en planifiant des mises à jour de pages spécifiques au fil du temps, afin que la mise à jour d'un site Web ne devienne pas une corvée écrasante et chaotique.

Pour ce faire, sélectionnez simplement le nœud, accédez au calendrier de gestion du temps, choisissez la date à laquelle vous souhaitez mettre à jour la page, puis cliquez sur «Me le rappeler à cette date».

Comment utiliser FreeMind pour concevoir ou gérer un site Web freemind8

Une petite icône d'une horloge apparaîtra sur ce nœud. Cela vous indique qu'une alarme lui est associée et vous recevrez une notification contextuelle sur votre ordinateur au moment de mettre à jour cette page. Jamais pensé que vous utiliseriez un outil de mindmapping pour la gestion de projet de conception Web, n’avez-vous pas

De plus, si vous souhaitez voir l'intégralité de votre programme de mise à jour, répertorié par page, accédez simplement à Outils et sélectionnez «Afficher la liste des planificateurs de temps».

Comment utiliser FreeMind pour concevoir ou gérer un site Web freemind9

Vous obtiendrez un rapport complet de toutes les pages que vous avez planifiées, quand vous les avez planifiées (créées) et la date à laquelle cette page particulière doit être mise à jour ensuite.

Comment utiliser FreeMind pour concevoir ou gérer un site Web freemind10

Le seul endroit où ce système pourrait échouer est si vous mettez à jour la page et oubliez de revenir et de mettre à jour le nœud avec une nouvelle heure et date de mise à jour. Donc, essayez de prendre l'habitude de le faire, et vous continuerez à faire fonctionner votre système de mise à jour de page en douceur.

Oh, et il y a une dernière fonctionnalité importante que j'ai presque oublié. C'est en fait assez important si vous avez tendance à être l'un de ces programmeurs qui perd la trace de l'endroit où vous stockez vos fichiers de projet.

FreeMind a la possibilité de créer un lien hypertexte vers des fichiers sur votre PC, vous pouvez donc utiliser cette fonctionnalité pour lier les nœuds de page au code réel qui est enregistré sur votre ordinateur. Il vous suffit d'aller dans «Insérer», de choisir «Lien hypertexte (sélecteur de fichiers)», puis de parcourir le fichier auquel vous souhaitez lier ce nœud.

conception web libre

Le lien de fichier pour ce nœud apparaît sous la forme d'une flèche rouge. Chaque fois que vous souhaitez apporter des modifications au code, cliquez simplement sur le lien du fichier, et il l'ouvrira instantanément pour vous - pas besoin d'aller fouiller pour essayer de le trouver. Assurez-vous simplement de vous souvenir où vous l'avez enregistré afin de pouvoir télécharger les modifications sur votre serveur Web.

Comme vous pouvez le voir, l'utilisation d'un outil de mindmapping comme FreeMind vous aide non seulement à concevoir la mise en page et le flux de votre site, il peut même vous aider à gérer l'intégralité de votre projet de conception Web du début à la fin.

Quels outils utilisez-vous pour gérer vos projets de conception Web? Envisageriez-vous plutôt d'essayer FreeMind? Avez-vous d'autres idées créatives pour utiliser un outil de mindmapping dans le cadre d'un projet de conception web? Partagez vos pensées dans la section des commentaires ci-dessous.

Ryan est titulaire d'un BSc en génie électrique. Il a travaillé 13 ans dans l'ingénierie d'automatisation, 5 ans dans l'informatique et est maintenant ingénieur d'applications. Ancien rédacteur en chef de MakeUseOf, il a pris la parole lors de conférences nationales sur la visualisation des données et a été présenté à la télévision et à la radio nationales.