Bonjour à tous,

J'ai suivi depuis septembre les cours sur HTML5/CSS3 et PHP/MySQL, que j'ai pu mettre en pratique pour créer le site de notre projet étudiant : Tact'icônes 2.

J'ai trouvé ce cours vraiment bien fait, mais j'avais du mal à y retrouver les attributs / lignes de codes pendant que je codais le site. C'est impossible de tout retenir par cœur du premier coup, et une prise de note est vite difficile à lire (le cours fait des centaines de pages...).

J'ai donc eu l'idée de créer des mind maps, des cartes heuristiques des deux cours. Elles ne remplacent pas le cours mais elles permettent de retrouver n'importe quel élément très rapidement en cas de besoin.

Ça vous intéresse ? Je les ai mises en ligne sur le site dont je parle plus haut, dans la rubrique tutoriels ! N'hésitez pas à les consulter, les télécharger, et les utiliser si elles peuvent vous êtres utiles ! De plus, vous pouvez me faire des remarques ou des suggestions, il y a sans doutes des petites choses à corriger

Bonne lecture, en espérant vous être utile

casperweb

2 avril 2014 à 20:58:30

bonjour,

j'utilise https://developer.mozilla.org/fr/docs/CSS/Reference et https://developer.mozilla.org/fr/docs/Web/HTML/Element comme référence et pour le php www.php.net

bien pour les cartes heuristiques c'est une très bonne idée ça, si je peux me permettre quelques petits ajouts :

pour le téléchargement vous pouvez utiliser l’attribut download : <a href="bg-intro.png" download="Background">Télécharger l'image</a>

pour les sélecteurs vous pouvez compléter avec Principes du CSS – Les sélecteurs (Partie1 : CSS2) et Principes du CSS – Les sélecteurs (Partie 2 : CSS3)

pour héritage > propriété contradictoire, j'ai pas compris ce que vous vouliez dire. Peut être Principes du CSS – Poids des déclarations ?

Je suis pas sur que la taille de police en em soit du % . C'est différent. % et em sont toute 2 des tailles relatives.

Pour le rgba, il ne remplace pas le rgb mais gère en plus du rgb la transparence alpha

dans les balises structurante vous pouvez ajouter <main>

dans le modèle de boite de type inline vous écrivez cm, vous vouliez dire em.

Pour le centrage de block il peux ce faire verticalement aussi voir http://fr.openclassrooms.com/informatique/cours/centrer-en-css

pour le display vous pouvez compéter par table, table-cell, flex, table-header-group, table-footer-group , inline-table , table-caption , table-row, table-row-group, table-column, table-column-group

--------------

si je peux me permettre un correction de votre code :

sur la page d’accueil du site tu as 2 id="fb-root" or une id est par définition unique pour un document.

Pour aller en haut de page tu peux faire un simple <a href="#">Haut de page</a>

les images images/guillemet_ouverture.png et images/guillemet_fermeture.png n’apporte aucun contenu ce sont 2 images de décoration et à ce titre c'est en css qu'elles devraient être déclarées.

Pour alt="Vignette française" j'aurais été plus explicite dans la description par ex : alt="Lire la suite en langue française" et bien évidement la même chose pour les autres drapeaux mais pas en français, dans la langue en rapport avec le drapeau. En effet ce texte s'affiche ou est lu par un lecteur audio pour les personnes ayant désactiver l'affichage d'image ou si l'image n'est pas téléchargée.

Pourquoi utiliser <span id="sous_titre"> à la place d'un vrais titre (h2 par exemple)

pour le changement de langue vous devez l'indiquez avec l’attribut lang or vous déclarer un <html lang="fr"> pour les 3 langues

pour http://www.tacticones2.fr/index.php?lang=cn erreur de balise <strong>MEMS技术</stong> au lieu de </strong>

pour vos liens externes ce serais bien de les signaler visuellement comme tel http://romy.tetue.net/signaler-les-liens-externes-par-un-picto

En css

#titre { display: block; pourquoi redéfinir un block, les titres sont des block par défauts.

Vous utilisez une taille de police en px il est préférable d'utiliser les unités relatives voici pourquoi, http://www.paris-web.fr/2013/conferences/un-petit-pas-pour-lem-un-grand-pas-pour-le-web.php et http://www.grafikart.fr/tutoriels/html-css/font-size-rem-em-px-477

http://www.grafikart.fr/tutoriels/html-css/typography-298

très bon travail dans l'ensemble, chapeau

Dégooglisons Internet

LudoZeGeek

4 avril 2014 à 13:12:01

Bonjour,

Un grand merci pour les remarques, je vois que tu as passé du temps à tout regarder. Je prendrai le temps de tout corriger prochainement. Merci encore pour ton temps

HibahGounou

13 décembre 2021 à 19:55:59

Comment mettre en gras une case dans un formulaire et mettre une photo en arrière-plan

AbcAbc6

13 décembre 2021 à 22:01:00

@HibahGounou Bonsoir, merci de ne pas déterrer d'ancien sujet. Créer le votre dans le respect des règles du forum à savoir qu'un message commence par des règles de politesses (un bonjour ou des salutations à la communauté et se termine par des remerciements par avance pour les futures réponses) un descriptif de votre problème et le code que vous avez écrit inséré sur le forum avec l'outil d'intégration de code soit le bouton code </>.

Déterrage

Citation des règles générales du forum :

Avant de poster un message, vérifiez la date du sujet dans lequel vous comptiez intervenir.

Si le dernier message sur le sujet date de plus de deux mois, mieux vaut ne pas répondre.
En effet, le déterrage d'un sujet nuit au bon fonctionnement du forum, et l'informatique pouvant grandement changer en quelques mois il n'est donc que rarement pertinent de déterrer un vieux sujet.

Au lieu de déterrer un sujet il est préférable :

soit de contacter directement le membre voulu par messagerie privée en cliquant sur son pseudonyme pour accéder à sa page profil, puis sur le lien "Ecrire un message"

soit de créer un nouveau sujet décrivant votre propre contexte

ne pas répondre à un déterrage et le signaler à la modération

Je ferme ce sujet. En cas de désaccord, me contacter par MP.

Forums des Zéros

Résumés des cours HTML/CSS et PHP/MySQL

On vous propose des résumés des deux principaux cours sur le web !

Déterrage

Résumés des cours HTML/CSS et PHP/MySQL

On vous propose des résumés des deux principaux cours sur le web !

Déterrage

Supprimer

Modérer

Signaler le message aux modérateurs