Chargement de l'article en cours ... Cet article propose quelques outils et pistes de réflexions utiles lors du développement d’un site web. Il ne constitue en rien un tutoriel. Développer un site web Ce site web, par exemple, a été élaboré avec les langages : HTML / CSS / JavaScript / PHP Par quoi commencer ? Chacun des langages utilisé possède une synthaxe propre et un usage bien spécifique. Le HTML et le CSS sont les deux langages essentiels pour la création de pages web statiques. Le HTML sert à structurer le texte, les liens etc… Le CSS gère quant à lui l’aspect visuel de la page comme les couleurs, la mise en page… Si vous voulez faire un site “vitrine”, ces deux langages vous suffiront. Le JavaScript est souvent l’étape suivante. Il gère le comportement du site (menus déroulants, formulaires…). Pour aller plus loin… Pour s’orienter vers un site dynamique, le PHP entre en jeu. Il s’agit d’un langage serveur (les trois précédents étaient des langages dit “clients”). Cela signifie que seul le serveur interprète cette partie de code et renvoie, par exemple, du HTML au client. Le SQL permet la gestion de bases de données (pour enregistrer des données “utilisateur” par exemple). La maîtrise de ces différents langages vous permettra de développer des pages web à l’aide de solutions comme WordPress par exemple. Outils pour créer un site web Choix de l’éditeur Figure 1 – Interface de Visual Studio Code Visual Studio Code est un editeur très modulable (avec de nombreux plugins). La coloration synthaxique et les fonctionnalités d’autocomplétion sont très pratiques. Plugins utiles : Auto Close Tag permet l’automatisation de la fermeture des balises. Beautify nettoie et organise proprement votre code. Auto Rename Tag facilite la mise à jour des balises. Trailing Spaces nettoie les espaces inutiles de votre code. ftp-simple permet de se passer d’un client FTP puisque vous pouvez uploader depuis VSCode vos ficiers. Quelques outils pour le développement de votre site Bootstrap est une librairie permettant de construire un site web “responsive” (qui s’adapte aux formats d’affichages). Le site web sera alors adapté aux mobiles ainsi qu’aux tablettes. Font Awesome est une librairie comportant plus de 1200 icônes pour personnaliser votre site web. Transparent Textures apporte un lot de textures pour personnaliser vos arrière-plans. Adobe Color Wheel aide à générer un jeu de couleurs pour votre site. Quelques liens utiles Le cours OpenClassroom pour créer un site web en HTML et CSS : ici. Le cours OpenClassroom pour créer un site web avec PHP et MySQL : ici. Documentation PHP : ici. Introduction à WordPress : ici. Le site w3schools avec pleins d’astuces : ici.
