Aller au contenu principal
Recette numéro 165

Recettes · Chapitre 6 · Encadrés et notes

Exemples musicaux en MEI avec un apparat critique en notes

Des blocs MEI 5 gravés dans le texte sur une portée de 5 mm, les variantes codées en app, lem et rdg, et l’apparat par mesure et par note en bas de page.

Sur cette page
Sortie
Canvas · PDF
Postext
Testé avec Postext 1.54.0
Nécessite ≥ 1.54.0 · postext-pdf ≥ 1.54.0
Licence
Mis à jour le 22 oct. 2026
Code MIT · Texte CC BY 4.0

p. 2–3 sur 5

  • Exemple en anglais : pas encore d’édition française
  • Format 156 × 234 mm
  • 1 colonne
  • Crimson Pro 11/14,5
  • Cormorant Garamond
  • Source Sans 3
  • 5 pages
  • Niveau
  • Postext 1.54.0
  • Mis en page en 24 ms
  • 145 lignes de code

En bref

Un chapitre d’une étude sur la musique médiévale. De courts passages d’un canon anglais du XIIIe siècle sont imprimés en musique dans le texte, et les notes en bas de page relèvent, mesure par mesure, où les éditions anciennes divergent.

Ce que vous allez composer

Le chapitre 3 d’une étude sur la manière dont les antiquaires anglais ont lu la musique médiévale : cinq pages de 156 × 234 mm sur Sumer is icumen in, la rota de Reading, et sur les éditeurs qui l’ont mise en partition entre 1776 et 1889. Trois passages du canon sont gravés dans le texte, en Leipzig sur une portée de 5 mm, avec la numérotation des mesures de la partition de W. S. Rockstro, et chaque commentaire appelle son apparat en bas de page : « m. 40, n. 2 la ] sol Hw, Bu ». Les notes sont brèves et serrées comme l’est un apparat, la musique occupe la justification du texte, et chaque leçon vient de l’article de Rockstro dans le Dictionary de Grove, ce que le chapitre dit dès son deuxième paragraphe.

Cette recette répond à

  • Comment donner aux exemples musicaux un apparat critique des variantes des sources en notes de bas de page ?
  • Comment faire des notes de bas de page ?

La réponse courte

script.js · lignes 36–60dans le code complet
// In the Markdown each example is a ```mei fence. A variant is encoded where it stands,
// <app><lem>…</lem><rdg source="#Hw #Bu">…</rdg></app>: the staff shows the lemma, and
// the file keeps the reading for anyone who opens the encoding. The apparatus entry is a
// footnote cited from the paragraph that discusses the bar: `[^b40]: **b. 40, n. 2** A ] G`.
const scoreStyle = {
  staffSize: mm(5), // running-text examples: 4.5–5.5 mm
  musicFont: 'Leipzig', // lighter than Bravura, close to a 19th-century plate
  textFont: 'Crimson Pro', // the underlay in the book's own face
  barNumbers: 'system', // the apparatus is keyed by bar: number every system
  spacing: 0.95,
  systemGap: mm(4),
  marginTop: pt(4),
  marginBottom: pt(LEAD / 2),
  color: col('ink'),
  minSystemsAtBreak: 2, // never leave one system of an example alone at a page foot
};
const footnotes = {
  placement: 'column', // the foot of the page in one column
  numbering: 'chapter',
  fontSize: pt(8.5),
  lineHeight: pt(10.75),
  hangingIndent: em(1.2), // turnover lines align past the number
  spaceBetween: pt(2),
  separator: { width: 0.2, lineWidth: pt(0.5), color: col('rubric') },
};

Ingrédients

Typographie
Crimson Pro, Cormorant Garamond, Source Sans 3 (SIL OFL 1.1)
Ressources
Aucune : chaque image est dessinée en code

Préparation

#1 · Écrire chaque exemple en MEI, variantes comprises

Les réglages sont dans la réponse courte ci-dessus ; la musique est dans le Markdown, un bloc ```mei par exemple. Là où deux sources divergent, la mesure contient un <app> avec la leçon retenue dans <lem> et l’autre dans <rdg source="#Hw #Bu">. Le graveur imprime le lemme : la mesure 40 de l’exemple 3.3 montre le la, et le sol de Hawkins et Burney reste dans le fichier pour qui ouvre le codage. Donnez à chaque bloc un alt dans la langue de la page : c’est ce que lisent de la partition un lecteur d’écran et le PDF balisé.

#2 · Rattacher l’apparat aux mesures que voit le lecteur

barNumbers: 'system' numérote la première mesure de chaque système, et le <measure n="37"> de chaque bloc fait partir le compte là où commence l’extrait dans l’édition suivie : l’exemple 3.3 s’ouvre donc à 37, et une note qui dit « m. 40 » renvoie à une mesure que le lecteur trouve. L’entrée d’apparat est une note de bas de page ordinaire, appelée depuis le paragraphe qui commente la mesure : lemme, crochet fermant, variante, sigles en italique. Une note ne peut pas être appelée depuis l’intérieur d’une partition ; l’appel se place donc dans la phrase qui nomme la leçon.

#3 · Dimensionner la musique pour le texte courant

Une portée de 5 mm en Leipzig tient dans une justification de 116 mm avec cinq ou six mesures à 3/2 par système, et les onze mesures de l’exemple 3.3 tiennent en deux systèmes. textFont compose les paroles en Crimson Pro, le caractère du texte, et minSystemsAtBreak: 2 empêche qu’une page se termine sur un seul système d’un exemple dont la suite passe à la page suivante. Le titre de chaque exemple est un intertitre de troisième niveau : il ne reste jamais seul en bas de page sans sa partition.

#4 · Laisser une page à notes finir court

script.js · lignes 64–78dans le code complet
const opener = {
  enabled: true,
  minHeight: mm(50), // every chapter's text starts on the same grid line
  slot: { elements: [
    { kind: 'text', id: 'kicker', content: '{attr.kicker}', ...label, fontSize: pt(8.5),
      letterSpacing: pt(1.8), color: col('rubric'), align: 'left',
      placement: at('container', 'top-left', 0, 8) },
    { kind: 'text', id: 'title', content: '{titleText}', fontFamily: 'Cormorant Garamond',
      italic: true, fontWeight: 500, fontSize: pt(29), lineHeight: 1.05, color: col('ink'),
      align: 'left', overflow: 'wrap', // design text ends in an ellipsis by default
      placement: { ...at('#kicker', 'below', 0, 3), size: { width: mm(100), height: 'auto' } } },
    { kind: 'rule', id: 'rule', direction: 'horizontal', thickness: pt(1), color: col('rubric'),
      placement: { ...at('#title', 'below', 0, 5), size: { width: mm(14) } } },
  ] },
};

L’ouverture descend le texte de 50 mm sous un titre en Cormorant italique. Plus loin, une page dont la ligne suivante entraînerait une longue note s’arrête quelques lignes plus tôt, et balancing: { maxLinesPerHeading: 1 } évite que l’équilibrage des colonnes remonte ce blanc au-dessus de l’intertitre suivant, où il passerait pour une rupture dans le raisonnement.

#5 · Le livre au verso, le chapitre au recto

script.js · lignes 82–99dans le code complet
const head = (id, content, parity, edge, x, extra = {}) => ({
  kind: 'text', id, content, parity, pages: 'body', // never on the opener
  ...label, fontSize: pt(7.5), letterSpacing: pt(1.3), color: col('muted'),
  placement: at('page', edge, x, 13), ...extra,
});
const folio = { color: col('rubric'), fontWeight: 700 };
const header = { elements: [
  head('verso-folio', '{pageNumber}', 'even', 'top-left', MARGIN.outer,
    { ...folio, align: 'left' }),
  head('verso-title', '{title}', 'even', 'top-left', MARGIN.outer + 8, { align: 'left' }),
  head('recto-title', '{chapterTitle}', 'odd', 'top-right', -(MARGIN.outer + 8),
    { align: 'right', overflow: 'ellipsis' }),
  head('recto-folio', '{pageNumber}', 'odd', 'top-right', -MARGIN.outer,
    { ...folio, align: 'right' }),
] };
// The opener carries a drop folio instead, centred under the text block.
const footer = { elements: [{ ...head('drop-folio', '{pageNumber}', 'all', 'bottom', 0,
  { ...folio, align: 'center', placement: at('page', 'bottom', 0, -11) }), pages: 'opener' }] };

Les folios en rouge de rubrique sur le bord extérieur, le livre au verso et le chapitre au recto ; pages: 'body' les retire de l’ouverture, qui reçoit un folio centré en pied.

La recette complète

Sandbox
// ═══ Postext Cookbook · Nº 165 · MEI music examples with a critical apparatus ═════
// https://postext.dev/en/cookbook/musicology-mei-apparatus
// Code: MIT · Text: original (CC BY 4.0) · Music: Sumer is icumen in, after Rockstro (PD)
// Fonts: Crimson Pro, Cormorant Garamond, Source Sans 3 (SIL OFL 1.1) · Needs postext ≥ 1.54.0
import {
  buildDocumentWithFonts, renderPageToCanvas, initMusicEngine,
} from 'https://esm.sh/postext';
import { renderToPdf, decompressWoff2 } from 'https://esm.sh/postext-pdf';

const LANG = 'en'; // @lang: the language of the sample document ('en' | 'es')
const RECIPE = 'musicology-mei-apparatus';

// ─── 1 · Design ─────────────────────────────────────────────────────────────
// #region palette: a rubric red for kickers, labels and the notes' rule; ink on cream
const palette = {
  ink: '#211d1a', // text and notation: a warm near-black
  rubric: '#8c2f1f', // the one accent, the red of the manuscript's rubrics
  muted: '#6c645b', // running heads, colophon
  rule: '#cbbfae', // hairlines
  paper: '#fcfaf6',
};
// col(id): a colour linked to its palette entry, with the entry's hex beside the id.
const col = (id) => ({ hex: palette[id], model: 'hex', paletteId: id });
const colorPalette = [
  ...Object.entries(palette).map(([id, hex]) => ({ id, name: id, value: { hex, model: 'hex' } })),
  // The engine's defaults link to main-color: point it at the accent, never the default blue.
  { id: 'main-color', name: 'accent (defaults)', value: { hex: palette.rubric, model: 'hex' } },
];
// #endregion
const MARGIN = { top: 22, bottom: 22, inner: 19, outer: 21 }; // 156 × 234 mm, mirrored
const LEAD = 14.5; // body leading in pt: the baseline grid
const at = (to, edge, x = 0, y = 0) => ({ anchor: { to, edge }, offset: { x: mm(x), y: mm(y) } });
const label = { fontFamily: 'Source Sans 3', fontWeight: 600, textTransform: 'uppercase' };

// #region answer: MEI examples engraved in the text, their apparatus in footnotes
// In the Markdown each example is a ```mei fence. A variant is encoded where it stands,
// <app><lem>…</lem><rdg source="#Hw #Bu">…</rdg></app>: the staff shows the lemma, and
// the file keeps the reading for anyone who opens the encoding. The apparatus entry is a
// footnote cited from the paragraph that discusses the bar: `[^b40]: **b. 40, n. 2** A ] G`.
const scoreStyle = {
  staffSize: mm(5), // running-text examples: 4.5–5.5 mm
  musicFont: 'Leipzig', // lighter than Bravura, close to a 19th-century plate
  textFont: 'Crimson Pro', // the underlay in the book's own face
  barNumbers: 'system', // the apparatus is keyed by bar: number every system
  spacing: 0.95,
  systemGap: mm(4),
  marginTop: pt(4),
  marginBottom: pt(LEAD / 2),

Le script.js composé s’exécute tel quel : collez-le dans le script de module de n’importe quelle page, ou ouvrez la recette sur CodePen. Dossier de la recette sur GitHub ↗ (s’ouvre dans un nouvel onglet)

Variantes

#Numéroter toutes les mesures

Un apparat chargé se suit mieux avec un numéro sur chaque mesure.

-  barNumbers: 'system', // the apparatus is keyed by bar: number every system
+  barNumbers: 'every',

#Graver les exemples en Bravura

Les têtes de note plus épaisses de Bravura s’accordent à un style de gravure sur cuivre.

-  musicFont: 'Leipzig', // lighter than Bravura, close to a 19th-century plate
+  musicFont: 'Bravura',

Erreurs fréquentes

  • MEI 5 écrit l’armure keysig="1f" sur scoreDef ou staffDef. L’attribut key.sig de MEI 4 est ignoré sans message, et le bémol disparaît.
  • Donnez à chaque staffDef son lines="5" : sans lui, notes et clés sont gravées sans portée.
  • Le graveur imprime le <lem> d’un <app>, pas le <rdg>. Une variante que le lecteur doit voir sur la page va dans la note d’apparat ou dans un second exemple.

Crédits

Texte
  • The chapter text and the apparatus notes, in English and Spanish · Ignacio Ferro · CC BY 4.0
  • Sumer is icumen in (13th century), the music examples transcribed from W. S. Rockstro's score and the readings his article reports, in A Dictionary of Music and Musicians, ed. George Grove, vol. 3, pp. 765–768, and vol. 4, pp. 1–3 (Macmillan, 1900 printing), as transcribed on Wikisource · Anonymous; William Smyth Rockstro · domaine public
  • The Latin rubric of Harley MS 978, f. 11v, and the folio, as quoted in the Wikipedia article (fact check) · Wikipedia contributors · CC BY-SA 4.0
Polices
Crimson Pro (SIL OFL 1.1) · Cormorant Garamond (SIL OFL 1.1) · Source Sans 3 (SIL OFL 1.1)
SandboxPDF