Code utilisé pour les démonstrations de ma conférence sur la Microtypographie pour Paris Web 2021

Overview

📖 Microtypographie - Exemples de fixers

Dans le cadre de ma conférence sur la microtypographie pour Paris Web 2021, je vous propose ce petit projet, à destination de vos développeurs, qui a pour ambition de comparer quelques outils qui pourraient vous aider à améliorer la lecture sur votre site Web.

Il s'agit d'un petit site développé avec Symfony, à faire tourner en local afin de tester ces outils sur différentes pages web.

Vous trouverez également mes slides aux formats OpenDocument, PowerPoint et PDF dans le dossier img.

Installation

prérequis

Avoir Composer et Symfony CLI (pour utiliser le serveur web intégré, mais un autre serveur web comme NGINX ou Apache peut être utilisé) installés.

étapes

  • Cloner ce repo
  • Installer les packages avec Composer : composer install
  • Démarrer le serveur symfony server:start (ou via tout autre serveur web)
  • Se rendre sur l'une des URLs suivantes :

Pour tester JoliTypo : http://localhost:8000/jolitypo

Pour tester PHP-Typography : http://localhost:8000/php-typography

Pour tester Smartypants et son extension, Typgrapher : http://localhost:8000/smartypants http://localhost:8000/smartypants-typographer

Pour tester Typography Fixer : http://localhost:8000/typography-fixer

Pour tester Twig Typography : http://localhost:8000/twig-typography

Utilisation

Le fichier texte situé sous /public/base.txt contient du texte à tester. Il peut contenir du HTML, du texte brut, tout ce que vous voulez tester ! Je vous invite à le modifier selon vos besoins.

Rendez vous ensuite sur les urls dédiées aux différents fixers pour voir le résultat.Une page de ce type va s'afficher :

Capture d'écran

(Les colonnes sont volontairement étroites afin de tester l'hyphénisation sur les titres.)

En haut à gauche : le texte brut tel que vous le voyez dans le fichier base.txt

En haut à droite : le texte brut, non interprété par le navigateur, une fois corrigé par le fixer. Cela permet une visibilité sur les entités HTML utilisées par exemple.

En bas à gauche : le texte original tel qu'interprété par le navigateur.

En bas à droite : Le texte modifié par le fixer et interprété par le navigateur.

You might also like...
A dumb sharing site for photos and videos, made by me, using a bit of borrowed code.
A dumb sharing site for photos and videos, made by me, using a bit of borrowed code.

ShitShare A dumb sharing site for photos and videos, made by me, using a bit of borrowed code. Information This was made on Windows, so when video upl

The source code to Charlie’s old website.
The source code to Charlie’s old website.

About This is the source code to my website built with the Laravel framework. Set-up Simply clone this repository, install composer and node dependenc

LaravelSnippets.com website | A repository of useful code snippets for Laravel PHP framework

LaravelSnippets.com website | A repository of useful code snippets for Laravel PHP framework. Submit, grab and share!

The source code for the Laravel Tricks website

Laravel-Tricks Laravel-Tricks is now under the ownership of Tighten, and all development is taking place under a private repo until we can extract som

Core code of NumberNine CMS
Core code of NumberNine CMS

Introduction NumberNine is a CMS for building websites and web applications with Symfony. While generic enough to meet standard websites requirements,

This repository contains source code of my personal portfolio at naurislinde.com

The source code of naurislinde.com This repository contains source code of my personal portfolio at naurislinde.com Getting Started These instructions

A field for editing code in the SilverStripe CMS using Ace Editor
A field for editing code in the SilverStripe CMS using Ace Editor

SilverStripe CodeEditorField This module adds a CodeEditorField that uses Ace Editor (http://ace.c9.io/) to let you edit code (mostly HTML or JavaScri

A web interface for MySQL and MariaDB

phpMyAdmin A web interface for MySQL and MariaDB. https://www.phpmyadmin.net/ Code status Download You can get the newest release at https://www.phpmy

Simple web interface to manage Redis databases.

phpRedisAdmin phpRedisAdmin is a simple web interface to manage Redis databases. It is released under the Creative Commons Attribution 3.0 license. Th

Owner
Marion Hurteau
Marion Hurteau
Pengembangan website OSIS SMAN 17 Kabupaten Tangerang, dimulai dari tanggal 14 februari 2021

CodeIgniter 4 Application Starter What is CodeIgniter? CodeIgniter is a PHP full-stack web framework that is light, fast, flexible and secure. More in

enggar abin 0 Dec 25, 2021
Un plugin SPIP pour retrouver une langue française naturellement inclusive

SPIP en français inclusif classique Un plugin SPIP pour retrouver une langue française naturellement inclusive Objectif Nous sommes profondément attac

Jacques Pyrat 3 Nov 15, 2021
TinyFileManager is web based file manager and it is a simple, fast and small file manager with a single file, multi-language ready web application

TinyFileManager is web based file manager and it is a simple, fast and small file manager with a single file, multi-language ready web application for storing, uploading, editing and managing files and folders online via web browser. The Application runs on PHP 5.5+, It allows the creation of multiple users and each user can have its own directory and a build-in support for managing text files with cloud9 IDE and it supports syntax highlighting for over 150+ languages and over 35+ themes.

Prasath Mani 3.5k Jan 7, 2023
Kyle is a web application built with Laravel for web developers and small companies to efficiently track and stay on top of yearly expenses related to services

Kyle Kyle is a web application built with Laravel for web developers and small companies to efficiently track and stay on top of yearly expenses relat

Laravelista 36 Jul 15, 2022
Unified sample web app. The easy way to learn web frameworks.

Notejam The easy way to learn web frameworks Do you know framework X and want to try framework Y? The easy way to start with a new framework is to com

Sergey Komar 1.1k Dec 21, 2022
Damn Vulnerable Web Application (DVWA) is a PHP/MySQL web application that is damn vulnerable.

Damn Vulnerable Web Application (DVWA) is a PHP/MySQL web application that is damn vulnerable. Its main goal is to be an aid for security professionals to test their skills and tools in a legal environment, help web developers better understand the processes of securing web applications and to aid both students & teachers to learn about web application security in a controlled class room environment.

Robin Wood 7k Jan 5, 2023
Source code of Strm.pl, brand-new social service.

Strimoid Source code of Strm.pl, brand-new social service.

Strimoid 67 Oct 20, 2022
Um modelo de loja virtual utilizando HTML, CSS, JS, Bootstrap e PHP, utilizando ferramentas de edição de texto (VS Code), Edição de imagens (Adobe photoshop) e de vetorização (Adobe Illustrator).

Loja virtual fictícia Um modelo de loja virtual utilizando HTML, CSS, JS, Bootstrap e PHP, utilizando ferramentas de edição de texto (VS Code), Edição

Emily Leme 2 Sep 8, 2021
This is the source code to my website built with the Laravel framework.

About This is the source code to my website built with the Laravel framework. Set-up Simply clone this repository, install composer and node dependenc

Octanna 6 Dec 29, 2021
Infopanel is a simple tool getting some information from source. It works basically like a slider that shows only title, image, a little bit description and QR-Code for links.

Infopanel is a simple tool getting some information from source. It works basically like a slider that shows only title, image, a little bit description and QR-Code for links. It has its own GUI for the editing. The GUI provides a very simple role concept. This tool can be used for digital signage, Information panels, News or Events or similar.

null 4 Aug 22, 2022