Formation - Création de Sites Web
Sommaire
Ressources sur le Web
Tout ce qui concerne la création de site peut être trouvé sur Internet, encore faut il trouver des informations en français, bien écrites et abordables par tout public.
Selection de sites informatifs
Sites de Ressources
- Images : une fournée de liens vers des banques d'images Libres de droits (vérifier quand même avant utilisation sur votre site)
- Audio : des liens vers de l'audio en libre téléchargement/diffusion et parfois en libre modification.
- Videos : idem pour les vidéos
- Chromoweb Choisir les couleurs de son site
- Color-palette Choisir des couleurs en fonction d'une image
- ColorBlender Encore un outil pour trouver un agencement de couleurs
Description des navigateurs principaux disponibles sur Windows / Linux /MacOS. Comment se passer d'Internet Explorer et redécouvrir le Web. Un navigateur en particulier : Firefox et ses extensions.
- Firefox (Win, Lin, Mac)
- Opera (Win, Lin, Mac)
- Safari (Mac)
- Konqueror (Lin)
- Internet Explorer (Win) [Déconseillé]
Tour des extensions utiles à Firefox pour enrichir ses fonctions grâce au site référence en français Geckozone.
Aspect Graphique
Collecter des images libres de droit
Voir la section Collecter des Images et Photos
Découverte du langage CSS
Langage permettant de designer une page web en mettant une frontière entre contenu et présentation. Pourquoi utilisez ce langage, avantages et inconvenients.
- le CSS pas à pas plus de 15 épisodes servent à comprendre comment utiliser le CSS dans une page web.
- Tutoriaux CSS - AlsaCréations
- CSS Débutant Découvrir le CSS pour les débutants
Approfondir le CSS
Pratiquer, pratiquer, pratiquer, la seule solution viable. C'est encore plus interessant quand les cours sont expliqués dans le détail et organisés de façon à produire des éléments CSS/XHTML efficaces et néanmoins graphiquement très jolis.
- Construire ses propres menus en CSS
- Liste de toutes les propriétés CSS expliquées et commentées.
Choix d'un Panel de Couleur
Comment choisir les couleurs du menu, de l'habillage, du texte, des liens ? Comment ne pas en faire trop.
- Chromoweb Choisir les couleurs de son site
- Color-palette Choisir des couleurs en fonction d'une image
- 100 couleurs au hasard
- ColorBlender Encore un outil pour trouver un agencement de couleurs
- ColorSyntaxis Très sympa comme outil
Taille et disposition des éléments
Différence entre taille fixe et taille liquide, placement des éléments d'information sur la page
Galerie de Menus prêts à l'emploi :
Définir l'aspect du texte
Qu'est ce qu'une Typo ? comment mettre en valeur le texte ? et les liens ?
Les Balises META
Comprendre leur utilité, choisir les mots clefs décrivant le site ou une page pour une bonne indexation dans les moteurs de recherche.
Développer et mettre en ligne un site Web
Quelques règles indispensables
Création de l'arborescence du site, dénomination des fichiers, Liens absolus et relatifs, différence entre l'ordinateur local et le serveur distant.
Liste de bonnes pratiques de développement Opquast
Comment se passer des cadres (frames)
Comment banir les cadres, quelles sont les solutions équivalentes, pourquoi faire autrement ?
Comment éviter le design avec des tableaux
Les tableaux servent à afficher des données tabulaires, pas à organiser l'affichage des éléments dans une page.
Fonctions d'animations offertes par le CSS
Comment changer une image au survol de la souris, personnaliser les liens Hypertextes, afficher ou cacher des éléments dans la page.
Comment heberger son site
Solutions gratuites actuelles, comment transférer ses fichiers vers l'adresse "www.monsite.com" grâce au FTP (File Transfer Protocol).
- Filezilla Logiciel libre permettant de se connecter à un serveur pour y déposer ses fichiers grâce au File Transfer Protocol (FTP)
Exemple commenté d'architecture de Site
Une première version d'architecture de site Web réalisée avec un tableau structurant la place des informations dans la page. Cette méthode de positionnement des informations est déconseillée, sachant qu'un tableau ne sert pas à présenter de l'information mais à proposer des VRAIS tableaux à 1 ou 2 entrées.
- Note : Il faut double-cliquer sur le fichier ".exe" que vous avez téléchargé, ce qui créera à côté de lui un repertoire contenant l'architecture de site. Dans l'architecture se trouvent plusieurs fichiers et les répertoires "img" et "style". Vous pouvez ouvrir tous les fichiers ".html" avec un éditeur de texte de votre choix (Bloc-Note sous Windows).
