Owen Little
0 
3487
159
Depuis que j'ai commencé à apprendre le HTML dans les années 90, j'ai toujours trouvé qu'il était presque impossible de trouver de bons exemples HTML solides sur Internet. Il aurait été bien d’avoir quelques sites Web qui offrent les exemples de codage de sites Web les plus récents et les plus intéressants..
Eh bien, beaucoup de choses ont changé depuis les années 90, et l'avènement de langages de codage Web dynamiques comme PHP et CSS fait vraiment du HTML old-school. Encore une fois, vous devez comprendre le HTML old-school avant de pouvoir comprendre les langages qui créent dynamiquement le HTML que les navigateurs affichent..
Heureusement, certains sites Web impressionnants offrent des exemples et des didacticiels de codage HTML bien conçus et utiles. Il y a certainement encore beaucoup de sites Web assez médiocres sur les tutoriels HTML, alors j'ai décidé de rassembler huit de mes sites Web préférés..
Je devrais mentionner que MUO est probablement le premier endroit pour commencer, avec des articles sympas sur le langage HTML de base. 5 étapes pour comprendre le code HTML de base. 5 étapes pour comprendre le code HTML de base. HTML est la colonne vertébrale de chaque page Web. Si vous êtes débutant, laissez-nous vous guider à travers les étapes de base pour comprendre le HTML. , effets HTML cool 7 effets HTML cool que chacun peut ajouter à son site Web 7 effets HTML cool que tout un chacun peut ajouter à leur site Web Ne désespérez pas! Vous n'avez pas besoin de connaître CSS ou PHP pour créer un site de fantaisie. Un bon vieux code HTML et savoir copier-coller suffiront. Conseils HTML et HTML 5 Conseils HTML pour créer un site Web gratuit à chargement rapide 5 Conseils HTML pour créer un site Web gratuit à chargement rapide pour accélérer le chargement de votre site Web.
Améliorez vos compétences en développement Web avec ces 10 outils essentiels Mettez à niveau vos compétences en développement Web avec ces 10 outils essentiels Prêt à commencer à développer des sites Web? Ces outils en ligne pour les développeurs Web débutants et experts sont assurés de booster vos compétences! pour tester ce que vous apprenez.
1. Chien HTML
HTML Dog est l'un de mes sites préférés que je vérifie généralement en premier lorsque j'oublie la syntaxe de base des instructions HTML. Le site est bien conçu, contrairement à 90% des sites Web de conception de sites Web qui semblent avoir été construits dans les années 1990 et qui n'ont jamais été mis à jour. Le format est simple et rapide - il suffit de cliquer sur le lien Exemples de la page principale pour obtenir une liste d'éléments HTML tels que la mise en page, la couleur, le texte, etc..
HTML Dog fournit des exemples clairs dans des zones de code blanc que vous pouvez copier et coller dans votre propre code HTML. Vous pouvez voir la sortie HTML réelle en direct de l'exemple de code dans le volet de droite..
2. W3Schools
Maintenant, alors que HTML Dog est mon préféré quand il s’agit de vérifier la syntaxe de base, W3Schools est l’endroit où je vais habituellement quand je veux avoir un peu de fantaisie avec mon codage Web. C'est l'une des ressources les plus populaires pour tous les exemples de codage simples et dynamiques, de PHP à JQuery et Javascript - mais vous trouverez également une section géniale remplie d'exemples de codage HTML de base..
L’avantage de W3Schools, c’est que, comme HTML Dog, ils ont incorporé un outil utile d’écran partagé permettant de tester le code appris dans chaque leçon. Juste modifier le HTML un peu, cliquez sur “Courir” et vous verrez les résultats dans la zone à droite. Très utile!
3. Quackit
Quackit est un autre site au même niveau que W3Schools en termes d’utilité et de design moderne. Oui, le nom est un peu loufoque, mais le site fournit de nombreux exemples utiles..
Dans la zone HTML, vous trouverez de nombreux exemples de code dans des zones de texte que vous pouvez mettre en surbrillance et copier - avec l’effet d’affichage réel affiché dans l’affichage. “Exemple” colonne.
4. Landofcode.com
LandOfCode est un autre site offrant l’outil utile en écran partagé permettant de tester le code HTML. Le site principal propose un grand nombre d’exemples HTML, allant de la mise en forme de texte HTML à la création de liens appropriés vers des formulaires HTML, des feuilles de style et des balises méta. Mais le vrai bijou sur ce site Web est l'éditeur de code PractiCode Online..
Celui-ci est en fait un peu plus avancé que l'outil W3Schools et HTML Dog, car il comporte des boutons supplémentaires qui vous permettent d'afficher les résultats dans une nouvelle fenêtre, pas seulement dans la zone d'affichage à droite..
5. Codecademy
Codecademy est l’un des sites Web les plus connus pour l’apprentissage de toutes les langues. Et quand il s'agit d'apprendre le HTML de base, Codecademy ne déçoit pas avec son premier site Web utilisant le cours HTML et CSS [Broken Link Removed].
L'espace de travail du cours, comme le reste de Codecademy, est assez avancé et vous permet de jouer dans la zone de code et d'afficher votre page Web en temps réel sur la bonne mise à jour à mesure que vous apportez des modifications. Vous pouvez également passer en mode plein écran pour voir à quoi ressemble votre site Web dans une fenêtre de navigation complète.
La bonne chose à propos de ce cours est qu’il intègre également l’apprentissage de l’utilisation de CSS pour formater vos pages. 10 Exemples de code CSS simples à apprendre en 10 minutes 10 Exemples de codes CSS simples à 10 minutes Nous allons voir feuille de style intégrée pour vous permettre de mettre en pratique vos compétences CSS. Nous passerons ensuite à 10 exemples CSS de base. A partir de là, votre imagination est la limite! , que toute personne apprenant le HTML de base devrait apprendre en même temps qu'elle apprend le HTML.
6. EchoEcho
Quelques sites Web supplémentaires que je voulais aborder ne sont pas les meilleurs, mais ils se situent au-dessus des autres sites de code HTML, car ils sont bien écrits, bien formatés et couvrent le sujet à fond. Le premier d'entre eux est EchoEcho. Ce site contient une section HTML qui est probablement l’une des listes les plus exhaustives d’éléments HTML à apprendre en un seul endroit..
Chacune de celles-ci fournit un exemple très clair de la structure du code HTML, ainsi qu'une explication de tous les paramètres et options disponibles que vous pouvez utiliser..
Ce site est en réalité consacré à offrir beaucoup plus que des tutoriels - son D-Zine en ligne! est essentiellement un magazine en ligne consacré à tout ce qui concerne le design web.
7. Java2
La section HTML / CSS du site Web Java2s ressemble à une encyclopédie de balises HTML pour les débutants et les experts. La mise en page est parfaite, en particulier pour les personnes qui savent peut-être déjà quelles balises HTML elles souhaitent utiliser, mais ne se souviennent pas exactement de la syntaxe exacte..
La liste des balises est propre et classée par ordre alphabétique afin que vous puissiez rapidement faire défiler la liste pour trouver celle que vous souhaitez. Une fois que vous avez cliqué sur la balise, vous verrez une liste d'exemples d'utilisation, et lorsque vous cliquez sur l'un d'entre eux, vous verrez l'extrait de code exact que vous devez utiliser pour l'implémenter..
Vous pouvez cliquer sur Essayez cet exemple pour voir la page HTML résultante dans une nouvelle fenêtre de navigateur.
8. Awwwards
Enfin, comme c’est toujours une bonne idée d’apprendre à coder en voyant des exemples d’excellent code, je dois féliciter l’un des sites les plus utiles sur Internet auquel tous les étudiants débutants en HTML devraient créer un signet. Le site s'appelle Awwwards.
Awwwards attribue des récompenses pour le site de l'année, du mois et du jour et donne même un coup de pouce aux meilleurs développeurs et sites mobiles. En parcourant ces sélections, vous aurez une foule d'idées sur les éléments et les mises en page qui fonctionnent le mieux lorsque vous créez vos propres pages Web..
Allez en avant et créez
Rien de plus grisant que de passer des jours, voire des mois, à coder votre propre site Web et à révéler enfin votre chef d’œuvre au monde entier. Si vous êtes un bon élève du HTML et de bonnes pratiques de conception HTML, vous pouvez certainement rejoindre les rangs des développeurs Web qui ont contribué au meilleur de ce que le Web a à offrir..
N'oubliez pas de consulter la liste d'exemples HTML de MakeUseOf qui vous aidera à démarrer sur votre chemin..
Avez-vous développé un goût pour le codage? Ces défis de codage peuvent vous aider à gagner un meilleur salaire et à jeter un coup d'oeil à ces IDE de navigateurs que les programmeurs devraient connaître..
Vous voulez des exemples de code pour d'autres langages de programmation? Vous en trouverez une profusion sur ces exemples de codes professionnels. Top 10 exemples de codes professionnels pour programmeurs Top 10 exemples de codes professionnels pour programmeurs Vous souhaitez apprendre et créer des applications avec des exemples de fragments de code? Voici les meilleurs exemples de code Web gratuits pour commencer. .