Renoir Boulanger

Encapsulate a LDAP DN string using Arrays in PHP

Renoir Boulanger — Mon, 01 Apr 2013 15:02:15 +0000

During a project I had to read and fork logic coming from an LDAP server. Since the string can be very different for each user and their affiliations, we know that some sub-parts can be used to figure out what is required to adjust from it.

My snippet’s purpose is to get the capability to get a subset of the string, assuming that the first index is more precise than the last, but concatenated would give the full context.

While I was trying to create the functionality in PHP, I realized that there was not small wrapper to work it. I then decided to contribute it as a comment on the PHP.net website.

The basics

As a reminder, an LDAP DN string looks like the following:

CN=username,OU=UNITNAME,OU=Region,OU=Country,DC=subdomain,DC=domain,DC=com

In such a string, we get basically everything a user may inherit from:

Group assignation
Organization domain (either DNS or Microsoft’s idea of a “domain” (aka. “Active Directory”))
etc.

The main idea is to deal with different logic based on changes or assignment. The DN has all we need.

How to use

Assuming we want to work with changes in the OU field. We could do as:

< ?php 
 
// Fictive User object, coming from an ORM entity manager ($em) 
$user = $em-&gt;find($userId); // $user instanceof User
 
// This is coming from the LDAP
$dn= 'CN=username,OU=UNITNAME,OU=Region,OU=Country,DC=subdomain,DC=domain,DC=com';
 
$wrapper = parseLdapDn($dn);
// We are working with "UNITNAME" but there can be other ones
switch($wrapper['OU'][0]){
    case 'UNITNAME':
        // Specific logic or authorization setters
        $user->addRole('ROLE_UNITNAME');
    break;
 
    default:
      // Default behavior, in case we did not grasp
    break;
}
 
// And so on...

In this example I added a role using Symfony2′s method on a Doctrine2 provided object. But you may see other use cases.

Snippet

I also published it as a comment on the PHP.net website.

That is all folks

If you have other questions or suggestions, let me know.

The post Encapsulate a LDAP DN string using Arrays in PHP appeared first on Renoir Boulanger.

Creating and using Javascript events while combining events on two separates behaviors

Renoir Boulanger — Sat, 30 Mar 2013 03:42:58 +0000

I discovered something that chocked me: Did you know that the ‘click’ event is only a string and you can create any event name you may want? Here is an experimentation example.

During web development, it often happens you want to attach events handler on something in your page. A common usage could be you want to flip a plus sign to a minus sign when you click on a button.

Later in a script you may be compelled to do something similar to the following (assuming you are using jQuery):

$(document).ready(function(){
// Rest of the document in document.ready
// DO NOT USE AS-IS, SEE LAST EXAMPLE

    $('.flip-icon.).click(function(event){  
        event.preventDefault(); 
        var clicked = $(this);
        var flipElement = clicked.find('i');
        if (flipElement.hasClass('icon-plus')) {
            flipElement.removeClass('icon-plus').addClass('icon-minus');
        } else {
            flipElement.removeClass('icon-minus').addClass('icon-plus');
        }
    });
});

But what happens if you want to add other events such as, for example, activating an accordion. You may end up with duplicating events and get some collisions.

Did you know that the ‘click’ event is only a string and you can create any event name you may want?

To describe what I am refering to, I have a add an other behavior that will also, in part, require the previous example.

Imagine we have an accordion managed already grabbing the element’s a[data-target] click event handler.

$(document).ready(function(){
// Rest of the document in document.ready
// DO NOT USE AS-IS, SEE LAST EXAMPLE

    $('a[data-target]').click(function(event){
        // do the accordion stuff
    });
});

But, what if for some reason, our page has to reload some sections and our event handler managing the a[data-target] click gets lost

Instead, of creating a click specific event handler (what if we want to change) and be potentially lost with the element to attach event onto.

You can use jQuery’s on method and attach an event to the , a safe element that every document has.

Things to note about the on method:

First parameter is an event name, can be ANYTHING (yes, you read it), space separated
Second element is on what to listen, can be null
a Function object to handle the event

Also, there is nice thing about bubbling.

When an event happens, the event crawls the DOM up to the body (called ‘catch’) then gets back to the triggerer element (called ‘bubbling’) and firing in that order all event handlers.

Knowing all of this now, instead of attaching a single event type handler to a specific element, let’s take advantage of our new knowledge.

'use strict';
$(document).ready(function(){
// Rest of your document

    // Look at the 'flip-my-icon-event', we just made-up that one. See below.
    $('body').on('click flip-my-icon-event', '.flip-icon', function(){
/* Look here     *************************                                       */
        // Let's put it also in a self-executing anonymous, to isolate scope
        (function(triggered){

            // Same as earlier.
            var clicked = $(this);
            var flipElement = clicked.find('i');
            if (flipElement.hasClass('icon-plus')) {
                flipElement.removeClass('icon-plus').addClass('icon-minus');
            } else {
                flipElement.removeClass('icon-minus').addClass('icon-plus');
            }
            // End same as earlier

        })($(this)); // this fires the self-executing.
    });

    $('body').on('click', 'a[data-target]', function(event){
        event.preventDefault();

        // do the accordion stuff
        var collapsible = $($(this).attr('data-target'));
        if (typeof collapsible.attr('data-collapsible') === 'undefined')  {
            collapsible
                .collapse()
                .attr('data-collapsible', 'applied')
                .on('show', function(){
                    jQuery(this).parent().removeClass('is-hidden');
                })
                .on('hide', function(){
                    jQuery(this).parent().addClass('is-hidden');
                });
        // End do the accordion stuff

        jQuery(this).trigger('click').trigger('flip-my-icon-event');
/* Look here                         *******************************        */
        }
    });
});

The following works, because of the following trigger html pattern, as from the begining:

And of the following:

We have an icon for .icon-plus and .icon-minus class names
The a[data-target] attribute has ALSO a .flip-icon class name
The a[data-target] triggers our made-up flip-my-icon-event event to an element that also matches (see the two ‘look here’ comments)

References

WPD Events in Javascript (WebPlatform.org)
jQuery trigger method from the jQuery source
jQuery on method from the jQuery source
jQuery documentation on method * Note direct events handlers such as live, or delegate are considered deprecated (as of jQuery 1.7) see delegate API and live API notes.

The post Creating and using Javascript events while combining events on two separates behaviors appeared first on Renoir Boulanger.

Conférence: Comment évaluer le niveau de qualité d’un site web selon les techniques d’intégration web d’actualité

Renoir Boulanger — Fri, 22 Feb 2013 03:21:10 +0000

Cette semaine, je fait une conférence pour la deuxième fois de ma présentation qui décrit les pratiques en intégration web qui sont d’actualités.

La première fois que j’ai présenté c’était pendant le WebIn 2012, et cette-semaine c’est à Québec pendant la conférence Web à Québec 2013 (WAQ).

Cette fois-ci, j’aurai l’honneur de présenter tout juste avant une personne que j’admire; Jonathan Snook.

Audience

L’audience de cette présentation est principalement les gens qui travaillent avec le web, qui engagent des programmeurs/intégrateurs et qui veulent comprendre les dernières tendances et le pourquoi elles sont populaires.

Comme une valeur ajoutée, j’illustre avec des exemples concrêts et compare les outils vis à vis leur utilité.

Synopsis

La façon de concevoir des sites Web a beaucoup évolué au cours des deux dernières années. Concevez-vous encore vos sites comme en 2009? Trouvez-vous vos sites lents? Êtes-vous web-responsable? Imaginez si vous étiez capable de gagner du temps.

Comment pouvez-vous être certain que votre pigiste, employé ou fournisseur fait un travail de qualité?

Nous allons couvrir des techniques clé qui permettent d’optimiser le travail, comment être plus efficace avec votre équipe technique et savoir jauger le son niveau d’expérience.

L’objectif de la séance est de donner des outils pour évaluer le niveau de qualité d’un site web; des pistes pour en améliorer la performance et s’assurer de pouvoir en entretenir le code après plusieurs révisions.

Trois questions qui seront répondues dans la conférence

Que faire pour optimiser la communication lors de l’établissement du cahier de charge
Quelles techniques ont été découvertes pour éviter le gaspillage lors de la réalisation
Indicateurs de qualité qu’on peut retrouver dans le HTML/CSS

Les «slides»

Télécharger en format PDF

Réception

Je ne m’attendait pas vraiment au succès de ma présentation durant la conférence, c’était une belle surprise.

Mon ami François Légaré a pris cette photo:

Merci à

@gabiviana: Gabi Viana pour les visuels
@joplam: Josée Plamondon pour la révision
@cybik: Renaud Lepage pour la révision
@vivrass: Martin Provencher pour l’inspiration de l’angle technique à couvrir.

The post Conférence: Comment évaluer le niveau de qualité d’un site web selon les techniques d’intégration web d’actualité appeared first on Renoir Boulanger.

Why would I NOT use my own framework and how I sell usage of Symfony2 and other current PHP 5.3+ goodies to my client

Renoir Boulanger — Thu, 22 Nov 2012 05:16:54 +0000

Sometimes, in a mailing list I am following and in real life. People are sometimes explaining their choices in technology to create an e-commerce site using a CMS (“Content Management system”) or their own “homemade” framework. As if there is no good PHP ones out there nowadays.

A CMS is a web application to manage content and when specialized requirements (as in managing other things than pages of content) we have to extend outside of the CMS part. A framework is thus a good friend.

In either case. My opinion is to use the right tool for the right task.

I wrote on the subject because I recently had to defend my technological choice of Symfony2 at my (very-large) client. You can see on these two posts.

I tend to believe that everybody who can program can work with a well architectured CMS/framework whatever software architecture patterns it is following. The priority is that we, programmer, fills the client’s requirements and use what is existing to make us efficient.

Creating a “just for this project”-”super custom”-framework and saying it is using [a buzzword-compliant] architecture principle, doesn’t PROVE IT well made.

Don’t get me wrong. It is not that creating a framework is bad. It is quite an educative hobby. Creating a framework requires a lot of work, dedication and ideally a quantity of skilled people to work to improve, review, test and document. A full time job by itself alone.

My feeling is that the client probably did not asked to create a “framework”.

My problem is more precisely about using it as production-code for their business application, make them pay for it AND what they explicitly asked for. Should they only pay for the features they asked for?

But if you used a well known, documented, framework with an active community. You can use it as a good selling argument in front of the client. It even reassures them that other people can take on your work.

So a question lingers in my mind. If one has the skillset to create his own framework. Why doesn’t he contribute to an existing one?

Personally, all my choices follows the NIH approach. NIH as in “not invented here” see Derek Strobe’s blog post about NIH, a much inspiring read.

The overall idea is that Instead of charging for my time implementing dependency injection, i’ll use an existing one.

Maturity

Talking about maturity. Symfony2 is 2 years old already (compared to Zf2 few month of age).

If it is not only about maturity. Think that the PSR (levels 0, 1, 2) recommendation is written by a group community leaders who decided to standardize the way to structure libraries so they are inter-operable, PHP FIG was created for this.

I think everything changed since the PHP-FIG group created the PSR* standard and the use of composer to manage dependencies. CMS and other framework projects have to follow the lead, otherwise they may get left behind.

CMSes

I have the feeling that someday CMS will be only a GUI, with full edition capability (see Mercury Editor, or Createjs) using HTML5′s ContentEditable property. And persisting inside a Storage engine known as “Content Repository”.

This trend is also what some calls “Decoupled Content Management” (also explained here), a VERY promising concept that will give some more chances for us to actually re-use code.

The prospect may even make us be able to really create easily semantic-friendly pages. Created by editors. Regarding semantic web, you should look at “VIE” over here.

The trend is more than mere theory. Many project spawned already. Most notably the Symfony-CMF, Midgard and even known CMS-es such as Drupal and Joomla are currently re-evaluating their projects and following the trend.

Dependencies

A common problem is how can I make sure the project uses proper libraries and a compatible version number.

Many stacks has their own implementations of it. It comes as a simple file stating which version you want, and it takes care of getting the proper version from any configured package we may think of.

The concept is now new and many web development stack has their own implementations. Have a look at package.json (for Javascript), Bundler (for Ruby).

PHP has it’s own now, it’s called Composer, here is how you would declare your dependencies:

{
   "require": {
       "myown/vendor": "master",
       "external/lib": "3.1.*",
       "external2/template": "master"
   }
 }

See: Introduction to composer using Packagist

Add to that any cache management, deployment configuration and other build libraries, compilation and protection you may wish to use.

All in all

Nowadays. If you are still:

Manually using require_once(…)
Adding database queries in your view (WordPress? x_X)
Using loops and query hidden in a … templating engine (ExpressionEngine “loops” x_X)

You may need to see the reference I made in this post.

My argument goes as following, mostly for what my (our) clients pays us for:

Learn and make good use of framework that has a reputation, good architecture, modular, inter-operable with other, in PHP is not a chimera anymore.
NIH please
Build functionality for the client who pays you. not maintain the serializer service mechanism… framework do that stuff. client do not care about it
SOLID principles?
Scaling? (only one database? what if I need to go deploy on a PaaS solution?)

The post Why would I NOT use my own framework and how I sell usage of Symfony2 and other current PHP 5.3+ goodies to my client appeared first on Renoir Boulanger.

A list of quality indicators we could find on an application or web site

Renoir Boulanger — Mon, 12 Nov 2012 03:37:49 +0000

When we write a project specification document, we write functionnal and non-functionnal and other sections. As I want to communicate to my peers and sponsors the level of quality, I thought of creating this list of indicators.

Web application quality attributes

Frontend should adjust to the user browser (tablet, computer, phone) “Responsive” (already partially in place)
Frontend URIs should express what they represent for future/possible conversion to REST service endpoint
Frontend response time should be as quick as possible using optimization techniques such as assets minification and non-blocking javascript
Code “Domain” (language) should illustrate user intent
Frontend to use W3C valid markup following HTML5 recommendations in a “Progressive enhancement” manner;
Logging system should declare application state and intents and provide helpful feedback (e.g. “User jshmoe logged in from… Montreal Quebec.”)
Front-end error message should be using terms that speaks to the end user
Error message and notices should not break layout
All message and user read text should be without spelling mistakes or bad translation

Frontend as quick to load as possible

Among most recommendations and references about common user frustrations is the time a web page loads.

The idea is to basically push to the queue and forget returning a page back as soon as possible.

Other key aspects are graceful degradation of javascript, functional site even with javascript errors.

Most importantly. The portal frontend can be deployed in any number of instances, with only one address, and be completely transparent to the user.

Your opinion

What else should we also include in such a list? I agree that it is not complete as much as a W3C recommendation is. But I believe it is much good in a context of a project outline to explain details you are taking into account while evaluating.

Reference

High available websites with AWS
http://www.slideshare.net/AmazonWebServices/highly-available-websites-in-aws
Progressive enhancement
http://youtu.be/hdTxeR90_1E
Front End Engineering Manifesto
Set of rules on which web application frontend are considered best-practices
http://f2em.com/
Frontend optimization build toolkit
http://yeoman.io/

The post A list of quality indicators we could find on an application or web site appeared first on Renoir Boulanger.

My first introduction to the Hypermedia

Renoir Boulanger — Sun, 28 Oct 2012 00:47:40 +0000

I was reading around about how to architect in a scalable fashion a web service. You know, the concept of remote procedure call?

At work, I had a conversation about implementing SOAP with an other service, It struck me that they did not talk about REST. Mostly in today’s distributed system, you may want to think twice about if there is something newer that solves better than a solution designed 20 years ago… there must be things learned

So, I wrote this small introduction to what is REST, and the Hypermedia.

Beware, I am not an expert, just a curious that found a nice video and some links about it and trying to learn and apply it properly.

Actually, I heard it for the first time from Darrell Miller in an impressive presentation that blew my mind. Unfortunatly I did not pursue up until a few months ago.

Now, I am at a state where I am starting a project and we have to talk to many nodes, I would like to take this opportunity of starting from scratch and use it’s concepts. I am anxious on how it is going to look like.

As for the difference this post started for; I discussed with my colleagues, I compiled these two descriptions with code example in PHP to illustrate.

SOAP

SOAP is an object’s method call to a remote server as if it was a local object, but abstracting idea.

$o = new SoapClient('https://some.host/wsdl');
$clients = $o-&gt;getClients();

What you get at the is an understandable array, or text, or object coming from the web service.

Regardless of the other application SOAP server is in the same language as the client (PHP in this case).

This may seem nice, it has a few limitations on the regard of what you can do out of it.

REST

In contrast to SOAP, a REST call, you actually use HTTP to request things and use it’s content and headers to work your logic.

Situation is that most implementations only do a GET to a URL and that is all. A situation where most implementations do not fulfill all the power of it, again. This is the reason why the RESTafarians (passionate about REST) decided to change the name of it’s usages.

A nice way to explain the lacks of use of it’s potential through the popular implemenatation goes from Designing Hypermedia APIs presentation by Steve Klabni.

Hypermedia

In comparison to REST, Hypermedia it is basically going like the following.

Popupar REST implementation would only care of sending a request and work with the received data, Hypermedia on the other hand, is like using what we receive and “browse” the content, follow links, submit forms to end up with the objective.

So, as an example:

use Guzzle\Http\Client;
 
$client = new Client('https://some.host/api/v1');
$request = $client-&gt;get('user/42348972389/profile/picture');
$request-&gt;setAuth('myusername', 'mypassword');
$image = $request-&gt;send();

With this example, you could get the RAW image file stream directly.

Libraries

Using Symfony2 in my projects all of this made me think about how to implement it, I stumbled on Guzzle and BUZZ, two PHP 5.3 libraries, which I could use. What I appreciate with Guzzle is the pattern around it’s usage.

As a side note, if you want to see an applied example of a REST call using Guzzle, you can see this post I created explaining my attempts. I did not work with that since then, I hope to get back to it soon.

Réflexion a voix-haute: La réalité frustrante des développeurs dans l’industrie du web

Renoir Boulanger — Thu, 20 Sep 2012 18:05:48 +0000

Je suis conscient que cette situation n’arrive pas qu’au développeurs web. Je raconte ici ce que j’ai vécu pour illustrer comment je trouve que c’est un non-sens. Je doute qu’il y ait réellement de solution autre que de s’armer d’argumentaires et la pratique.

Parmi les efforts que je trouve admirable est celui fait par l’Alliance Numérique avec son guide des bonnes pratiques.

Résumé d’une histoire de réalisation web

Une personne du monde marketing a une idée. Elle veut que ce soit super beau. Toutes les vues sont faites sur 40 pages faites par Photoshop et doivent être respectés au pixel parfait sur IE6 à Firefox 3. Il y a 70 pages de descriptions de comment javascript doit faire sortir des étoiles partout. Ensuite, pendant la réalisation, la compagnie a pas de budget, généralement elle fait couper les coins ronds aux endroits cruciaux et le site sera bon seulement pour changer ton adresse et inutilisable.

The post Réflexion a voix-haute: La réalité frustrante des développeurs dans l’industrie du web appeared first on Renoir Boulanger.

Comment je valide et convertit des documents HTML trop chargés ou provenant de Microsoft Word en HTML valide et simplifié

Renoir Boulanger — Thu, 30 Aug 2012 16:01:18 +0000

Description

Cette procédure est faite optimiser la conversion document word en html, spécialement ceux qui sont généré avec beaucoup de «tagsoup» en en simplifier a sa plus simple expression html. Valide.

Sauter à la Procédure

Exemple

Avant

...

TERMS AND CONDITIONS OF 1 ‐ YEAR OR 30 ‐ DAY ACCESS AND USE

OF THE SERVICE BY SUBSCRIBERS SECTION 1 PURPOSE OF THE SERVICE …

Après

TERMS AND CONDITIONS OF 1 ‐ YEAR OR 30 ‐ DAY ACCESS AND USE

OF THE SERVICE BY SUBSCRIBERS SECTION 1 PURPOSE OF THE SERVICE

Inspiration et pistes

Convertir de format document en ligne de commandeDe Word2000 vers HTML, voir UNOCONV http://dag.wieers.com/home-made/unoconv/#download

Utiliser open office en mode “headless” (en le transformant en service) et y envoyer les documents pour conversionVoir: http://stackoverflow.com/questions/3405687/openoffice-org-using-uno-to-convert-docx-to-html

Procédure

Version abstraite

Utiliser Open Office (ou peu importe) pour exporter le document en HTML

Purifier via HTMLTidy

Nettoyer les attributs inutiles avec la classe htmLawed

Use cases

Document texte seulement

Pas de formulaire, ni images, etc
Idéal pour un document légal, par exemple.

Étapes concrètes:

A partir du fichier HTML généré exemple: Fichier appelé “1.1.2.en.html”

Extraire le fichier htmLawed.zip

cd ~
mkdir htmlawed
mv htmLawed.zip htmlawed/
cd htmlawed
unzip htmLawed.zip

Passer au travers de la classe htmLawed

< ?php
    require('htmLawed.php');
    $config = array('safe'=>1,'elements'=>'a,em,strong,p,ul,li,ol,h1,h2,h3,h4,h5,div,tr,td,table','deny_attribute'=>'* -title -href');
    $out = htmLawed(file_get_contents('in.html'), $config);
    echo $out;

Rouler le script. Déplacer le fichier a utiliser, puis exécuter le script pour en générer dans out.html

cp ~/1.1.2.en.tidy.html in.html
php cleanup.php > out.html

Rouler Tidy. Normaliser le fichier “1.1.2.en.html”, Nettoyer les balises, minuscules, etc

tidy --drop-font-tags 1 --logical-emphasis 1 --clean 1 --merge-spans 1 --show-body-only 1 --output-xhtml 1 --word-2000 1 --indent "auto" --char-encoding "utf8" --indent-spaces "2" --wrap "90" 1.1.2.en.html > 1.1.2.en.tidy.html

tada!

Précautions

Ordre d’exécution des tâches

Remarque:

J’ai essayé de passer Tidy avant htmLawed et j’ai réalisé que le nettoyage de htmLawed est assez drastique et que Tidy rend le code plus propre. Sans oublier que htmLawed peut générer des balises vides que Tidy va éliminer.

Références

Options Tidy
htmLawed Documentation a PHP Html purification Class
1. original documentation
2. Example settings

The post Comment je valide et convertit des documents HTML trop chargés ou provenant de Microsoft Word en HTML valide et simplifié appeared first on Renoir Boulanger.

Ma critique sur l’intégration du site a25.com

Renoir Boulanger — Tue, 28 Aug 2012 22:38:26 +0000

Dans la série “Revue de code en Intégration web” qui se veut une série de remarques pour améliorer le résultat final du site je commence avec ce premier site.

Le site a25.com est un service web qui sert a amasser les paiements dus pour l’usage du pont de l’Autoroute 25. Une caméra capture les plaques d’immatriculation et envoit une enveloppe réclamant son dû.

Quoi que très fonctionnel comme service, j’ai pas pu m’empêcher de regarder le code HTML envoyé aux visiteurs et remarquer ces détails.

Ce qui m’a frappé et incité a faire ces remarques est la mention “Optimisé pour Internet Explorer“. J’ai tout de suite eu un flashback des années 2000.

Mes observations

Remarque Je suis conscient que la réalisation du site a pu être fait a la sauvette et qu’il y a peut être eu à faire plusieurs coins ronds, c’est malheureusement monaie courrante dans l’industrie du web. Le choix technologique imposé par la politique plutôt que l’expérience de celui réalisant le site peut aussi affecter la qualité. Pour contre-carrer les argumentaires vides, pourquoi ne pas s’armer en explications. Le but est constructif après tout :)

Annonce pour support spécifique Internet Explorer

Nous sommes en 2012. Le HTML5 est supporté et possible depuis 2009… même sous IE6.

Les conventions de navigation et la fonte du contenu par défaut est beaucoup trop petite, plus petite que la moyenne des sites

Hé a25.com 2002 called, they want their “Optimized for Internet Explorer” quote back. #W3C #standards

— Renoir Boulanger (@renoirb) August 28, 2012

Données tableau en image

Votre page tarifs donne des données tabulaire en image

Quoi que très jolie image, des données alignées par des colones, un tableau est là pour ordonner des données par colones et rangées. La synthèse peut très mal se faire sur une image.

Je pourrai sortir l’argument de l’Accessibilité et vous allez me dire, un mal-voyant ne peut pas conduire. Peu importe. Une image c’est pour décorer.

Changement de pages en AJAX et URLs

Les pages changent sous en AJAX (exemple #joindre dans l’adresse) plutot qu’un URL unique par contenu avec adressage de langue au URL.

Si vous voulez réellement faire un changement à la AJAX, vous pouvez simplement capturer le clic sur certains liens (par usage d’une classe qui décrit le fonctionnement) puis un court bloc jQuery pourrait s’occuper de capturer le clic et changer le DOM via un $.ajax

Le pire n’est pas que si votre visiteur n’utilise pas javascript pour des prétextes de sécurité. Mais aussi le SEO, vous perdez du contenu et ce sont pourtant des pages légitimes avec contenus qui vaudraient la peine d’être indexés et augumenteraient la qualité du point de vue SEO.

J’insiste sur ce fait car c’est du contenu référence. Un cas acceptable serait si ce serait du contenu en relation au temps (comme twitter par exemple) ou une vue spécifique a un utilisateur dans une application web.

Le SEO. Je l’ai dit

D’accord, le SEO sert a optimiser la trouvabilité d’un document parmi plusieurs. Chaque partie d’un URI a son utilité. Jonas Jacek le décrit bien dans son billet à ce sujet.

Je ne suis pas un expert du SEO, mais regardons plus loin que cet argument. peut etre la valeut du mot dans le URL ou simplement un mauvais usage detourné.

Un URI dans ses composantes represente chaque element a son role. e.g. http://host/corps/du/uri?query=value#anchor alors le document pour me contacter serait dans le corps du url.

Le #hash dans le URL est normalement la pour representer un anchor (partie) dans UN document (parmi plusieurs) pas une page complete. Le Javascript supporte le history avec le #hash. Mais encore. Il degrade sans JS. Cool. Un hash est pour un anchor.

Pourquoi donc ne pas faire

Hola!

?. Parce que le sert a faire un lien. Meme chose pour un anchor.

Fichiers attachés utilisé pour toutes les “sauces”

Vos fichiers attachés sont des fichiers PDF plutot que d’être vers d’autres pages, encore perte de contenu cohérent et un signe d’echec d’usage d’un site web (un PDF est bon sur le web pour des formulaires ou on nécécessite impression et signature)

Les fichiers attachés ont des noms sous forme de phrases avec caractères spéciaux, nous ne sommes plus a l’époque du 8.3 (exemple de nom à l’époque: MONFIC~1.BMP) mais quand même.

Un fichier avec un nom résumé de deux trois mots ne nuit pas. Investissez plutôt du temps sur les méta données avant conversion au PDF et éviter d’avoir une tonne de fichiers au titre “Document Microsoft Word”.

CSS sur-spécifique avec utilisation de #ID inutile

Les fichiers CSS et Javascript ne sont pas minifiés et/ou combinés, vous pourriez sauver du temps de chargement

Mais à mon opinion, la structure CSS démontre un certain manque de maîtrise de la structure en intégration de votre développeur web. Je ne suis pas parfait moi même, j’ai fait mon lot d’erreur, mais j’aimerai vous mettre au courrant qu’il y a beaucoup d’ouvrages et documentation sur les pratiques d’aujourd’hui que votre site pourrait profiter. La facilité de rendre votre site fonctionnel pour le mobile n’est qu’un parmi tant d’autres avantages.

Avez-vous déjà entendu parler de OOCSS ou SMACSS?

Fin

Voilà, c’est mon premier billet dans la série de “Revue de code en Intégration web”. J’espère que vous trouverez inspirant

The post Ma critique sur l’intégration du site a25.com appeared first on Renoir Boulanger.

What is Cloud computing when it is related to web application

Renoir Boulanger — Wed, 15 Aug 2012 15:25:38 +0000

During the discussion, the contributor persisted on knowing what would be considered and thresholds to use some kind of push-button-scaling.

Knowing his context, a unzipped install CMS with a buch of plugins I felt the urge to explain that there is not always need to get a bigger server capacity. Here is an overview of what I mean when I talk about cloud computing and continuous integration.

The E-Mail

Let’s talk about cloud!

I mean in the web application hosting realm. Not the storage (Google Drive, Dropbox) or software as a service (Salesforce, Basecamp).

Let’s talk about a use case before and my own experience.

My former company Evocatio Solutions technologiques manage a pretty large site at the domain uda.ca.

The use-case on my recent experience

This is a complete business management web application that manages an union who represents french speaking artists in north america (mostly residents of Canada). We built a complete web application that manages many aspects an artist needs to represent themselves and be found. A big part of it is a 140 tables worth of artist description listing details as small a hair length and types of musical instruments to voice tones. It also manages renewal, communication with agencies, portfolios, and management of contracts with managers and more.

Not to forget the very heavy databases queries we generate to search, for example: An asian woman with white hair playing yuku lélé who can pilot helicopter AND ride motorcycle …

Yes. Database queries get very big, very quickly. Not only in the search engine I described, but through all the features.

That, to my opinion, is heavy. Also considering that that Artist’s Union has several thousand members.

This information is on top of my head, please do not take this into real numbers, I did not look the latest deployment needs. But for the server side, it only uses a simple Virtual machine with 4Gb of RAM give or take.

That is my point about expanding hosting without optimizing stuff around.

What your web application has to consider then

Amazon and other Cloud service is about mostly about automated server deployment.

But the powerful offering of “scale tour application” with computing cubes that automatically scales requires more than just nodes.

It requires the code (here again) to support:

multiple databases hosts and types support (Cassandra, Solr, MySQL) specialized for the type of data to store
User upload files replication
Database/Keystore (CouchDB, Mongo)

All spanable on multiple hosts by a mere change of one configuration file.

The code itself should:

Be deployable by a simple phing/ant/nant task
Hosted on a NAS mount that you could create an other machine and use when time of computing need happens

All this (for some parts) is what is called Continuous integration (Wikipedia) some deployment strategies (also here and this blog post too), and most of the time. It’s not just the continuity and automation that matters, but the underlying deployment mechanism can be provided by third parties, like Heroku and many others.

The post What is Cloud computing when it is related to web application appeared first on Renoir Boulanger.

Renoir Boulanger

Encapsulate a LDAP DN string using Arrays in PHP

The basics

How to use

Snippet

That is all folks

Creating and using Javascript events while combining events on two separates behaviors

Conférence: Comment évaluer le niveau de qualité d’un site web selon les techniques d’intégration web d’actualité

Audience

Synopsis

Trois questions qui seront répondues dans la conférence

Les «slides»

Réception

Merci à

Why would I NOT use my own framework and how I sell usage of Symfony2 and other current PHP 5.3+ goodies to my client

Maturity

CMSes

Dependencies

All in all

A list of quality indicators we could find on an application or web site

Web application quality attributes

Frontend as quick to load as possible

Your opinion

Reference

My first introduction to the Hypermedia

SOAP

REST

Hypermedia

Libraries

More to read

Réflexion a voix-haute: La réalité frustrante des développeurs dans l’industrie du web

Résumé d’une histoire de réalisation web

Comment je valide et convertit des documents HTML trop chargés ou provenant de Microsoft Word en HTML valide et simplifié

Description

Exemple

Avant

TERMS AND CONDITIONS OF 1 ‐ YEAR OR 30 ‐ DAY ACCESS AND USE

Après

TERMS AND CONDITIONS OF 1 ‐ YEAR OR 30 ‐ DAY ACCESS AND USE

Inspiration et pistes

Procédure

Version abstraite

Use cases

Document texte seulement

Étapes concrètes:

Précautions

Références

Ma critique sur l’intégration du site a25.com

Mes observations

Annonce pour support spécifique Internet Explorer

Données tableau en image

Changement de pages en AJAX et URLs

Le SEO. Je l’ai dit

Fichiers attachés utilisé pour toutes les “sauces”

CSS sur-spécifique avec utilisation de #ID inutile

Fin

What is Cloud computing when it is related to web application

The E-Mail

Let’s talk about a use case before and my own experience.

The use-case on my recent experience

What your web application has to consider then