Niouzes

< Avril 2021 >
Lu Ma Me Je Ve Sa Di
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

Citation

Attention

Certains des exemples que nous fournissons ci-dessous ne sont pas complets. D'emblée, nous nous en excusons, bien sûr. Mais pourquoi diable sont-ils incomplets ?

Ils sont incomplets parce que nous y travaillons en ce moment et que plutôt que de vous faire patienter jusqu'à ce qu'ils soient tous terminés, nous avons préféré vous les livrer dans l'état où ils se trouvent pour que vous puissiez vous faire une idée de ce qu'ils illustrent.

Au fur et à mesure de notre avancement, nous ferons les mises à jour idoines. Nous espérons résorber notre retard au plus vite.

2014-08-06 à 17:05:56 par Patrick Boens
  1. Le filtre occurrences sur les îles, les archipels, les pages 2012-10-30
  2. Sites à haute performance 2012-10-09
  3. Nouvelles substitutions dans l'établissement des storage des îles
  4. Vae Soli! et les messages de service 2009-03-31

Table Of Contents

  1. Template with patterns, Swipe Simply, cahing pages for bots, … (06/08/2014)
  2. Gestion de redirections, Accept-Language, extrapolation de la langue et du pays, LSContainer et le génome, LSInput et les gènes, utilisation de LSCacheDir, création de propriétés dynamiques de LSPage dans le géorama, … (11/10/2013)
  3. Statistiques d'accès, Site Manager, prefetch, prerender, File Explorer, interactions Ajax … (17/06/2013)
  4. LSTag, LSContentsDatetime, LSContentsCountdown, LSContentsStopwatch, threshold et score, configuration vhosts Apache, génération automatique, LSVStrings.js, LSVDates.js, tracing sur XML des îles, Free User Input Zones, multiple credentials, cookie de dernière visite, LSInput et datalist (10/04/2013)
  5. Tour d'horizon des filtres (23/09/2013)
  6. Messages de service (07/01/2014)
  7. Accès aux propriétés des îles, halt.sem, cookies positionnés dans les îles, filtre 'browsertype', contenus alternatifs, expressions PHP sur les href, gestion de l'expiration, filtre de visite, ... (22/09/2013)
  8. Messages de service, ... (30/10/2012)
  9. Config Apache, LSInput, LSForm, ... (13/03/2013)
  10. LSContentsBooking, Browser Danger Rating, User Agent vides (non spécifiés), filtres sur les paramètres, LSBrowser, ... (11/06/2013)
  11. LSTag('img'), auto pages, nouveaux filtres, audio/video, ... (02/11/2013)
  12. LSGeo, LSFootnotes, LSSourceFile, LSPublication, onfail avec codes de retour HTTP (301, 302, ...), ... (27/06/2013)
  13. LSCache, microformat (lupdate), multicontent, LSContentsTagCloud, LSContentsImageGallery, HTML5 (input zones), ... (15/09/2013)
  14. Check Spamhaus, vos settings dans le géorama, LSContentsMicronews, Switch dans le géorama, LSCursor: des records dans les records, ... (04/12/2012)
  15. Campagnes de pub, TODO list (04/12/2012)
  16. Debugging de page, LSTimeline, le fichier de géorama, LSTag, Glossaire IT, Named colors, Codes langue, ... (23/03/2013)
  17. LSCursor: une revue complète de la classe (12/03/2013)
  18. LSForm, LSInput, … (28/01/2013)
  19. LSContentsBusinessCoordinates, redirection de pages, LSTwitterPost, LSContentsTwitterFollowers, LSContentsShare, calendrier, LSContentsContactForm, LSContentsReview et LSReview, droits sur une page, URLs canoniques, LSPaymentOptions et LSContentsPaymentOptions, Offres d'emploi, LSContentsImageTransition, ... (20/09/2013)
  20. Galerie avec vignettes, RSS, partage d'offres d'emploi, partage de citations, diaporama dewslider, horloge flash, footnotes, ... (01/10/2012)
  21. îles préfixées de texte standard, le paramètre title, le paramètre heading, le paramètre text, le paramètre xsl, LSRegionSubtag, Language Switchers, LSFormEnroll, LSContentsLegal, sitemap, substitution de propriétés, LSSourceFile et LSContentsSourceFile, LSContentsComments, LSContentsCharter, ... (05/11/2013)
  22. LSContentsLoginLogoff, Utilisation de && dans les conditions des îles, LSWidgetOpeningHours et LSContentsBusinessOpeningHours, inclusion de snippets, image bouton de login/logoff, LSContentsBusinessCoordinates, commentaires dans les îles, doctypes, LSImageTrans, calcul de dates, LSWidgetEmailForm, LSContentsMedia, LSContentsIFrame, onload et onunload d'une page, Page settings, ... (22/09/2013)
  23. Dates et heures de publication et/ou d'expiration, PHP expressions, Blocs XHTML avant et après une île, suite de pages, îles valables par domaine, substitutions, envoyer des fichiers au serveur, templates dynamiques, contenus distants, contenus générés en Java, LSCalculator, Gérer des signets (bookmarks), Pages conditionnelles, îles conditionnelles, désactivations, LSContentsMedia, taille du géorama, partager une page entre sites, LSXHtmlImg, île dans la section …, textes latins, Dublin Core, Utilisation de caches, corrections automatiques, In-Place Editing, LSContentsCitation (03/11/2013)

Le filtre occurrences sur les îles, les archipels, les pages 2012-10-30

Depuis l'opus "5.0.0007"

Encore un nouveau type de filtre : le filtre occurrences. C'est toujours l'opus 5.0.0007 de Vae Soli! qui offre cette fonctionnalité !

Ce filtre permet de n'afficher un contenu qu'un certain nombre de fois au visiteur courant. Pour sa prise en compte, le contenu doit être identifié par un guid (sinon, cela ne fonctionne tout simplement pas).

Les visites de l'utilisateur sont enregistrées dans sa session. Pour chaque contenu visé par le filtre occurrences, un compteur de visualisation est incrémenté. Le filtre occurrences est donc comparé au compteur. Par exemple : 

<Island id="warning" guid="samples-warning" html5="yes" occurrences="15"><![CDATA[
    <div style="border:3px solid silver;margin:15px auto;padding:10px;font-size:1.5em;font-weight:bold;">
    <h2 style="color:#600;">Attention</h2>
    <p style="color:#900;">

        Certains des exemples que nous fournissons ci-dessous ne 
        sont pas complets. D'emblée, nous nous en excusons.

    </p>
    </div>]]>
</Island>

Sites à haute performance 2012-10-09

Nous avons déjà décrit comment un peu de configuration Apache pouvait aider à dynamiser votre site web (voir article paru sur le site de Lato Sensu Management). En l'occurrence il s'agit de jouer sur la la compression des ressources renvoyées depuis le serveur web (mode GZIP ou DEFLATE) et de jouer sur les headers d'expiration (Expires, cache-Control, Pragma et Etag).

Il existe aussi d'autres actions possibles qui sont liées à la configuration de votre site web mais aussi à votre contenu. Pour mettre cette stratégie en place, vous pouvez compter sur les substitutions de Vae Soli!. Voici comment…

A bit of theory…

À chaque ressource statique (un fichier .css, un fichier .js, une image, …) votre navigateur compose la requête en incluant tous les cookies positionnés sur le domaine courant. C'est normal, c'est ainsi que fonctionnent les navigateurs. Cependant, votre serveur web ne fait rien des cookies en question, du moins la plupart du temps [1] . Voici un exemple de ce genre de requête, grâce à un extrait de DragonFly - Opera : 

GET /images/uikey/close.png HTTP/1.1
User-Agent: Opera/9.80 (Windows NT 6.1; WOW64; U; fr) Presto/2.10.289 Version/12.02
Host: www.ls.poc
Accept: text/html, application/xml;q=0.9, application/xhtml+xml, image/png, image/webp, image/jpeg, image/gif, image/x-xbitmap, */*;q=0.1
Accept-Language: fr-BE,fr;q=0.9,en;q=0.8
Accept-Encoding: gzip, deflate
Referer: http://www.ls.poc/articles/core/web-site-speed-apache/web-site-speed-apache.php
If-Modified-Since: Thu, 27 May 2010 10:09:15 GMT
If-None-Match: "1000000065463-d2-4879095374d74"
Cookie: q-invoices-sort=ino; PHPSESSID=u4ogcqrbggk9g32iv8dieds910; template=.php%3D+return+WhichTemplate%28%29%3B;
theme=core; cargo=ls; lang=fr; __utma=233550339.707241759.1338303878.1347630753.1347634548.36; 
__utmz=233550339.1338303878.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none);
template=.php%3D+return+WhichTemplate%28%29%3B; theme=core; cargo=ls; lang=fr
Connection: Keep-Alive

Dans la composition de cette requête vous voyez clairement que la ressource demandée concerne une image (/images/uikey/close.png). Vous voyez aussi que se touvent renseignés une série de cookies : q-invoices-sort=ino; PHPSESSID=u4ogcqrbggk9g32iv8dieds910; …. Au passage veuillez noter que les appels sont ici faits sur un PC de développement et que c'est notre habitude de positionner des domaines *.poc (proof of concept). C'est la raison pour laquelle vous voyez ce type de host: www.ls.poc.

Voilà précisément ce que nous allons chercher à optimiser. Comme ces cookies ne servent à rien (ils ne sont quand même pas pris en compte par le serveur), autant ne pas les inclure dans la requête. Pour cela, il suffit de mettre ces ressources sur un domaine séparé, par exemple un sous-domaine de votre site web [2] . Dans notre exemple, nous arriverions ainsi à éviter l'envoi de 362 bytes de données ce qui garantit 3 bénéfices complémentaires :

  1. La requête prend moins de temps à être composée par le navigateur
  2. La requête prend moins de temps à être envoyée par le navigateur
  3. La requête prend moins de temps à être lue par le serveur web

Soit. Mais comment faire ?

Tout d'abord, nous avons créé un sous-domaine pour notre site. Nous l'avons appelé res. Nous avons donc maintenant un domaine qui s'appelle res.ls.poc [3]

Maintenant, il faudra utiliser le sous-domaine dans l'appel de la ressource. Par exemple, imaginons une image comme <img src="/images/close.png" />. On voit clairement que la source de l'image est /images/close.png. Il va donc falloir mentionner le sous-domaine comme dans <img src="http://res.ls.poc/images/close.png" />.

Comme ce sous-domaine est exclusivement utilisé pour des ressources statiques, il ne s'accompagne d'aucun cookie. Et le tour est joué ! Voilà, pour info, la requête qui est maintenant effectuée par le navigateur : 

GET /images/uikey/close.png HTTP/1.1
User-Agent: Opera/9.80 (Windows NT 6.1; WOW64; U; fr) Presto/2.10.289 Version/12.02
Host: res.ls.poc
Accept: text/html, application/xml;q=0.9, application/xhtml+xml, image/png, image/webp, image/jpeg, image/gif, image/x-xbitmap, */*;q=0.1
Accept-Language: fr-BE,fr;q=0.9,en;q=0.8
Accept-Encoding: gzip, deflate
Referer: http://www.ls.poc/articles/core/web-site-speed-apache/web-site-speed-apache.php
If-Modified-Since: Thu, 27 May 2010 10:09:15 GMT
If-None-Match: "1000000065463-d2-4879095374d74"
Connection: Keep-Alive

… et les cookies ont disparu. 362 bytes de sauvés … pour cette SEULE ressource ! Mais le principe reste valable pour TOUTES les ressources et il n'est pas rare d'être confronté à environ 50 requêtes entre le navigateur et le serveur web (rien que pour des ressources statiques). En comptant un gain de 350 bytes par requête et 50 requêtes … ce n'est pas moins de 17500 bytes que vous économisez pour une seule page ! Ce n'est pas négligeable.

Et maintenant, où Vae Soli! peut-il aider en cette matière ? Nous le disions tout de go en préambule : via les substitutions ! Voici comment faire… 

<img  src="{my-images}/close.png" />

… et établissez une substitution qui transforme '{my- images}' en 'http://res.ls.poc/images'. Le tour est joué. Après vous pourrez même facilement passer à l'implémentation d'un CDN — Content Delivery Network — en ne changeant QUE la SEULE substitution définie. Un tour de force.

Nouvelles substitutions dans l'établissement des storage des îles

Depuis l'opus "5.0.0007"

Le paramètre storage des îles indique la ressource physique qui est accédée pour composer le contenu. En voici un exemple : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise_fr.php]]></param>
</Island>

Dans l'exemple ci-dessus, on voit que la ressource physique (ici un fichier) qui compose le contenu de cette île est /islands/web-expertise_fr.php. Nous avons mis en évidence la partie fr du nom du fichier, indiquant ainsi la langue du contenu.

Dans le cas où il est nécessaire de gérer plusieurs langues, il pourrait être intéressant de faire en sorte que la langue mentionnée soit simplement la langue courante. Voilà comment faire : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise_{page->lang}.php]]></param>
</Island>

C'est donc un exemple de substitution. Il en existe bien d'autres et justement nous en avons introduites de nouvelles. Voici comment disposer de contenus différents en fonction du caractère de mobilité (voir classe LSBrowser) (mobile, tablet, phone, desktop, …) : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise-{app->mobility}-{page->lang}.php]]></param>
</Island>

En fonction du nom du device (attention, parfois ce nom est vide) : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise-{app->device}-{page->lang}.php]]></param>
</Island>

En fonction du nom générique du browser (e.g. "opera")  : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise-{app->browser}-{page->lang}.php]]></param>
</Island>

En fonction du type de browser (e.g. "browser", "robot", ...)  : 

<Island id="body" active="yes" class="LSContents" lupdate="auto" cdate="yes">
    <role-mapping role="editor" groups="admin" />
    <param name="storage"><![CDATA[/islands/web-expertise-{app->browsertype}-{page->lang}.php]]></param>
</Island>

Au passage…

Plusieurs substitutions existent relatives au browser du client. La toute première est celle qui fut introduite il y a bien longtemps : app->useragent. Mais celle-ci est obsolète car elle ne se basait pas sur la classe LSBrowser, développée assez récemment. Voici une liste récente des possibilités offertes par Vae Soli!:

  • {app->useragent} : remplacement par $GLOBALS['oApp']->szBrowser (obsolète depuis opus 5.0.0007, remplacé par {app->browser})
  • {app->ua} : remplacement par $GLOBALS['oApp']->oBrowser->szUA (à utiliser avec précaution)
  • {app->browser} : remplacement par $GLOBALS['oApp']->oBrowser->szName
  • {app->browsertype} : remplacement par $GLOBALS['oApp']->oBrowser->szType

Vae Soli! et les messages de service 2009-03-31

Vae Soli! possède ce qu'on appelle des messages de service. Il s'agit de paramètres spéciaux qui sont envoyés à n'importe quelle page et qui fait réagir le framework de manière spécifique. Les paramètres sont envoyés dans l'URL (query string). Il y a trois ans déjà nous documentions ces paramètres spéciaux.

Voici la liste des messages de service possibles :

  • Body d'une page
  • Head d'une page
  • Drop log
  • Visualiser un site comme sur un appareil mobile

Extraire le <body>...</body> d'une page 2009-03-31

Depuis l'opus "2.0.0009"

Vae Soli! permet de n'extraire que le corps de la page avec le message de service suivant : ?VaesoliServiceMessage={body}. Voilà un message de service particulèrement intéressant pour la syndication entre deux sites web. 

http://www.vaesoli.org/?VaesoliServiceMessage={body}

Essayez ce message de service en cliquant sur ce lien.

Extraire le <head>...</head> d'une page 2009-03-31

Vae Soli! permet d'extraire l'entête HTML de la page accédée grâce au service ?VaesoliServiceMessage={head}. 

http://www.vaesoli.org/?VaesoliServiceMessage={head}

Essayez ce message de service en cliquant sur ce lien et lisez ensuite la source de la page pour voir ce qui vous a été renvoyé.

Drop log 2009-07-04

Il est désormais possible de "dropper" le fichier de log de l'application grâce au message de service {drop:log}. Cette fonctionnalité n'est accessible que si la personne logguée fait partie d'un des groupes prédéfinis suivants :

  1. root
  2. admin
  3. admins
  4. administrators
  5. superadmin
http://www.vaesoli.org/?VaesoliServiceMessage={drop:log}

Visualiser le géorama à distance

Un de ces messages de service est le géorama:satori. Son effet est de visualiser le géorama actif d'un site internet. En voici un exemple que vous pourrez tester dans votre navigateur : 

Exemple
-------
http://www.vaesoli.org/?VaesoliServiceMessage={georama:satori}

Visualisez la source de la page pour voir ce que que ce message de service renvoie.

Visualiser un répertoire

Visualiser la root du site web

Exemple
-------
http://www.vaesoli.org/?VaesoliServiceMessage={dir:root}

Visualiser un site comme sur un appareil mobile 2009-03-31

Vae Soli! permet de visualiser un site comme il devrait apparaître sur un appareil mobile (mais c'est à vous de fournir le template qui doit être appliqué selon ce qui est expliqué ci-après).

Si vous avez spécifié un template spécifique, alors vous pourrez tester ce que cela donne grâce au message de service suivant : ?VaesoliServiceMessage={ua:MOBILE} (manière générique).

En remplaçant le mot "MOBILE" par la signature Agent (User-Agent) de votre appareil mobile, vous pourrez tester votre cas propre. Voyez par exemple comment nous testons le rendu dans le cas d'un iPhone : 

http://www.vaesoli.org/?VaesoliServiceMessage={ua:IPHONE}

Influencer le user agent

Depuis l'opus "5.0.0007"

Vae Soli! propose un message de service assez complet pour influencer la prise en compte du User Agent (voir ci-dessus) : le service {ua:…}. Avec l'opus 5.0.0007, de nouvelles fonctionnalités se sont ajoutées qui facilitent terriblement la mise au point de sites sur des environnements qui ne leur correspondent néanmoins pas (exemple : mettre au point un site version "mobile" sur un ordinateur "desktop").

Ainsi les clauses device, model et mobility se sont ajoutées au message de service {ua:…}. 

http://www.vaesoli.org/?VaesoliServiceMessage={ua:device=samsung;model=GT-I9100;browser=mini;mobility=mobile}

Notes de bas de page

[1] … Si les ressources statiques sont servies directement par le serveur web, les cookies n'ont aucune utilité. Le serveur ne s'en sert donc pas et les néglige.

[2] … Ce n'est pas la manière optimale de fonctionner mais cette méthode garantit déjà une belle optimisation. Dans une situation optimale on se servirait d'un CDN, entendez un Content Delivery Network.

[3] … Sur notre système de développement, il a suffit de définir le sous-domaine dans notre fichier hosts de Windows. Dans notre configuration Apache, tous les sous-domaines sont résolus physiquement par rapport à la racine du domaine général, ici 'www.ls.poc'.

Précédent Suivant