De ce que l’on peut remarque de wordpress.com, l’application utilise pleinement les outils web à sa disposition et tout cela sous le protocole HTTP, le protocole de communication web.
Plusieurs technologies sont utilisé sous le côté clients et le côtés serveur afin d’offrir aux utilisateurs une belle expérience et utilisé l’application avec facilité. WordPress a une très belle interface utilisateur agréable à voir et à utiliser. Les technologies javascript et CSS, deux parmis tant d’autres, aident grandement dans le style et le côté dynamique côté client.

Pour de ce qui est du côté serveur, nous pouvons analyser, par l’outil qui nous permet de voir les requêtes et réponses, entre le browser et le serveur , Http header offert comme plug-in pour FireFox, que le serveur gère également une grande partie de l’application afin d’offir à l’utilisateur un service rapide, efficace et le plus sécuritaire possible. Comme par exemple en installant des cookies sécuritaires, en utilisant des serveurs web populaire comme Apache et Nginx, en utilisant un language de programmation efficace pour générer les pages web dynamique , avec PHP et autres technologies populaires.

En général, les interfaces de wordpress sont très conviviable et assez facile de compréhension. Nous pouvons créer un blog avec une apparence professionnel et rapidement grâce à la collection de thème qu’elle propose. Ce qui est très pratique c’est que l’utilisateur n’a pas à gérer la façon que son texte sera placé dans un thème. Tout ce fait automatiquement lorsqu’on publie son article avec le thème , l’apparence, que l’on a choisi. Tout se fait dynamiquement en reliant le texte avec le thème. La grosse partie est réalisé côté serveur.

WordPress a travaillé très fort afin d’être compatible avec les browser web les plus populaire dans le marché. Quelques différences sont notés mais en général, l’utilisateur ne sera pas pénalisé pour son choix de browser web.

WordPress est une application très bien réussi. Nous avons qu’à voir le nombre d’utilisateur qui ont un compte wordpress. WordPress à utilisé la plupart des technologie en force présentement ce qui lui donne une très bonne réputé.

Technologies :

XHTML / HTML
Language qui spécifie les spécification de XML. Utilisée pour crée les page web.

XML
Spécification qui spécifie les language comme xhtml.

DHTML
Une collection de technologie utilisé pour créer des pages web intéractif et animé en utilisant une combinaison de language comme html, des language côté client comme le javascript et de style comme le css. Et le côté serveur créer de pages dynamique avec par exemple PHP.

JAVASCRIPT
Langage de script côté client pour rendre les page web un peu plus dynamique. On l’utilise pour la validation des champs mais aussi pour le mouvement dans les menus ou de la création de code dynamique.

CSS
Langage de style qui définie l’apparence du site. Utilisé en gros pour le côté visuel des pages web.

FLASH
Language d’animation. Dans wordpress il est utilisé dans le formulaire des statistiques afin de montrer les information de façon plus artistique et dynamique.

PHP
Language de script côté serveur qui permet le contact avec la base de donnée mais également la création de la page web de retour.

NGINX
Un serveur web de type léger et de email. Utilisée pour des des tâches plus simples et rapide.

APACHE
Serveur web utilise par wordpress. Comprends très certainement les données essentiels des utilisateurs.

GZIP
Utilitaire pour compresser les données utilisé pour compresser les paquets requête et réponse envoyé avec le protocole http.

DEFLATE
Algorithme de compression de donnée utilisée dans gzip.

PROTOCOL HTTP
Protocole principal de l’internet. C’est cela qui fait le lien de communication et de transfert de donné entre le serveur web et le côté client.

MIME (Multipurpose Internet Mail Extensions)
Standard internet qui étend le format des e-mail

IMAP/POP3 (Internet Message Access Protocol)
Standard internet protocol pour le e-mail

DOM (Document Object Model)
Langage indépendant qui représente les document html ou xml

AJAX (Asynchronous JavaScript and XML)
Groupe de technique de développement web utilisée pour crée des application web ou des riches application internet. Les technogies sont utilisées : XHTML et css ; DOM ; XML ;javascript;XMLHttpRequest.

XMLHttpRequest
API DOM qui peut etre utilisé par javascript pour transférer du XML et autre textes entre un Serveur web et le brower.

JQUERY
Libraire javascript légère qui emphase dans l’intéraction entre le javascript et le html.

RSS
File de nouvelle. Son format utilise la spécification de XML.

MYSQL
…. ou autre système de relation de base de donnée. Utilisé pour faire les requête sql à la base de donnée.

APPEL A PAYPAL ( PAIEMENT PAR INTERNET )
Utilise Paypal pour recevoir des montants des utilisateur.

HTTP COOKIES
Utilise par le serveur et garde des données important dans le côté client. Utilisé souvent pour l’authentification des utilisateurs.

Les opération du clipboard pour le web Copy, Paste , Drag and Drop.
Utilisé pour l’écriture de texte des articles , commentaires, pages.

Technologie qui déplace les éléments du tableau de bord.
Utilisé pour réarrangé le tableau de bord.

Widgets
Une classe côté application client pour afficher et faire la mise à jour des donnée local dans un seul téléchargement et installation dans la machine du client. Par exemple, l’horloge, nouvelles, jeux, météo. Ici c’est utilisé pour les fils de nouvelles d’article wordpress.

A-)  Apparences dans l’interface administrateur ! ( coin rond ).

• Nous pouvons remarquer que l’apparence est différentes dans l’interface utilisateur dans les deux versions de browser. Dans FireFox, on peut noter que les coins, en majorité sont aroudis. Sous Internet Explorer tout les coins sont carrés. On peut supposé qu’il y a une option css que IE n’a pas encore adopter.

B- ) Largeur minimal préférable dans les deux browser sous l’interface administrateur.

• Quelque chose de logique. Lorsqu’on réduit la largeur de la fenêtre, les deux browsers ont de la difficulté à repositionner les éléments qui forment l’interface. Par contre on note un effort dans FireFox pour ne pas positionné les éléments flottants par dessus un autre ; ce que IE ne fait pas.

C- ) Réaction bizarre dans la section Custum Header.

• Lorsqu’on se trouve dans le formulaire custom header, sur IE le menu à gauche ne s’active plus. Le drop list ne fonctionne plus. Ce qui est problématique lorsqu’on à raptisser le menu en mode icone. Car en ce mode là, on ne peut plus utiliser le menu pour changer d’option. La seule possibilité est d’utiliser la barre de menu ou  de finir l’opération d’insérer une nouvelle image.

D-) L’option BOLD est non fonctionnel pour quelques thèmes sous IE.

• Pour mon choix de thème, le style BOLD que j’ai appliqué dans mes articles n’apparaissent tout simplement pas dans le browser de IE. Je ne sais pas si ca s’applique pour tout les thèmes ou quelques unes. Dans tout les cas, pour mon thème, elle n’est pas appliqué sous IE. Mais elle est opérationnel dans FireFox.

WORDPRESS.COM

• Tableau de bord
  • Tableau de bord
  • Statistique du blog
    • Référants
    • Articles et pages les plus consultés
    • Critères de recherches
    • Clics
  • Surfeur de blog
  • Mes commentaires
  • Navigateur d’étiquettes
  • Abonnements
  • Lire-omatique
• Articles
  • Modifier
  • Nouvel article
  • Post Tags
  • Catégories
    • Convertisseur catégories vers mots-clefs
• Médias
  • Bibliothèque
  • Noouveau fichier
• Liens
  • Modifier
  • Nouveau lien
  • Catégories des liens
• Pages
  • Modifier
  • Nouvelle page
• Commentaires
• Apparences
  • Thèmes
  • Widgets
  • Extras
  • Votre image d’en-tête
  • Modifier le CSS
• Utilisateurs
  • Auteurs et Utilisateurs
  • Votre Profil
  • Invitations
• Outils
  • Outils
  • Importer
  • Exporter
• Réglages
  • Général
  • Écriture
  • Lecture
  • Discussion
  • Médias
  • Vie privé
  • Supprimer le blog
  • OpenID
  • Domaine
• Options Payantes
  • Options Paynates
  • Dons – Cadeau à WordPress
  • Domaine

A – ) TABLEAU DE BORD

• Tableau de bord

Écran principal regroupant les principales informations et statistiqe du blog en plus de donner accès à tout les sous-pages de configuration du blog.
Elle donne également l’option de réaménager les items du tableau de bord.

• Statistique du blog

Écran fournissant les statistiques de visionnement du blog

• Surfeur de blogue

Caractéristique en Béta-test
Possibilité d’ajouter des liens vers d’autres blog wordpress.com et avoir les mises à jour automatique des modifications de ces liens.

• Mes commentaires

Écran montrant les suivis des commentaires laissés par l’utilisateur à travers wordpress.com

• Navigateur d’étiquette

Caractéristique en Béta
Liste de billets (tags) écrits dans wordpress.com de gens discutant des mêmes sujets que la nôtre.

• Abonnements

Option qui permet de faire la gérance des listes auxquels nous avons placé des commentaires.

• Lire-omatique

Écran affichant la liste des commentaires et articles selon la liste de tags et blogs que l’on suit.

• Modifier

Affichage de la liste d’article publier. On donne l’option de sélectionner l’article que l’on veut modifier.  Il nous envoi à un nouvel écran auquel on peut modifier et mettre à jour l’article sélectionné.

• Nouvel article
  

Donne la possibilité d’écrire et de publier un nouvel article.

• Post Tags
  

Formulaire donnant la possibilité à l’usager d’ajouter des mots-clefs pour ses articles ou pages afin de faciliter la recherche aux articles.

• Catégories

Formulaire qui permet d’insérer des noms de catégories afin de regrouper les articles.

• Bibliothèque

Visualiser la liste de médias télécharger. ( images, sons, etc…)

• Nouveau fichier
  

Formulaire donnant la possibilité d’ajouter des fichiers médias.

• Modifier les liens
  

Formulaire qui donne la liste des liens insérer et donne la possibilité de les modifiés.

• Nouveau lien
  

Formulaire qui permet d’ajouter un lien vers une autre adresse en spécifiant son url, nom, description, etc…

• Catégories des liens
  

Formulaire donnant la possibilité à l’usager d’ajouter des noms de catégories afin de regrouper les liens par les catégories inscite.

• Modifier les pages
  

Formulaire donnant la liste des pages créer et donnant la possibilité de sélectionner une page et pouvoir modifier le contenu en redirigeant l’usager vers le formulaire de modification.

• Nouvel page
  

Formulaire permettant à l’usager de créer une nouvelle page.

• Thèmes

Formulaire donnant la possibilité de changer l’apparance du blog en choisissant parmi des template établi.

• Widgets
  

Formulaire donnant la possibilité d’ajouter ou supprimer des “widgets” ou des options wordpress sur la page du blog comme un calendrier, liste de mots-clefs, etc…

• Extras
  

Page donnant le choix d’activier les extras ou plug-in au blog

• Custom header
  

Formulaire donnant la possibilité de changer, ajouter une image d’en-tête au blog.

• Modifier le CSS
  

Formulaire donnant la possibilité, aux utilisateurs avancés, de changer le style du blog en ajoutant du code CSS.

• Auteurs & Utilisateurs

Formulaire offrant la possibilité de modifier le rôle de chaque identifiant du blog. Mais il permet aussi d’ajouter de nouveaux utilisateurs à la communauté.

• Votre Profil
  

Formulaire principal pour la modification complet du profil de l’administrateur du blog.

• Invitation
  

Formulaire permettant d’envoyer des invitations au blog aux personnes choisit par l’administrateur.

• Outils

Liste des outils d’installation sont suggérés pour aider l’administrateur à entretenir son blog efficacement.

• Importer
  

Possibilités d’importer des articles ou commentaires d’un autre système blog vers wordpress.

• Exporter
  

Fonction qui permet d’exporter le contenu du blog en format XML afin de pouvoir incorporer vers d’autres blog ou autre utilités.

• Option générales

Formulaire offrant la possibilité de modifié les options du blog comme le titre du blog, la langue, le fuseau horaire, etc…

• Option écriture
  

Option concernant l’écriture de l’affichage ( ex: la taille du champs de saisie ).

• Option de lecture
  

Option supplémentaire concernant le côté visuel du contenu. ( ex: le nombre d’article affichable ).

• Discussion
  

Option plus spécifique concernant les articles, les réglages de commentaires, etc…

• Médias
  

Déterminer les paramètres  des médias sur un blog ( ex : la taille des images ).

• Vie privée
  

Établir la visibilité du blog.

• Supprimer le blog
  

Section dans laquelle on donne la possibilité à l’administrateur de supprimer le blog complètement.

• OpenID
  

Possibilité d’ajouter des liens vers des sites que nous avons confiance. Ceci permet d’éviter des messages d’avertissement et de sécurité.

• Domaines
  

Possibilité de rediriger le blog vers un autre nom de domaine sans changement apparent.

• Options payantes

Possibilité de modifier le blog en achetant des fonctionnalités. ( ex : ajouter de l’espace disque au serveur ).

• Dons
  

Possibilité de faire des dons monaitaires à WordPress

• Domaine
  

Identique à la section domaine de l’option Réglage. Pour pouvoir associé un nom de domaine au blog, il faut obtenir un nouveau nom de domaine en achetant un nom de domaine.

Formulaire Catégories

Formulaire qui effectue l’ajout des catégories que l’on peut associé éventuellement un article.

Name = “addcat”

Method = “post”

Action = “categories.php”

URL : http://beetho.wordpress.com/wp-admin/categories.php

Formulaire ajouter un nouvel article

Formulaire auquel on peut écrire un nouvelle article, ajouter des mots-clefs et associé une catégorie.

Name = “post”

Method = “post”

Action = “post.php”

URL : http://beetho.wordpress.com/wp-admin/post-new.php

Formulaire Modifier les articles

Formulaire affiche la liste des articles que l’usager voudrait effectuer la modification.

Name = aucun

Method = “get”

URL : http://beetho.wordpress.com/wp-admin/edit.php

Formulaire Mots-clefs

Formulaire qui nous permet d’ajouter des mots-clefs pour tout les formulaires.

Name = “addtagt”

Method = “post”

Action = “edit-tags.php”

URL : http://beetho.wordpress.com/wp-admin/edit-tags.php?taxonomy=post-tag

Formulaire Gifts

Formulaire auquel nous pouvons faire des dons en argents à WordPress.

Name = aucun

Method = “post”

Action = “paid-upgrades.php?page=wpcom-gifts”

URL : http://beetho.wordpress.com/wp-admin/paid-upgrades.php?page=wpcom-gifts

– .css

Fichier de style de la page html.

– .ico

Fichier favicon ( image ) associé au site se trouvant avant le url

– .js

fichier javascript pour la dynamique de la page et la validation

- .gif

fichier images pour embellir les pages web

- .png

fichier images pour embellir les pages web

Set-Cookie : wordpress
Set-Cookie : wordpress_logged_in
Set-Cookie : wordpress_test_cookie
Set-Cookie : wp-settings-6997907
Set-Cookie : wp-settings-time-6997907

A – ) Quelles marques de serveurs Web sont utilisées par l’application ?

- Nginx  ( a lightweight werb server, reserve proxy and email (imap;pop3)

- PWS  ( Personal Web Server ) 1.4.12

- Apache 2.2.6 (Unix)

B – ) Quelle version du standard HTML ou XTHML est utilisée pour le balisage de la page principale ?
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

- XHTML 1.0

C – ) Combien de communication requête-réponse sont effectuées lors de la première visite au site ?
- 57 requêtes-réponses.  ( en supprimant la cache ) !

1- L’affichage graphique des statistiques du blog :

Lors de l’ouverture de la page statistique, nous pouvons remarquer de l’interaction sur le graphique statistique du blog. Une composante Flash a été insérer pour effectuer cette animation graphique.

2- La soumission d’un commentaire :

Pour chaque soumission du formulaire, la programmation html est requise pour effectuer l’appel au fichier serveur. Cette appel se fait du côté client.

3- La validation des champs lors de l’inscription d’un nouvel usager à wordpress :

Avant qu’un formulaire soit envoyé, pour ne pas effectuer un aller-retour inutile, une partie des entrées sont vérifiés par du code javascript. Le javascript peut vérifié tout les champs pour effectués une première validation.

4- Modification des styles des articles :

Lors de l’écriture d’un article, on peut changer le style de l’écriture en ajoutant du BOLD ou de l’italique au texte et ainsi de suite. Du code javascript est très certainement utilisé pour effectué dynamiquement cette modification avec l’interprétation du html pour éviter l’appel au serveur.

5- Sélectionner une image ou un média pour un article :

On peut ajouter une image, son ou autre média au texte. Du code javascript est surement utilisé pour appelé les fonctionnalité windows qui effectuera la saisi du média que l’usager voudra ajouter.

6- l’interprétation des pages , articles, catégories :

Tout code qui vient du serveur n’est pas vu automatiquement comme un fichier texte, mais interpréter par le browser web. Car tout code est reconnu par le browser est interprété et afficher adéquatement et non pas uniquement une série de texte.

7- les droplist des sous catégories :

Nous savons que c’est du code css qui fait l’interaction des sous-menu. Mais ce code n’a pas besoin d’être toujours demandé au serveur. Elle est gardé côté client et est interprété au besoin.

8- l’ajout des mots clés pour un article ( avant la publication de la page ) :

Avant d’envoyé tout les mots-cléfs au serveurs, ces mots-cléfs sont gardé côté clients. Par le javascript il les garde dans un tableaux.

9- Validation des champs entrés pour les mots-cléfs ou catégories :

Avant qu’un formulaire soit envoyé, pour ne pas effectuer un aller-retour inutile, une partie des entrées sont vérifiés par du code javascript. Comme empêcher un même mot-clef d’être enregistrer.

10-Les opération du clipboard pour le web Copy, Paste , Drag and Drop.
Utilisé pour l’écriture de texte des articles , commentaires, pages.