Lunaweb, une réflexion sur la création web et le marketing Internet

Archive pour le mot-clef ‘typographie’

Coup de chapeau

Par le
No Gravatar

Agence LunaWeb aime Picourt-Cabis et Blancrème

Une fois n’est pas coutume, aujourd’hui ce n’est pas un billet défrichant pour vous les entrelacs de la galaxie Web, mais un coup de chapeau que je souhaiter tirer publiquement aux guerriers de la LunaTeam.

Nous venons en effet de mettre coup-sur-coup, en l’espace de… deux jours ouvrés, deux sites Internet qui nous ont donné beaucoup de plaisir à concevoir et développer : Picourt-Cabis et Blancrème.
Vous aurez sûrement l’occasion d’en savoir plus sur la genèse de ces projets via des études de cas ad-hoc (découvrez les précédents cas clients LunaWeb) ; mais en attendant, voici un petit zoom rapide sur ces deux projets.

Lire le reste de cet article »

La typographie pour le web

Par le
No Gravatar

Le Web est un média naissant, l’information qu’il véhicule est transmise par des caractères et des images, animées ou pas. La typographie pour le Web a longtemps été LE parent pauvre du www, quelle misère de devoir composer avec les fameuses 11 polices compatibles !

Table de typographie du 9ème siècle

Non, ce n'est pas la première version du Comic Sans MS

On devait alors composer avec le peu de variété à notre disposition (bon alors pour ce site, Arial ou Verdana ? Youhou !), ou passer les titrages en mode image pour éviter d’avoir une mise en scène proche du traitement de texte. Et donc alourdir le poids de la page, perdre l’accessibilité du texte, et faire reculer le référencement naturel.

Mais c’est fini ! Réduite initialement à un rôle purement pratique (juste pour lire du texte), la typo reprend ses lettres de noblesse sur le Web, et devient enfin un vrai vecteur de communication et d’identification du locuteur.

Lire le reste de cet article »

Cette semaine chez LunaWeb #26

Par le
No Gravatar

Cette semaine, chez LunaWeb, nous avons…

  • confectionné avec amour ce petit goodies pour les luna-fans (si si, ça existe) et qui préfigure (peut-être) l’orientation graphique de la carte de vœux de fin d’année… qui sait !
  • testé Markup, outil plutôt « fun » qui permet de dessiner sur des pages web en ligne et de les annoter.
  • lu avec beaucoup d’attention l’article Want to See the Future of Mobile Web Apps? Just Watch Google décrivant comment Google fait preuve d’outsider sur le terrain de l’ergonomie des applications mobiles riches. Dommage qu’ils fassent moins attention au design.
  • rêvé de nous procurer une ardoise tactile (parodie de l’iPad réalisée par Péoléo).
  • participé à la discussion sur @font-face : licences, rendu sous les différents navigateurs… de nombreux points abordés sur ce nouveau blog sur la typographie.
  • fêté les 6 premiers mois d’existence de la LunaWeek, cet article collectif hebdomadaire que, nous le savons, vous attendez de découvrir avec impatience chaque vendredi sur le présent blog.
  • souhaité un chaleureux good luck & good bye à Antoine qui, après un passage enrichissant et fort sympathique par la case LunaWeb, continue son petit bonhomme de chemin professionnel vers d’autres horizons 2.0. Toute l’équipe lui souhaite plein de bonnes choses !

Bon week-end, et à la semaine prochaine !

Notre ascension au second étage, un test de page en HTML5

Par le
No Gravatar

Les spécifications html5 ne sont toujours pas arrêtées et je voulais quand même y toucher « pour voir ». Malheureusement « coder pour coder », ce n’est pas mon dada. J’avais envie de raconter une histoire et de me servir des nouveaux éléments pour leur apport sémantique dans un contexte appliqué.

Récemment nous avons déménagé au 2è étage du 24 bis Rue Maréchal Joffre. C’est une nouvelle expérience pour toute l’agence. La bonne aubaine : ma première page HTML5 est donc un article qui raconte en quelques paragraphes les bienfaits de notre déménagement sur notre cadre de travail.

J’ai découvert des choses vraiment intéressantes en codant cette page. Le HTML5 me semble être un grand pas en avant vers un langage très adapté au web d’aujourd’hui d’un point de vue sémantique. J’espère que le HTML5 règlera certaines maladies des intégrateurs, notamment la divite ou la spanite aigüe, étant donnée la quantité d’éléments bientôt à notre disposition. D’ailleurs je vous laisse découvrir cela dans la source de l’article.

Notez que j’ai aussi utilisé Cùfon, un moteur de remplacement de texte en son équivalent image (futé pour se permettre certaines fontes non-standards dans une page web). Nous l’utiliserons probablement dans le catalogue produit de l’un de nos clients, qui devra être traduit dans plus de 5 langues (cela nous évitera de refaire toutes les images).

Lire l’article : Notre ascension au second étage

Pour les commentaires, je vous invite à les déposer en bas de l’article lié.

101 astuces sur les formulaires PDF

Par le
No Gravatar

icone PDFTed Padova, le pape du PDF et auteur de l’Acrobat Bible, publie son 101 PDF Forms Tips, un document de 55 pages qui regorge d’astuces et de clefs pour créer des formulaires en Portable Document Format convenables.

Depuis la conception du document jusqu’à l’ajout de scripts spécialisés (en Javascript), l’auteur analyse et donne des exemples en fonctionnement de formulaires simples comme évolués.

» Télécharger 101 PDF Forms Tips.

Urbanfonts, bibliothèque de polices gratuite et collaborative

Par le
No Gravatar

Urbanfonts, bibliothèque de polices gratuite et collaborativeS’il est bien des sujets il est compliqué de débattre, c’est bien celui de l’achat des polices.
Je ne vais ici entrer dans le combat pour ou contre l’achat de polices, mais l’initiative d’Urbanfonts est à saluer pour ceux qui (comme nous) n’ont pas toujours les moyens d’acheter la fonte à 500$ qui va bien, et qui n’avons pas toujours l’usage des fontes très abouties techniquement.

Cela ne m’empêche pas de penser que -comme pour tout le reste- le gratuit n’a de raison d’exister que parce qu’il y a du payant à côté, et qu’un bon typographe est une personne qui vit de sa création, qu’on doit donc rémunérer à juste titre.

Lire le reste de cet article »

Une police vraiment petite : Munro, au pixel près !

Par le
No Gravatar

police pixel MunroEd Merritt, un excellent web designer passionné pour la typographie, publie la police Munro, et exauce par la même un voeux secret : disposer d’une police Mac minuscule, de la taille des choses qui sont si lisibles sur Flash (grâce aux fameuses FFF, les Fonts For Flash) mais qui sont ridiculement crades lorsqu’on commence à attaquer les tailles 7/8 points sur Photoshop.

Lire le reste de cet article »

Evaneckard : le design et l’ergonomie réunies

Par le
No Gravatar

evaneckardUne fois n’est pas coutume, je vous propose aujourd’hui de faire la critique d’un site que j’ai récemment découvert, que je trouve exemplaire à bien des égards, et que je vous propose de commenter : www.evaneckard.com.

Lire le reste de cet article »

Améliorer l’accessibilité Web par la typographie

Par le
No Gravatar

Améliorer l'accessibilité Web par la typographieExcellent article de Joe Dolson et relayé par Pompage.net pour sa version anglaise. Il aborde le thème de l’accessibilité du contenu d’un site Web vu par le prisme de la typographie.

On balaie la taille des polices, l’interlignage, le choix des typo, l’alignement des paragraphes d’un texte ainsi que l’espacement des lettres. L’accès universel et aisé à un texte est en effet d’abord conditionné par la lisibilité d’un texte, il faut donc avant toute chose soigner en particulier la perception de votre contenu auprès d’un public de lecteurs qui ne sont pas tous à 10/10 d’acuité visuelle, ni équipé des meilleurs écrans du marché…

Je laisse la parole à l’auteur pour la conclusion :

Les éléments à prendre en compte dans la typographie pour Internet sont les mêmes que pour les autres médias, c’est la manière d’utiliser les ressources qui change, afin de s’adapter aux visiteurs. L’absence de contrôle sur de nombreux éléments oblige les webdesigners à réfléchir à d’autres façons d’optimiser les moyens à leur disposition. Il ne suffit pas de s’en tenir à un modèle spécifique, il existe trop d’impondérables. Il vaut mieux au contraire savoir dans quelle mesure les préférences de l’utilisateur peuvent avoir un impact sur vos choix typographiques et éviter les situations risquant de rendre le texte illisible.

» lire l’article Améliorer l’accessibilité Web par la typographie

Structurer le design Web selon le principe de la grille

Par le
No Gravatar

Excellent article paru (encore eux!) sur Alistapart, cette fois-ci écrit par Wilson Miner, et traitant de l’usage strict des repères d’une grille à l’heure de composer et de coder une page Web.
Au delà de la simple grille de lecture d’une page Web, il s’agit d’appliquer des principes simple de composition, mais aussi de programmation xHTML/CSS d’une page. L’auteur s’intéresse notamment à la maîtrise des alignements et espacements verticaux des éléments typographiques d’une page Web. Voici un aperçu des principaux enseignements de cet article.

Lire le reste de cet article »

↑ Haut de page