Centrer Jonathan

Poursuite de l'auto-apprentissage de CityDesk v 2.0 et de quelques notions basiques de HTML/CSS.

Liens Centrés - 05/08/04

 Content de revoir Mark Newhouse revenir écrire sur Real World Style... Son dernier article traite du centrage des liens. La partie intéressante n'est pas le fait de pouvoir centrer une boîte, mais plus de revenir sur l'une des techniques qu'il avait développée (traduite ici) sur son article 7-10 Split appliquée à une liste de définition pour se débarrasser d'une mise en page avec tableau présentée sur un lien original. Lire une traduction de l'article

Les nouvelles de FractalCity - 03/08/04

 Reprise de l'activité sur le FractalCity. Bonne occasion pour replonger dans la littérature et réviser quelques fondamentaux. De nombreuses pages sont désormais déposées pour amorcer le wiki compagnon. Les pages wiki restent naturellement à compléter et ouvertes à tous vos commentaires. Aujourd'hui, traduction d'un article sur l'écriture efficace de CSS signé de  Holly Bergevin : Comment écrire des feuilles de style efficaces.

Ce Weblog redémarre avec un WikiSupport - 03/06/04

 Quelques interrogations récentes sur l'évaluation de CityDesk par un gros producteur de sites web ouvert aux standards pourrait m'amener à reprendre quelques exercices ici. Et après les explorations des wikis je compte aussi poser quelques liens sur un wiki autonome appelé CityDesk et Design Standards sur lequel vous pouvez même participer en éditant les pages. Je tenterai de rendre compte des avancées sur ce site.

Projet 12 Eric Meyer - Spirale Complexe - 25/02/03

 Désolé mais cet exercice est plutôt personnel. La traduction pourrait vous éclairer sur 3 lignes de code traitant des images d'arrière-plan mal fixées dans Internet Explorer pour Windows. Eric Meyer est en pleine forme et pousse dans cette conception de page les CSS1 à ses limites maximales. Cette page devrait être consultée pour bien faire dans un navigateur conforme aux standards du Web. A moins qu'un petit script puisse permettre de pallier les défauts du navigateur de Microsoft Windows ? . La "viande CSS" sera à dénicher dans les 3 dernières lignes de code de la feuille de style ;) [Une traduction en cours d'un article extraordinaire du gourou des CSS - Voir la mise en page]

Mark Newhouse iBlog - 17/02/03

 A la recherche de gabarits pour construire un carnet Web sur CityDesk ? Mark Newhouse a un iBlog très riche en subtilités pour intégrer une photo qui pourrait renvoyer sur un moblog ? Voir l'adaptation en français réalisée sur le CityDesk. Un simple script pour lister les teasers des articles. Et le “plink” traduit par un “+” pourrait vous inspirer pour ébaucher une maquette originale où vous remplacerez vos photos.

Karim Belkacem - 14/02/03

 Karim est réputé pour la taille de squelettes pour SPIP et s'approche des standards du Web :)... Vous le retrouverez sur son portail Glums où je vous invite à visiter sa nouvelle page conçue pour être lue sur un i-mode ! La page fait 4 ko.

A quoi ressemble Stephane Gigandet ? - 25/01/03

 Suite à une demande de Stephane Gigandet (Niutopia), envoi d'une photo cachée derrière une CSS pour des raisons évidentes de protection des droits. Pour voir la photo de Stephane, il vous suffit de déshabiller la page ;-)

Un Tabouret à Trois Pieds - 14/01/03

 Traduction en cours recherche relecteur pour un plein de ressources XHTML, CSS, l'Accessibilité et le DOM pour ficeler l'ensemble. Mark Newhouse signe là  un superbe article de synthèse sur les 3 trépieds du Web.

Trouver des Polices pour Unix - 14/01/03

 De l'ordre d'apparition des polices dans la Feuille de Style pour penser aux butineurs Unix avec de grands écrans à haute résolution. Un article de Mark Newhouse.

7-10 Split - 07/01/03

 Pour éclater les éléments à gauche et à droite. Mark Newhouse

Une carte postale à imprimer ? - 30/12/02

 Eric Meyer propose une feuille pour les cartes postales. Une seule astuce à connaître : ajouter 4 pixels à la largeur de votre image dans la feuille de style. Ici une tentative sur une conception originale de Karl. [Voir l'essai]

Bryan Bell - 12/12/02

 Bryan Bell s'est construit une belle notoriété à concevoir des gabarits pour la gamme des outils Userland. Il est en outre très facile de les adapter pour le CityDesk ou d'autres outils. Stephane travaille aussi dessus pour les jouebs. On attend des Bryan Bell en France : à savoir des peintres du web prêts à mettre (une partie de) leurs talents à disposition de tous pour adaptation ?

Effets Média - 04/12/02

 Si vous avez déjà essayé de prendre une conception Web et essayé de l'imprimer, vous avez sans doute été découragé. Entre les limites des navigateurs et les problèmes inhérents aux essais pour imprimer une conception compliquée, la version papier ne ressemble jamais à ce vous attendez. Quelques sites produisent même des versions différentes des articles, les reliant à une accroche "Version pour impression". Désormais les CSS vous offrent de concevoir un document pour différents médias, vous affranchissant du besoin de recréer une page simplement pour vos besoins d'impression. Eric A. Meyer, auteur de Cascading Style Sheets: The Definitive Guide, vous montre comment. Tous les modèles de ce document sont disponibles sur le site compagnon : http://www.ericmeyeroncss.com/projects/06/)

Linkaboo [Eric Meyer] - 28/11/02

 Le projet n°10 d'Eric Meyer sur les CSS est un monument d'astuces. Parvenir à faire prendre une courbe à un logo. Pas forcément étonnant à première apparence, j'ai bien l'impression que le code proposé pourrait ouvrir de belles voies aux WebDesigners accros à PhotoShop. [en savoir plus]

Lister tous les articles à droite et à gauche de l'article - 27/11/02

 Via le projet 09 d'Eric Meyer on CSS [en savoir plus]

Moments Energie - 12/11/02

 Ici le projet n°4 sur un design original d'Eric Meyer qui tombe bien à propos si vous êtes dirigeant d'une entreprise ou consultant en énergies. Les hyperliens peuvent s'allumer avec quelques petits trucs à intégrer dans la feuille de style. [Voir un exemple d'hyperliens vivants].

Menu Dynamique - 06/11/02

 Un des points les plus critiques concerne les menus dynamiques. Eric Meyer, sur son CSS/Edge avait défriché le terrain des menus sous forme de listes, mais ça n'était qu'une approche expérimentale. Dave, de Gazingus.org, a poussé plus loin le concept en le rendant utilisable au quotidien. En voici le cahier des charges..." [source : tristan nitot] [lire l'article que j'étudierai plus tard]

Communiqué de Presse - 05/11/02

 Intention : construire une feuille de style pour un modèle de communiqué de presse... sur le modèle d'Eric Meyer (Projet 2)

Un Tutoriel en Français sur les CSS - 22/10/02

 Un tutoriel CSS en français.

Eric Meyer on CSS. Carnet de Voyages ?  - 19/10/02

 Premier essai de travail sur le chapitre 01 du livre d'Eric Meyer - Mastering The Language of Web Design...

Conception Web Liquide - 18/10/02

 Nick Finck: Il existe une règle non parlée en impression qui détermine que le texte ne devrait pas excéder 4 pouces en largeur sur une page. Tout texte inférieur à 4 pouces est plus lisible que n'importe quel texte déplassant les 4 pouces — the reader's whiplash will speak for itself.” [Autorisation de l'auteur en cours - Article en cours de traduction]

Listes à Puces - 18/10/02

 Mark Newhouse dompte les listes à puce. Un article pur maîtriser des menus très légers tout en CSS. [Traduction en cours]

Bidouillage de Boîtes - 15/09/02

 "Un casse-tête pour moi... Niveau WebDesign Débutant : aligner une barre bleue avec une largeur de colonne. (Via BoxModelHack). Adaptation libre pour un auto-apprentissage de quelques subtilités de CSS. La photo ajoutée fait 299 pixels de large. Et la colonne 300 px. Quelques différences d'affichage peuvent exister selon votre modèle de navigateur. A l'aide." xtof

Regard Vers le Futur - 14/09/02

 Regard vers le Futur. Un article de Mark Newhouse publié dans Digital Web Magazine à propos des Feuilles de Style (Promesses, Réalités, Regard vers le Futur)"

Impression Ecran OmniwebMac - 12/09/02

 Premier essai de la Feuille de Style d'Eric meyer vue par un navigateur comme OmniWeb (Macintosh) Voir l'amputation des effets spéciaux

Changer de Style - 11/09/02

 "Un gabarit produit par FogCreek pour changer de Style. Qui ouvre droit vers les merveilles des Feuilles de Style habilement promues par Eric Meyer. Essayez le gabarit sélecteur. Urgence de toucher aux paramètres des CSS pour y intégrer... Votre nom ? Un oiseau ? etc.. Le fichier à télécharger est compressé à un taux de 91% et pèse 41ko. Mais après je risque de décrocher sur la conception. Le WebDesign n'est pas mon métier." Bienvenue aux peintres du Web

Ponctuation Marginale - 30/08/02

 "Un des usages les plus puissants des CSS est de contrôler la typographie de votre document. Des choix de polices jusqu'aux titres, espacement de mot et des lettres, l'utilisation d'une feuille de style vous offre beaucoup plus de contrôle sur le rendu de votre page dans un navigateur, sans recourir à de hideux "hacks" qui détruisent la structure de votre page et souvent son accessibilité." Un nouvel article de Mark sur la Ponctuation Marginale. Merci à Dolores pour ton aide; l'article peut être lu si vous devenez maniaque de l'alignement à gauche d'un paragraphe démarrant avec un guillemet ;-) ...

Assiette pour récolter des grammes d'or... - 28/08/02

 Essais de monétique pour récolter des grammes d'or.

AIDE CSS - 22/08/02

 Une balise bien pratique. Ne pas en abuser. Exercice facile à mettre en oeuvre pour faire apparaître des petites bulles dans les mots compliqués ?

Style Environnemental - 22/08/02

 Un article sur la défense de l'environnement numérique :)) ou comment structurer proprement une CSS par Mark Newhouse.

CityDesk n'est pas une Machine à Ecrire - 22/08/02

 Caractères spéciaux pour "culotter" votre CityDesk et avoir de jolis guillemets. Voir l'astuce

Menu Dynamique par Adriann - 22/08/02

 Intégrer un menu dynamique dans CityDesk par Adriaan

"Culottez votre CityDesk" ? - 22/08/02

 Comment je manipule les DocType dans CD... parce que les standards semblent vouloir nous emmener vers le XHTML2. ?

Formulaires Sans Tableaux - 06/08/02

 Pour les maniaques du coupon ;-)

Un gabarit 2 Colonnes sans tableau qui fonctionne dans Netscape 4. - 06/08/02

 Avec utilisation des balises dl (liste définitions), dt (terme de définition) et dd (définition correspondant à un terme de définition)

3 Colonnes sur Netscape 4 sans tableau - 06/08/02

 Un vieil exercice réalisé à l'époque avec l'aide de Pascale...mais qui présente ici un intérêt évident si vos lecteurs sont équipés de vieux navigateurs comme Netscape 4.XXX.

Essai Masque RealWorldStyle - 06/08/02

 Comment vous dire ? cet exercice d'adaptation de la feuille de style dans un masque CityDesk m'empoisonne la vie ? La même feuille est appelée : d'un côté ça fonctionne et pas de l'autre. Le contenu manque de centrage sur la page. [L'oiseau reste décentrée dans le masque en attendant mieux]

Création d'un hypertexte contextuel - 27/07/02

 

Une fonction assez géniale et peu usitée sur la Toile. Pratique pour les barres de menu où l'espace disponible est rare. L'avant-clic pour prévenir le visiteur que le fichier pourrait peser 8 Mo... Et à cette heure le lien est valide HTML. J'aimerais bien en parler à un ergonome. Pourrait remplacer les notes de bas de page ?

 Attention... Karl (w3c) laisse entendre que cet exercice "réinvente la roue". La balise "title" fait déjà le travail. Et si vous utilisez cette fonction, la page devient confuse dans un navigateur comme Lynx. Merci de ne pas cliquer au dessus. [Pour en savoir plus sur la réponse de Karl à propos de cet exercice]

Permutation d'Images - 22/07/02

 3 boutons survolés...

Menu Intelligent - 22/07/02

 Le même exercice que précédemment mais en plus intéressant. Pour savoir dans quelle section vous vous trouvez (voir le lien de référence)

Configurer les CSS... - 22/07/02

 en fonction du système d'exploitation du visiteur (Javascript)

En tête et Pied de Page Dynamique - 22/07/02

 Si vous utilisez CityDesk inutile d'ouvrir ce lien ;-)

Création d'une Barre Latérale - 22/07/02

 Chapitre 22 page 379 - Créer l'image d'une fine bande de la largeur de la barre latérale et utiliser la propriété "repeat-y" pour itérer l'image de la barre latérale vers le bas du côté gauche. Une technique offrant un gain notable de temps d'affichage de la page (légèreté de l'image) [Voir l'exemple de Jason Cranford Teague]

WebDesign par Jeremy Carlson - 22/07/02

 Jeremy Carlson a du talent. En parcourant son site, je découvre qu'il est free-lance à Seattle. J'aimerais bien travailler avec lui pour lui sous-traiter de la conception de quelques jolis masques. Ses pages pourraient s'accommoder avec CityDesk. En attente de réponse...  [Voir l'adaptation dégradée dans CityDesk]

Menu Hiérarchique et Menu Coulissant - 21/07/02

 Menu Hiérarchique qui se déploie...