Le terme développement désigne l’action d’une avancée ou le résultat de cette action.

Le développement Web est le résultat de la simple page basique (site statique) ou des pages échangeant avec le serveur (site dynamique) associé à une base de données (gestion de contenu) en ligne.

Prestations Web Dev = éléments (HTML +CSS +JavaScript +PHP & MySQL) à assembler

Après le temps du web design, c’est maintenant que votre site internet commence à prendre conscience de son existence.

Je développe le site conformément aux standards du web et lui intègre les fonctionnalités techniques nécessaires définis par votre brief validé.

Prestations Web Développement

La réalisation d’un site web réclame des compétences variées : en développement des langages Web, avoir des notions en ergonomie et en interactivité, ainsi qu’une bonne connaissance des possibilités techniques liées à ces domaines.

On peut citer la diversité des terminaux web et de leurs affichages, accessibilité, spécificités des différents langages et processus, portabilité, respect des recommandations du W3C (World Wide Web Consortium) mais aussi des ‘Best practices’ ou encore suivre des tendances ou les créer. Break the rules!

Prestations Web Dev = éléments (HTML +CSS +JavaScript +PHP & MySQL) à effectuer

En tant que web designer professionnel, à ce moment ce que je fais pour votre projet web :

Site TimeDM - Team member page 2017 - by TimeDM Studio
Site TimeDM – Team member page 2017 – by TimeDM Studio

Moteur WordPress

Particulièrement célèbre en tant que solution dédiée au blog, WordPress, en tant que moteur de système de gestion de contenu, permet tout aussi bien de créer et gérer un site vitrine et un blog pro dédié à votre actualité.

En 2016, WordPress est annoncé comme le moteur qui fait tourner 25% du Web.

Si vous utilisez un traitement de texte, donc vous savez utiliser WordPress, et peut-être même plus facilement encore. WordPress vous permet de modifier une page, créer de nouveaux articles, ajouter des images. Toutes ces actions en quelques clics. Il faut juste connaitre les bonnes pratiques pour les images, mais c’est valable quel que soit le système mis en place.

Plébiscité par ses utilisateurs, WordPress est une solution mature, avec 10 ans d’expérience. Il bénéficie d’une communauté très créative et expérimenté. WordPress est devenu ce qu’il est grâce à puissance, sa simplicité d’utilisation, son respect des standards et son catalogue impressionnant d’extensions et thèmes, le tout grâce à sa communauté.

En tant que web designer professionnel spécialisé WordPress, mes prestations sont :

TimeDM vous guide en tant que co-pilote pour acquérir les bases de WordPress et de la gestion web si besoin.

sous le capot moteur WordPress

WordPress affiche une interface d’administration pour l’éditeur de votre contenu. Ce même contenu est composé de pages et d’articles constitué de textes et d’images.

WordPress est développé en PHP et repose sur une base de données en ligne sur un serveur MySQL.

Le système WordPress permet d’avoir un moteur disponible qui permet de gérer du contenu constitué d’éléments Web.

Les fonctionnalités natives de WordPress permettent de créer et gérer différents types de sites Internet :

Ces types de sites ont la même base, c’est à dire le même moteur. On développe le châssis et sculpte la carrosserie afin de correspondre aux besoins précisé dans le brief.

Le Thème WordPress est constitué de plusieurs fichiers tels que les feuilles de style (CSS), de script (JavaScript) et bien sûr de page PHP mis en page grâce aux contenu et balises HTML.

sous le capot moteur de site Web

Ces blocs HTML mettent en page le contenu, le vôtre. L’arborescence de tout les blocs d’une page Web est dénommé DOM pour ‘Document Object Model’.

La feuille de style du Thème WordPress est la déclinaison de la charte graphique de votre organisation et les propriétés nécessaire à la mise en forme du contenu.

Les scripts développé en langage JavaScript (JS) sont des librairies de fonctions qui ajoutent l’interaction possible pour l’utilisateur sur la page Web.

Le Thème WordPress ou template est l’ensemble de fichiers HTML +CSS +JavaScript réunis dans un dossier stocké sur le serveur Web.

L’interface Utilisateur est affiché par le travail du navigateur qui interprète ces fichiers via le moteur de rendu du navigateur afin de les rendre visible.

sous le capot moteur du navigateur Web

La navigateur Web affiche les éléments décrit dans la feuille de style, tel que la couleur d’un bloc HTML ou la typographique choisie.

Le navigateur termine en affichant la page composée de bloc HTML mise en forme grâce au CSS.

schema moteur de rendu de navigateur web - web browser layout engine - 2017 - by WEBDESIGNMOTEUR
schema moteur de rendu de navigateur web – web browser layout engine – 2017 – by WEBDESIGNMOTEUR

Utilité du moteur du moteur WordPress

Afin de produire la page web que vous voyez sur votre navigateur, le serveur d’applications serveur peut utiliser un template et le remplir avec des données pioché sur le serveur MySQL.

Ainsi, pour des sites qui ont des centaines ou des milliers de pages, il n’existe pas un document HTML « réel et à faire à chaque fois » pour chacune de ces pages.

En fait, il y a quelques template qui sont utilisés avec une base de données. Le template est remplis par le contenu mis en base de données. chaque lien entre le template et la base de données est possible grâce au langage serveur PHP composé de fonctions et de blocs HTML, et du textes stocké sur le serveur MySQL. Le langage PHP discute avec MySQL.

WordPress (ou un autre système de gestion de contenu Web) apporte ces éléments moteur afin de gérer une base de données, un Template et des pièces permettant de faire tourner ‘the loop’ qui affiche une page web = 1 document HTML x template x table de base de données = ‘the loop’ = boucle moteur = site web

Cette organisation permet de gérer le contenu via une interface d’administration et de maintenir efficacement le site.

WordPress est donc un moteur complet (PHP & MySQL) de gestion de contenu prêt à être installer sur un serveur web PHP & serveur MySQL.

Reste donc à développer le Thème WordPress adapté à votre projet de site Web ! C’est l’activité même du studio TimeDM, la création de site Web ou de Thème WordPress avec installation sur serveur Web et réglages du moteur WordPress.

sous le capot moteur du serveur Web

Représentation graphique du fonctionnement du serveur web - by TimeDM
Représentation graphique du fonctionnement du serveur web – by TimeDM

Au niveau des composants matériels, un serveur web est un ordinateur qui stocke les fichiers qui composent un site web (par exemple les documents HTML, les images, les feuilles de style CSS, les fichiers JavaScript) et qui les envoie à l’appareil de l’utilisateur qui visite le site. Cet ordinateur est connecté à Internet et est généralement accessible via un nom de domaine.

Au niveau des composants logiciels, un serveur web contient différents fragments qui contrôlent la façon dont les utilisateurs peuvent accéder aux fichiers hébergés.

Le serveur HTTP est un logiciel qui comprend les URL (Uniform Resource Locator) et le protocole HTTP qui est le protocole utilisé par le navigateur pour afficher les pages web.

Au niveau le plus simple, à chaque fois qu’un navigateur a besoin d’un fichier hébergé sur un serveur web, le navigateur demande (on dit qu’il envoie une requête) le fichier via HTTP. Quand la requête atteint le bon serveur web (matériel), le serveur HTTP (logiciel) renvoie le document demandé.

Pour afficher une page web, votre navigateur envoie une requête au serveur web. Celui-ci effectue alors la requête pour le fichier demandé. Lorsqu’il trouve le fichier, le serveur l’interprète puis l’envoie au navigateur.

sous le capot moteur du site Responsive Web Design

Le Responsive Web Design (ou RWD pour les intimes) regroupe une série de techniques permettant de rendre compatible un site web avec toutes les tailles d’écrans, des plus petits (comme ceux des Smartphone par exemple) aux plus grands écrans d’ordinateurs de bureau (Ultra HD).

La notion de Responsive Web Design est techniquement le fait de l’utilisation d’une grille fluide (établis dans la feuille de style CSS), d’astuce d’affichage des images (via des propriété CSS) et des nouvelles techniques (depuis 2011) que permettent les feuilles de styles de troisième génération à savoir les media queries.

Il devient alors inutile, ou presque, de concevoir autant de versions d’un même site pour toutes sortes de résolutions ou de supports… Un site RWD est penser et développer pour adapter le contenu à l’écran. Au delà du code ou autre, c’est simplement une manière de concevoir, de pensée, de réflexion, afin de proposer un contenu adapté et une navigation adaptée, en situation de mobilité, ou au calme sur un grand écran au bureau.

DESIGNMOTEUR - Responsive Web Design - 2017 - screen homepage
DESIGNMOTEUR – Responsive Web Design – 2017 – screen homepage

Prestations Web Dev = éléments (HTML +CSS +JavaScript +PHP & MySQL) à optimiser

Au sein du studio TimeDM, lors de la création du site, on réalise l’optimisation entre le moteur de site web tel que WordPress, le châssis de la template (Theme WP) et sa carrosserie visible (Interface Utilisateur), afin que Serveur & Client échangent vite entre eux. Ces éléments « moteur, châssis, carrosserie » sont stocké sur le serveur Web. Et le navigateur Web reçoit ces éléments du serveur via la route/protocole HTTPS.

Ainsi, chaque éléments electro-mécanique-informatique qui entre en jeu entre le serveur web et le navigateur web est optimisé. C’est ça qui est bon pour votre business.

Maintenant que le développement est en cours. Pour que le site deviennent réalité, il est temps de passer au déploiement