IIIF for Educators

Hands on Digitl

click to copy lesson html ...

Hands on Digitl

💡 Concept

Detail of an image from the Florentine Codex Book 12, showing the unloading of Spanish ships in New Spain

A manifest is a list. On ships, a manifest would have an entry for every passenger, crew member, and officer, as well as a detailed inventory of all cargo and livestock brought aboard and unloaded. To similarly account for global transport of digitized library and museum collections online, the IIIF movers and shakers relied upon the age's-old technique: just make a list and sort it out at the other end. A IIIF manifest is an aggregated string of media links and descriptive metadata (basic information about the media) that a source institution wants to make available to users at the end of a media item's journey from its home page.

</div>
<div id="kl_custom_block_1" class="" style="color: #000000;">

🖥️ Activity

For our 3rd installment of Unit 1 Digitl Lab Activities, we will ogle a real IIIF manifest. Then we will take hold of its handle, the Manifest URI, as some "end user" addressee of this content (a scholar, perhaps) might do, and load it into a IIIF-compatible Mirador Viewer for comparative analysis of multi-sourced worldly materiale. Penultimately, we will will try our own hand at close study and comparative detail analysis, using a custom-developed IIIF Cropping Tool, developed at Princeton University's McGraw Center. And, finally, we will reflect upon the value of such unique scholarly material, made available on site at any colegio or university in one place where it's really needed by the people who use it (and not back in the old world mouldering away in various cages, vaults, and jealously guarded websites).

👓 Example

See a real manifest! (Click to open and close)
This is just a small portion of the IIIF manifest for Volume 3 of the Digital Florentine Codex { "@context": "http://iiif.io/api/presentation/2/context.json", "@id": "https://media.getty.edu/iiif/manifest/d8a35385-d097-4306-89c0-1a15aa74e6da", "@type": "sc:Manifest", "attribution": [ "Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0)", "Biblioteca Medicea Laurenziana - Firenze" ], "description": [ "\"catalogo:\" Bibliotheca Leopoldina Laurentiana, seu Catalogus manuscriptorum qui iussu Petri Leopoldi ... in Laurentianam translati sunt quae in singulis codicibus continentur ad quodvis litteraturae genus spectantia accuratissime describuntur edita supplentur et emendantur. Angelus Maria Bandinius ... recensuit illustravit edidit. Tomus 1. [-3.]. 3: Bibliotheca Leopoldina Laurentiana, seu Catalogus manuscriptorum qui nuper in Laurentianam translati sunt. Sub auspiciis Ferdinandi 3. ... Angelus Maria Bandinius ... recensuit illustravit edidit. Tomus 3. et ultimus. Accedunt indices auctorum, quorum opera recensentur, & rerum notabilium locupletissimi {IT\\ICCU\\RAVE\\006311} 261", "Preferred Citation: Firenze, Biblioteca Medicea Laurenziana, Ms. Med. Palat. 220. Su concessione del MiBACT" ], "label": "Historia general de las cosas de nueva Espana - Vol. 3", "logo": "http://www.getty.edu/museum/media/graphics/web/logos/getty.png", "metadata": [ { "label": "Variant Title", "value": [ "Florentine Codex Vol. 3" ] }, { "label": "Author/Creator", "value": [ "Sahagún, Bernardino : de <1499-1590>" ] }, { "label": "Creation Date", "value": [ "1577" ] }, { "label": "Physical Desc.", "value": [ "cart. ; 310 x 212 mm ; 495 cc." ] }, { "label": "Language", "value": [ "spa", "nah" ] }, { "label": "Form/Genre", "value": [ "Text", "testo manoscritto" ] }, { "label": "ID/Accession No.", "value": [ "IT:FI0100_Med_Palat_220", "Med.Palat.220" ] }, { "label": "Is Part Of", "value": [ "Mediceo Palatino" ] } ], "related": "http://mss.bmlonline.it/s.aspx?Id=AWOS4CksI1A4r7GxMdb9&c=Historia%20general%20de%20las%20cosas%20de%20nueva%20Espana%20-%20Vol.%203#/book", "sequences": [ { "@id": "https://media.getty.edu/iiif/manifest/d8a35385-d097-4306-89c0-1a15aa74e6da/default", "@type": "sc:Sequence", "canvases": [ { "@id": "https://media.getty.edu/iiif/manifest/3b7ed420-903a-426f-8d0f-f9be82cc1bf9", "@type": "sc:Canvas", "height": 7430, "images": [ { "@id": "https://media.getty.edu/iiif/manifest/annotation/anno-124afceb-1051-404a-91fb-df289963b74c.json", "@type": "oa:Annotation", "motivation": "sc:painting", "on": "https://media.getty.edu/iiif/manifest/3b7ed420-903a-426f-8d0f-f9be82cc1bf9", "resource": { "@id": "https://media.getty.edu/iiif/image/124afceb-1051-404a-91fb-df289963b74c/full/full/0/default.jpg", "@type": "dctypes:Image", "format": "image/jpeg", "height": 7430, "service": { "@context": "http://iiif.io/api/image/2/context.json", "@id": "https://media.getty.edu/iiif/image/124afceb-1051-404a-91fb-df289963b74c", "profile": "http://iiif.io/api/image/2/level2.json" }, "width": 1654 } } ], "label": "Image 0001", "width": 1654 },

🧱 Materials

Manifests are made available on web pages, with links called manifest URLs. You don’t need to click the links, open the pages, or view the manifests. All you need to do is copy the manifest URL, and paste it into IIIF tools to access content. Below are the respective IIIF manifest URLs for each book of The Florentine Codex, from the Bibiloteca Laurenziana.

Books 1-5

https://media.getty.edu/iiif/manifest/ae8c3376-f8d6-447b-90a9-9c67b4cbe4d1

Books 6-9

https://media.getty.edu/iiif/manifest/3fa03fbc-a8c8-489e-83a5-1efc2d55fe5b

Books 10-12

https://media.getty.edu/iiif/manifest/d8a35385-d097-4306-89c0-1a15aa74e6da

🛠️ Tools

Mirador
Use this tool to view IIIF item and collections manifests in one place for comparative study  (click to open and close)
IIIF Cropping Tool
Use this tool to find the URI for an image in a IIIF manifest, and to crop a detail from that image  (click to open and close)

🪜 Steps

Comparative viewing in Mirador
Read the following steps through, and then proceed one at a time through the activity. (click to open and close)
  1. Copy a IIIF manifest URL
  2. Click the +START HERE button in the upper left
  3. Then click the +ADD RESOURCE button on the lower right (the page may jump down a bit)
  4. Paste the manifest URL in the Resource location blank and click ADD. The item should load and display an item bar
  5. Click the item bar to load the item in the viewer
  6. For comparative viewing, repeat this process with another resource. You can do this multiple times
  7. Zoom in and out, click through pages, and acclimate yourself to the many viewing settings, including thumbnail, single page, etc.
Selecting and Cropping a IIIF image
To access an image URL (click to open and close)
  1. Copy and paste the IIIF manifest URL in the IIIF Cropping Tool
  2. Scroll through thumbnails on the left to find a page
  3. Click the page thumbnail to load in the viewer
  4. Zoom and view
  5. If you would like the full image URL, click Copy 
  6. To crop a detail from the image, click the white pencil icon, and highlight the desired rectangle by clicking and dragging a rectangle from corner to corner
  7. A thumbnail of your selected detail will appear in a slider at the bottom of the Cropping Tool. You can repeat to collect multiple details.
  8. Click the Copy icon Copy icon on the detail thumbnail for use in your assignment submission
Posting with an image
To add linked images to a discussion post (click to open and close)
  1. Click Reply
  2. Paste the image into the text field. 
  3. Add text and submit your reply
  4. The image will automatically link to the full item loaded into a Mirador viewer

✉️ Share

Share a selection of 2 or more image details from at least 2 different IIIF item manifests that you feel have some relationship to each other (e.g. similarity, difference, type of thing, etc. Write a brief post explaining your choices, and provide a little context about the items from which they derived.

  • Note that the Image Cropping Tool makes the same kinds of changes to an image URL that you did manually in the previous Lab Activity: how was the experience informed by your understanding of how linked IIIF imagery is structured?
  • Comment on the experience of deep zooming into an item to explore details: what did you see that you might not see at typical resolutions found in images optimized for websites?

Hint: for item information, look at their descriptions and metadata in the left side menu in Mirador

🤝 Collaborate

After you have posted, review posts by your peers and leave a comment if you'd like

</div>

</div>

copyright 2026