QuatreCentQuatre


La problématique des “fontes” sur le Web

LES FONTES
Depuis des siècles, les designers web tentent tant bien que mal d'exprimer leur créativité malgré la dictature impitoyable des familles Arial, Verdana et autres Tahoma. Mais à l'horizon pointe une lueur d'espoir. Le moment où les designers pourront enfin utilisé la fonte de leurs choix approche, sans le moindre égard aux limitations qui pullulent du côté client et, ainsi, éviter les soupirs de leurs collègues intégrateurs.

CSS3
Même si elle existe depuis CSS2, la propriété CSS @font-face n'a toujours pas été adoptée à grande échelle. Triste, surtout si on tient compte de la facilité d'implantation:

  1.  
  2. /*CSS*/
  3.  
  4. @font-face{
  5. font-family: 'laFonte';
  6. src: url('../laFonte.ttf');
  7. }
  8.  
  9. /*Après avoir annoncé la règle @font-face, il ne
  10. s'agit que d'attribuer la nouvelle famille aux balises souhaitées*/
  11.  
  12. p {
  13. font-family: "laFonte",Verdana, Geneva, sans-serif;
  14. }
  15.  
  16. /*fin*/
  17.  

Si le fureteur ne supporte pas @font-face ou s'il y a un problème avec la source, la fonte suivante dans le "CSS font stack" jouera son rôle.

Cependant, deux problèmes majeur se dresse devant les utilisateur potentiel de cette façon de faire.

Premièrement, pour la plupart des fonderies rendre une de leur fonte disponible sur un serveur web constitue une violation des droits d'utilisation de celle-ci.

Deuxièmement. Le support est encore très peu convaincant. Safari 3.1 est le seul qui supporte cette propriété. Opera 10 et Firefox 3.5 devrait l'implanter, tandis qu'IE la supporte seulement si la fonte liée est une "Embedded OpenType".
Une .EOT est créée grâce au logiciel WEFT de Microsoft (ou ttf2eot pour Linux). La transformation d'une fonte dans ce format compressé ne se fait malheureusement pas toujours sans heurts. Certaines glyphes peuvent être altérées, et certaines fontes ne survivent tout simplement pas à l'opération de compression du logiciel de Microsoft. Ce qui rend cette avenue fort hasardeuse.

EN ATTENDANT
D'ici à ce que @font-face soit réellement implanté dans notre univers multi-fureteur, nous avons qu'en même à notre disposition des outils pour combler cet étonnant vide technologique... Voici deux solutions ayant fait leur preuve. SiFr est dans le décor depuis belle lurette et Cufòn est un nouveau venu fort prometteur...

sIFR (Scalable Inman Flash Replacement)
L'idée de base est simple. Intégrer la fonte souhaitée dans un SWF ayant un champ texte dynamique à l'intérieur. Puis, grâce au javascript, localiser les textes à remplacer, les mesurer et les "lire". Ensuite, créer des objets Flash de même taille, contenant le même texte et les placer à la même position que le texte remplacé.

L'implantation est relativement facile: Il faut créer un SWF, importer un fichier javascript et écrire une ligne de code javascript pour chaque type de balise/class/id que l'on veut remplacer qui pourrait bien ressembler à ceci:

  1. sIFR.replaceElement("h1", named({sFlashSrc: "./vandenkeere.swf", sColor: "#000"}));

Cependant, il est nécéssaire de faire un peu de lecture afin de comprendre l'interaction entre le javascript, le SWF et le CSS.

Les avantages sont nombreux :

  • Textes sélectionnables et disponibles pour les engins de recherche.
  • Fontes nettes et précise.
  • Textes sujets aux CSS et à certains effets Flash (dropshadow, anti-aliasing, etc...).
  • Reconnaissance et soulignement automatique des liens.
  • Plusieurs "add-ons" dont un pour JQuery.
  • Totalement légal du point de vue des fonderies.

Il y a qu'en même quelques désavantages :

  • Requiert le Javascript activé ainsi que FlashPlayer 6+ pour fonctionner.
  • Étant un outils très malléable - le "font-tuning" surtout - SiFR peut devenir très complexe et source de frustration dans des projets complexes où se côtoient divers "frameworks" Javascript et/ou des feuilles de style tentaculaire.

D'ailleurs, les concepteurs suggèrent d'utiliser sIFR avec parcimonie. Si vous confinez l'outil à des endroit rare et bien choisie, l'intégration ne sera que plus aisée.

Cufòn
L'avenir est rose et simple pour cet héritier de Typeface. Grâce à un générateur disponible gratuitement, on peut convertir une fontes en fichier .js qui nous permettra de reproduire en SVG les glyphes souhaitées.

Tout aussi simple d'implantation que sIFR, voir même plus, Cufòn requiert peu de chose. On créer le fichier de fonte dans le générateur en 2-3 cliques, on importe le fichier de fonte ainsi que le fichier Javascript Cufòn dans le "header" de la page. Puis, on remplace le contenu des balise désiré en appelant une méthode portant le nom judicieux de... replace() !

  1.  
  2. <script type="text/javascript"src="js/cufon-yui.js"></script>
  3. <script type="text/javascript" src="js/funky.font.js"></script>
  4. <script type="text/javascript"> Cufon.replace('h1'); </script>
  5.  

Les avantages :

  • Seul le Javascript est nécéssaire
  • Coté CSS, les images créées sont identiques aux glyphes remplacées.
  • Supporté par la quasi-totalité des fureteurs: FireFox 1.5+, Safari 3+, Opera 9.5+, Chrome et IE 6/7/8, ce dernier requiert une ligne Javascript de plus en fin de page pour palier à sa lenteur d'affichage, mais rien de majeur.
  • Communauté florissante et motivé à amélioré le concept.

Malheureusement, Cufòn est encore loin d'être parfait :

  • Sélection du texte impossible.. une image reste une image.
  • Problème avec quelques vieilles fontes PostScript Mac.
  • Fidélité de transitions entre glyphes et images SVG pas toujours parfaite, mais toujours correct.
  • Encore quelques zones grises du point de vue légal. Mais les discussions vont bon train semble-t-il.
  • Problème avec certains sélecteurs CSS spécialisés.

Cufòn n'offre rien de plus qu'un simple remplacement d'image du point de vue de l'accessibilité, cependant, si les changement de titre sont fréquents, ce dernier reste une alternative à ne pas négliger...

En terminant, si les titres en fontes particulières sont votre pain quotidien, prendre quelques heures pour maitriser sIFR parait être un excellent investissement qui ne ferait qu'améliorer le référencement de vos créations.

Sinon, Cufòn reste une alternative simple qui reste qu'en même plus aisée que d'avoir à changer les images de vos titres dans Photoshop à chaque changement de virgule!

Lien vers sIFR.
Lien vers Cufòn.

SWFAddress’ NavigationManager redux

Dans notre dernier post nous vous avons démontré comment utiliser le NavigationManager. Voici un petit démo qui vous aidera à figurer les propriétés d'un SectionData retourné par le système.

Vous verrez, l'essayer c'est l'adopter!

DÉMO
TÉLÉCHARGER

Utilisation de SWFAddress à travers le NavigationManager

Le NavigationManager de QuatreCentQuatre est une enveloppe ou un Proxy qui sert à titre d’interface à la classe SWFAddress de Asual afin de mieux contrôler son comportement et d’en étendre les fonctionnalités.

SWFAddress d'Asual

SWFAddress est une combinaison de techniques permettant, à travers des classes Javascript et Actionscript, le deep-linking (la possibilité d’accéder à des sections ou des pages directement à partir de la barre d’adresse du fureteur) dans des sites programmés en Flash. Cette technique, en plus de permettre l’utilisation de signets et des boutons Suivant et Précédent du fureteur, est une des meilleures solutions afin d’optimiser son site pour les moteurs de recherche.

SWFAddress

Afin d’utiliser SWFAddress, il suffit d’intégrer l’outil dans le HTML de la façon suivante :

  1. <script type="text/javascript" src="library/swfobject.js"></script>
  2. <script type="text/javascript" src="library/swfaddress.js"></script>
  3. <script type="text/javascript">
  4. var flashvars = {};
  5. var params = {};
  6. var attributes = {id:"flashMovie"};
  7. swfobject.embedSWF("navigationExample.swf", "alternateContent", "100%", "100%", "9.0.124", false, flashvars, params, attributes);
  8. </script>
  9.  

UTILISATION DE SWFADDRESS

L’intégration dans Flash s’effectue ensuite comme suit :

  1. private function init() :void{
  2. SWFAddress.addEventListener(SWFAddressEvent.CHANGE, handleChange, false, 0, true);
  3.  
  4. //Exemple de changement de page, mais une page ‘’/’’ est reçue par défaut au départ de l’application
  5. SWFAddress.setValue(‘’page1’’);
  6. }
  7.  
  8. private function handleChange(evt:SWFAddressEvent):void{
  9. var laSection:String = evt.value;
  10.  
  11. //La seule information obtenue est un string, une condition doit donc être programmée
  12. switch(laSection){
  13. case ‘’X’’ :
  14. //opération afin de changer de section
  15. //Changer le titre de la page (défini manuellement)
  16. //Vérifier si c’est la section demandée n’existe pas, etc…
  17. }
  18. }
  19.  

SWFAddress présente aussi plusieurs outils pour, par exemple :

  • Ouvrir des liens externes
  • Reculer dans l’historique
  • Monter de niveau hiérarchique (section1/section1-1 vers section1/)
  • Changer le titre de la page (dans quel cas SWFAddress doit être déclaré sous la balise dans le html.

Note : SWFAddress, quand il est utilisé adéquatement, remplace et surclasse le moteur d’indexation des fichiers swf des moteurs de recherche populaires tels que Google, c’est pourquoi il est important d’inclure un fichier robots.txt afin d’empêcher ceux-ci d’indexer automatiquement les fichiers gérés par SWFAddress ou le NavigationManager.
Exemple de fichier robots.txt :

  1. Sitemap: http://www.asual.com/sitemap.xml
  2. User-agent: *
  3. Disallow: /*.swf*
  4.  

 
 
NAVIGATIONMANGER

Le mandat de SWFAddress est de permettre le deep-linking et cet objectif est atteint. Toutefois, des mécanismes personnalisés doivent être mis en place afin d’en régir le fonctionnement ainsi que les cas d’exception. Que faites-vous si vous voulez que la description des sections soit chargée à l’externe, passer à la section suivante, assigner des descriptions aux sections, obtenir les infos de son parent ou encore que vous désirez savoir à quel niveau hiérarchique se trouve la section courante? Vous devrez programmer vos propres mécanismes ou utiliser le NavigationManager.

Propriétés et méthodes publiques

Structure du NavigationManager de QuatreCentQuatre

Structure du NavigationManager de QuatreCentQuatre


 
 
Étant donné que le NavigationManager est une enveloppe à SWFAddress, les classes de ce dernier seront requises et l’intégration Javascript s’effectuera de la même façon.
 
 

  1.  
  2. <script type="text/javascript" src="library/swfobject.js"></script>
  3. <script type="text/javascript" src="library/swfaddress.js"></script>
  4. <script type="text/javascript">
  5. var flashvars = {};
  6. var params = {};
  7. var attributes = {id:"flashMovie"};
  8. swfobject.embedSWF("navigationExample.swf", "alternateContent", "100%", "100%", "9.0.124", false, flashvars, params, attributes);
  9. </script>
  10.  

Le NavigationManager fonctionne selon un schéma XML qui peut être défini manuellement ou chargé à l’externe, voici un exemple de la structure du XML requis.

  1.  
  2. <response>
  3. <header>
  4. </header>
  5. <body>
  6. <page>
  7. <item type="default">
  8. <description>Section 1</description>
  9. <tag>section1</tag>
  10. <ressource>sectionclasses.Section1</ressource>
  11. <subitems>
  12. <item type="normal">
  13. <description>Ceci est la section 1.1</description>
  14. <tag>section1-1</tag>
  15. <ressource>sectionclasses.Section1_1</ressource>
  16. </item>
  17. <item type="normal">
  18. <description>Ceci est la section 1.2</description>
  19. <tag>section1-2</tag>
  20. <ressource>sectionclasses.Section1_2</ressource>
  21. </item>
  22. </subitems>
  23. </item>
  24. < item type="notfound">
  25. <description>Section not found</description>
  26. <tag>sectionnotfound</tag>
  27. <ressource>sectionclasses.Section1</ressource>
  28. </ item>
  29. </page>
  30. </body>
  31. </response>
  32.  

Les informations d’une section doivent se retrouver à l’intérieur d’une balise <item> et doivent se situer à l’intérieur du node <page> qui sert de conteneur aux informations de la navigation.

Les informations à retrouver sont les suivantes :

  • L’attribut type qui peut valoir normal au default. Une valeur default indique que cette section est celle qui sera chargée par défaut lors de l’initialisation du système (au lieu de « / »)
  • La balise tag, qui sera utilisée comme identifiant dans la barre d’addresse et pour google analytics.
  • La balise description, qui est une valeur qui peut servir, par exemple, à nommer le bouton qui mènera à la section ou encore au titre de la page si la propriété useDescriptionAsTitle a une valeur de true.
  • La balise ressource, que vous pourrez utiliser afin de spécifier à quelle ressource (classe, fichier swf ou lien externe) la section est liée.
  • Une balise subitems optionnelle qui contiendra des nodes items qui seront considérés les enfants de l’item courant.

Notez qu’un deuxième node de structure similaire mais d’un type notfound peut être placé à la racine de l’arbre afin de régir la section utilisée lorsqu’une page reçue n’est pas définie dans le XML. Si ce node facultatif n’est pas défini, la page par défaut sera utilisée.

UTILISATION DU NAVIGATION MANAGER

L’intégration dans Flash est simple :

  1.  
  2. private function init() :void{
  3. NavigationManager.instance.addEventListener(NavigationManagerEvent.SECTION_CHANGED, handleSectionChanged, false, 0, true);
  4. NavigationManager.instance.addEventListener(NavigationManagerEvent.MENU_XML_LOAD_COMPLETE,
  5. handleMenuLoadComplete, false, 0, true);
  6. NavigationManager.instance.loadMenuXML(new URLRequest(‘’menu.xml’’));
  7. }
  8.  
  9. private function handleSectionChanged (evt: NavigationManagerEvent):void{
  10. //Référence vers la section courante
  11. var laSection:SectionData = evt.section;
  12. //ou
  13. var laSection2:SectionData =NavigationManager.instance.getCurrentSection();
  14. //On pourrait créer une section à partir de la ressource :
  15. var sectionClass:Class = getDefinitionByName(e.section.ressource) as Class;
  16. var currentSection :DisplayObject = new sectionClass() as SectionObject
  17. addChild(currentSection);
  18. }
  19.  
  20. private function handleMenuLoadComplete (evt: NavigationManagerEvent):void{
  21. //Effectue les operations afin de créer le menu
  22. var iterator:ISubSectionIterator = NavigationManager.instance.sectionsList;
  23. var length:int = iterator.numSubSections;
  24. for (var i:int = 0; i < length; i++) {
  25. var laSection:SectionData = iterator.getSubSectionAt(i);
  26. }
  27. }
  28.  

Comme on peut le constater, il peut être pratique d’écouter sur l’événement MENU_XML_LOAD_COMPLETE afin de savoir si le XML est chargé alors que l’événement SECTION_CHANGED est utile afin de savoir quand une section a changé. Notez que l’événement SECTION_CHANGED ne sera jamais diffusé avant que la fin du chargement du XML externe ou avant l’assignation manuelle du XML à travers la fonction NavigationManager.instance. sectionsList. setMenuStructure().


PRATIQUES À ADOPTER

  • Dans les items associée à une section (un bouton de menu par exemple) implémentez une propriété qui entreposera une référence vers le SectionData de la section qu’ils représentent afin de faciliter l’utilisation du système. En plus, l’espace mémoire requis sera plus petit qu’une valeur textuelle de son chemin enregistrée dans un String.
  • Si vous avez plus d’un menu pour la navigation, vous pouvez les englober dans des nodes à la racine du groupe qui serviront ni plus ni moins de conteneurs aux sous-sections qu’ils contiendront. Pour y accéder individuellement lors de la création dynamique des menus, vous pouvez utiliser la fonction NavigationManager.instance.sectionsList.getSectionByTag(‘’conteneur X’’) à partir duquel vous pourrez accéder à ses enfants. De plus, la structure dans Google Analytics n’en sera que plus claire étant donné que la section sera identifée comme suit : conteneurX/sectionY

 
 
BIBLIOGRAPHIE
SWFAddress Bad Practices
http://www.asual.com/blog/swfaddress/2007/05/18/swfaddress-bad-practices.html
SWFAddress and robots.txt
http://www.asual.com/blog/swfaddress/2008/11/25/swfaddress-and-robots-txt.html

Télécharger la version 1.0 du NavigationManager:
LIEN

Librairies externes en Flash

La problématique des productions Flash multi fichiers

Lors du développement d’un site Flash à fichiers multiples, une problématique apparait très rapidement dans le processus de développement : La réutilisation des même éléments (graphiques, classes, composants) dans plusieurs des fichiers du site. Le problème vient entre autre du fait que chaque fichier  SWF a une librairie de graphique, composant, et classes unique. De ce fait, si on veut utiliser le même graphique dans deux fichiers SWF, ont doit donc recopier les mêmes éléments qu’on désire réutilisable dans toutes les librairies nécessaires. Cela implique une redondance des éléments et donc une multiplication du poids des fichiers.

Avant  l’arrivé de Flash CS4 et de l’ActionScript 3, il n’y avait pas beaucoup de solution pour contourner le problème. Ont pouvait utiliser un fichier exclude.xml au même endroit que notre fichier FLA pour définir les classes qui ne devait pas être compilé  dans le fichier SWF. Ainsi on pouvait exclure les classes qui étaient dupliqué à travers plusieurs fichiers SWF de l’application. Le problème était qu’on devait quand même recopier les éléments graphiques dans chacun des ces fichiers FLA pour ne pas avoir des erreurs de compilation sur des éléments inexistant dans la librairie.

Exemple de la problématique multi fichiers

Example de la problématique




Les modules

Depuis la sortie de la suite CS4, il est maintenant possible d’intégrer des librairies externes pour la compilation directement à partir de l’IDE de Flash. Il est donc maintenant possible de créer une librairie d’élément (graphique, composant, classes) qu’on désirer partager à travers plusieurs fichiers mais qui ne seront pas compiler (injecter) dans le fichier final d’un SWF donné. L’arrivée des modules élimine donc la redondance de poids avec la réplication des éléments partagés dans plusieurs librairies des fichiers FLA.

Pour créer une application multi fichiers avec module, ont doit donc commencer par créer le module en tant que tel et ensuite ce module est charger en premier par le fichier principal (celui qui s’occupe du chargement des fichiers subséquents) et ensuite procède au chargement des sections ou sous-section de l’application. Dès que le module est chargé, les sections et sous-sections ont directement accès aux ressources de celui-ci. Le module doit cependant être chargé de façon à ce que « l’Application Domain » soit le même que le fichier principale pour que les ressources soient accessible.

Example avec module

Example avec module




Création d’un module
Le module se crée en deux étapes. En premier lieu, on crée un fichier FLA et on y place tous les éléments réutilisables que nous voulons partager à travers les différents fichiers SWF du site ou de l’application. Ensuite, nous exportons le tout en format SWC (fichier SWF compressé par ZIP) et SWF. À partir de cet instant, le module est donc terminer et prêt à être utiliser directement dans les autres fichiers.

Exemple de création

  • On crée un fichier “module.fla” dans lequel on inclut tout les éléments (graphiques, composants, classes, etc...) à partager
  • On exporte ce fichier en “module.swc”
  • On compile ce fichier en ”module.swf”
  • Pour tous les fichiers FLA qui doivent utiliser ces éléments, inclure le SWC dans les paramètres de publication sous l’onglet “External Library Path”
  • Dans votre fichier principal, charger le fichier “module.swf” en premier lieu, et ensuite procéder au chargement des sections et sous-section selon le besoin

En mode développement, on peut bien tester les sections et sous-sections en chargeant directement le module dans ces fichiers avant toute exécution du code pour pouvoir bien tester les fonctionnalités. Lors de la mise en ligne, on retire tout simplement le chargement du module dans les sections et sous-sections. C'est présentement la meilleure solution pour le travail en multi fichiers.

Présentation Techno !

C'est le début d'un temps nouveau chez Quatrecentquatre. À partir de ce mois-ci, en fait directement cette semaine, nous allons débuter un nouveau processus interne qui j'espère nous permettra de rester à l'avant-garde comme développeur d'application interactive et aussi stimuler notre curiosité du domaine.

Ce sera en effet le début des "Présentation Techno 4C4". Dans le cadre de la présentation, chaque membre de l'équipe doit se trouver un sujet technologique, en rapport avec notre domaine bien sûr, qui n’est pas ou peu connu des autres personnes et qui est d’un intérêt certain pour les développeurs. Comme nous sommes au courant des guerres "viriles" entre les développeurs sur certain sujet (PHP vs ASP, Linux vs Windows, iPhone vs BlackBerry) et que nous voulons éviter la discrimination envers les minorités visibles (Cobol, Silverlight), nous avons établis des règles pour déterminer un bon sujet et aussi encourager les membres de l'équipe à aller vers des technologies opposés à leur vision.

Un bon sujet Techno 4C4 est :

  • Un nouveau langage de programmation peu connu.
  • Un élément peu connu ou peu utiliser d’un langage de programmation existant.
  • Une nouvelle technique de production Web ou logiciel.
  • Une nouvelle technique pour un langage en particulier.
  • Une nouvelle technologie (physique ou virtuelle).
  • Une nouvelle approche pour résoudre des problèmes affrontés couramment durant le développement d’une application Web.
  • Une nouvelle approche de résolution de problème générique.
  • Développement sur de nouvelles plateformes (mobile, iPhone, Silverlight)

Présentation de courte durée, a raison d'une fois par mois, elle seront bien entendu retranscrite ici sur le blogue pour permettre à tous de profiter des trouvailles.

Système de gestion de contenu, plait-îl ?

Vers la fin des années 90, les système de gestion de contenu ont débuté leur ascension vers la popularité pour tous les sites de petite et moyenne envergure. Les boîtes de production interactive voulaient vendre des sites clef en main. Pour que le client puisse ainsi gérer entièrement sont site comme bon lui semble. Nous avons donc vu au cours des 15 dernières années, dans le cadre de notre travail, des système de gestion de contenu mal fait qui rendait le travail de mise à jours des sites ardu et pénible, et d'autre qui au contraire répondait très bien aux besoins mais qui avec la progression des technologies (intégration Web valide, sémantique, dynamisation avec JavaScript, réseaux sociaux) sont maintenant désuets. Nous avons ensuite vu l'émergence des système de gestion de contenu "libre de droit" (Typo3, Drupal, DotNetNuke, etc.) en grand nombre pour le  bonheur des clients moins fortunés. Une solution viable, solide, et robuste (tout dépendant du gestionnaire choisi) à la porté de tous ou presque.

Qu'en est-il maintenant des système de gestion de contenu ? En tant que client ou personne ayant besoin des fonctions d'un système de gestion de contenu, comment choisir la meilleure option pour nos besoin ? Est-ce que le client a réellement besoin d'un système de gestion de contenu ? Est-ce vraiment la meilleur solution pour mon site / application ? La réponse devrait être simple mais malheureusement elle ne l'est pas. Il n'existe aucune réponse parfaite qui saura répondre à tout les besoins que ce soit d'un système de gestion de contenu hyper simple au plus complexe. Pour faire un choix éclairé et qui correspond vraiment à nos besoins, je crois qu'il est important de décrire exactement les options qui s'offrent à un client pour les choix de développement d'un site ou d'une application avec système de gestion de contenu.

Il n'existe malheureusement aucune réponse généralisée qui permet de choisir une solution spécifique qui répondra à tous les cas de figures. À chaque projet sa solution. La meilleure option pour un projet donnée n'est pas nécessairement souhaitable pour un autre projet.

Développement sur mesure
Il est parfois souhaitable dans certain cas de figure, d'y aller d'une solution complètement sur mesure. On prend bien note des besoins de gestion de contenu du client et on implémente un système de gestion de contenu qui réponds exactement à ces besoins. Cette solution est optimale dans le cas de projet spécial qui nécessite une grande liberté au niveau de la logique de site ou d'application ainsi qu'au niveau graphique. L'utilisation plus ou moins intensive de "Flash" dans un site ou une application implique souvent le développement sur mesure d'un système de gestion de contenu car les système existant (pas tous mais la majorité) ont de la difficulté à bien gérer le "Flash".

Avantage

  • Grande liberté au niveau de la conception de l'application et du graphisme.
  • Permet d'intégrer des fonctionnalités plus complexes sans contourner un système limitatif.
  • Meilleure gestion de l'intégration des fonctionnalités des réseaux sociaux (Twitter, Facebook, etc.)
  • Le système peut être mieux prévu pour une future expansion des fonctionnalités.
  • Permet d'optimiser les performances du site ou de l'application de façon spécifique.
  • Gestion optimale de la sécurité de l'application (selon le niveau requis)

Inconvénient

  • Temps et coûts de développement majoritairement plus élevés.
  • Système fermé et donc connu seulement du développeur ou de l'entreprise réalisant le projet (peut devenir problématique si les personnes responsables ne sont plus disponibles pour l'expansion du système).
  • On réinvente la roue pour la majorité des fonctionnalités déjà écrite et utilisé par des milliers d'utilisateurs.

Développement sur mesure avec "framework"
On utilise exactement la même démarche mentionné dans le développement sur mesure mais cette fois-ci au lieu d'effectuer le développement avec ses propres librairies, on utilise des "framework" préférablement "libre de droit" (Code Igniter, CakePHP, Django, Rails) comme base au développement du système de gestion de contenu. Ainsi, selon le "framework" utilisé on ne s'oblige pas a réinventer la roue pour développer les opérations de base d'un site ou d'une application Web.

Avantage

  • Grande liberté au niveau de la conception de l'application et du graphisme.
  • Permet d'intégrer des fonctionnalités plus complexes sans contourner un système limitatif.
  • Meilleure gestion de l'intégration des fonctionnalités des réseaux sociaux (Twitter, Facebook, etc.)
  • Tirer profit d'une base d'usager ayant développé des fonctions similaires avec le même "framework".
  • Permet au client de passer le flambeau du développement à d'autre développeur ou entreprise qui maîtrise ce "framework".
  • Permet d'optimiser les performances du site ou de l'application de façon spécifique avec les outils du "framework".
  • Gestion optimale de la sécurité de l'application (selon le niveau requis)

Inconvénient

  • Temps et coûts de développement majoritairement plus élevés.
  • Système semi-fermé qui contient une bonne partie de développement effectué par le développeur ou l'entreprise qui  a produit le site ou l'application.
  • On réinvente la roue pour une partie des fonctionnalités déjà écrite et utilisé par des milliers d'utilisateurs.

Système de gestion de contenu propriétaire
Développer par des entreprises ou des développeurs (Expression Engine, K3 Soft) qui veulent généraliser les opérations courantes d'un système de gestion de contenu et ensuite revendre leur solution pour tirer profit de leur temps de développement et ainsi offrir des solutions clé en mains. Ces solutions répondent aux besoins typiques généralisés pour la pluspart des applications ou site : gestion des pages, gestion du contenu textuel, gestion des menus, gestions des éléments médias, gestions du style graphique des pages, forum, envoie de courriel de masse, wiki, blog, etc... Les prix vont souvent varier selon l'entreprise et les fonctions requisent.

Avantage

  • Prêt à utiliser directement après l'installation / configuration.
  • Facilite les opérations de gestion de contenu typique.
  • Support de l'entreprise pour l'utilisation et les problèmes avec le produit.
  • Temps de développement et coût réduit, seulement l'intégration du graphisme est à faire.

Inconvénient

  • Selon les systèmes de gestion de contenu, il y a limitation au niveau graphique pour respecter les guides du système.
  • Selon le système, difficile voir impossible d'implémenter des fonctionnalités qui sortent des généralités implémenter par celui-ci. (lorsque c'est possible, devient souvent plus long à implémenter que pour une solution sur mesure).
  • Compte tenu du nombre de personnes qui supporte le développement du système, tendance à être désuet après 1 ou 2 années.
  • Difficile d'optimiser les performances de l'application ou du site si le site ou l'application éprouve des problèmes de performances.
  • Outre l'entreprise ou le développeur vendeur du système, personne ne connait le système en place. (peut devenir problématique si les personnes responsables ne sont plus disponibles pour l'expansion du système).
  • Gestion souvent inexistante des fonctionnalités des réseaux sociaux (Twitter, Facebook, etc.).

Système de gestion de contenu "libre de droits"
Ces systèmes utilisent exactement la même approche qu'au point précédant mais cette fois-ci le développement est effectué par la communauté. Ont applique encore une fois une généralisation des fonctionnalités requisent par un système de gestion de contenu . Les systèmes sont donc développer par des milliers de développeur qui tente au fil du temps de développer le meilleur système possible.

Avantage

  • Prêt à utiliser directement après l'installation / configuration.
  • Facilite les opérations de gestion de contenu typique.
  • Tirer profit d'une base d'usager utilisant déjà ce système, une communauté active autour du produit.
  • Permet au client de passer le flambeau du développement à d'autre développeur ou entreprise qui maîtrise ce système de gestion de contenu.
  • Temps de développement et coût réduit, seulement l'intégration du graphisme est à faire.
  • Tirer profit des extensions du système développé par la communauté pour des fonctionnalités qui sortent du cadre générique du système de gestion de contenu.
  • Système testé par des milliers d'utilisateurs ce qui donne majoritairement un produit robuste et stable.

Inconvénient

  • Selon les systèmes de gestion de contenu, il y a limitation au niveau graphique pour respecter les guides du système.
  • Selon le système, il est légèrement plus long d'implémenter des fonctionnalités qui sortent des généralités implémenté par celui-ci. (lorsque cette fonctionnalité n'est pas disponible dans la communauté).
  • Difficile d'optimiser les performances de l'application ou du site si le site ou l'application éprouve des problèmes de performances.
  • Gestion souvent inexistante des fonctionnalités des réseaux sociaux (Twitter, Facebook, etc.). Il y a cependant amélioration de ce côté.

Chacune des solutions comporte ses avantages et ses inconvénients. Il est donc important d'évaluer la meilleure solution en tenant compte premièrement du budget pour le site ou l'application, et ensuite déterminer exactement les fonctionnalités requises. Ensuite, une personne qualifiée pourra vous diriger dans la bonne voie pour tirer maximum à court et long terme de votre solution. Il n'existe pas de solution parfaite, seulement des solutions adaptées.

Une nouvelle…

Depuis maintenant une semaine, Marie-Ève Benoit s’est joint à notre équipe à titre de Productrice Web.  Ancienne LG2ienne, elle à eu la l’occasion de travailler sur les comptes de Desjardins, Bell, Hydro Québec et bien d’autres.

Nous sommes convaincus qu’elle saura trouver des défis à la hauteur de ses attentes au sein de l’équipe QuatreCentQuatre.

Bienvenue Marie-Ève

QuatreCentQuatre déménage

Eh oui! À la suite d’un an de colocation dans les bureaux d’Akufen, QuatreCentQuatre à décidé de se trouver un nouveau chez soi.  Ce fut une année prospère et les deux entreprises comptent maintenant plusieurs nouveaux visages. Or, les pièces et corridors ayant atteint leur pleine capacité d’occupation, nous en étions presque à attendre l’été afin d’installer des bureaux sur la terrasse.

Vendredi prochain nous déménagerons au 3437 boul. St-Laurent, tout juste au dessus du nouveau restaurant « La commission des liqueurs ».  Un beau 2600 pieds carré afin de s’installer sans peur de manquer d’espace.

Nous aimerions sincèrement remercier Akufen pour l’espace qu’ils nous ont alloué durant cette première année d’activité, ce fut un sacré bon coup de pouce.  Leur énergie (débordante) nous manquera à coup sûr.

En espérant que vous serez présent lors de notre pendaison de crémaillère, ce sera le temps d’inaugurer le foyer et le jacuzzi.

Gérer ses bits

Dans le créneau, quand une équipe de programmation se met à travailler de concert sur un projet, la gestion des fichiers et de leur version peut devenir un vrai casse-tête.  C'est pourquoi des outils tels que les cvs ainsi que les svn sont apparus sur le marché; ceux-ci permettent de gérer / consolider  les fichiers / versions de fichiers d'une équipe et tout celà sur un serveur en ligne (le but étant aussi d'avoir accès aux dits documents peu importe où l'on se trouve).  Nul besoin de dire que, du moins chez nous, on ne s'en passerait plus.

Maintenant et depuis quelques temps on sent monter un nouveau concurrent sous le nom de Git.  Initialement créé par Linus Torvalds pour le système d'exploitation Linux, les utilitaires pour l'utiliser sur la plateforme Windows sont encore limités (c'est ce qui nous avait désintéressé quand Julien nous avais parlé du produit) ou en version pré-beta, mais il est certain que des solutions plus stables sont au coin de la rue.  Pour nous c'est la rapidité du système qui nous intéresse et c'est pourquoi nous avons entrepris les recherches d'un hébergeur supportant celui-ci.  Il faut dire que notre fournisseur actuel éprouvait souvent des problèmes de connection, des ralentissement et que, étrangement, nous étions rendu à un point où ajouter un utilisateur nous coutait le double du prix total actuel... ouan.

Tout ceci est derrière nous depuis que nous avons transféré nos données (tout en procédant à des copies de sauvegarde, juste pour être certain) sur les serveurs de http://repositoryhosting.com/.  En fait ce ne sont pas vraiment leur serveurs mais plutôt les datacenters EC2 de Amazon desquels la rubustesse semble maintenant excellente.  Le service propose un seul plan: 6$/mois pour un nombre illimité de repositories avec gestion de projet Trac, un nombre illimité d'utilisateurs, 2go d'espace et le choix d'utiliser Git ou bien Svn selon le projet.  En plus, il n'en coûte qu'un dollar par giga octet supplémentaire.  Amen!

Faites un voeux!

L'Île au souhaits

L'Île au souhaits

Comme nous n'avions pas le temps de faire notre propre carte de noël, et bien nous avons décidé de réaliser celle de notre client Allard Johnson. Si jamais vous décidez d'y jeter un coup d'oeil et bien sachez que pour tous les voeux qui seront postés dans le ciel étoilé, une somme sera remise à la fondation Rêve d'enfant.

Production : Quatrecentquatre
Création et Design : Allard Johnson