Building your own HTML poster

A tutorial on using this template to make your own posters

Clément Pit-Claudela
aMIT CSAIL
Unpublished,

Abstract

Measuring the density of the intergalactic medium using quasar sightlines in the epoch of reionization is challenging due to the saturation of Lyman-α absorption. Near a luminous quasar, however, the enhanced radiation creates a proximity zone observable in the quasar spectra where the Lyman-α absorption is not saturated. In this study, we use 10 high-resolution (R ~ 10,000) z\(\sim\) 6 quasar spectra from the extended XQR-30 sample to measure the density field in the quasar proximity zones for the first time. We find a variety of environments within 3 pMpc distance from the quasars.

Introduction: Quasar Proximity Zones

There are two ways to use this template: directly editing the HTML, and using Jinja2 templates.

Editing the HTML directly

This is the simplest way to get started, since it just requires a text editor:

  1. Download the latest release of this template (or download the webpage and the corresponding stylesheet directly from the repository).
  2. Adjust the metadata and add blocks to the main section.
An orange shield with a white 5 emblazoned on it and the letters HTML above it.
The HTML5 logo (Source: W3C)

Figures

Use the following code to insert a figure:

<figure>
  Figure contents:
    images (<img>, <object>),
    tables (<table>),
    quotes, …
  <figcaption>Figure caption</figcaption>
</figure>

An orange shield with a white 5 emblazoned on it and the letters HTML above it.
The HTML5 logo (Source: W3C)

Images

Use the following code to include an image:

<img src="source url"
     alt="image description">

Prefer scalable images (SVG) for technical drawings and figures.

Most technical drawing software supports saving as SVG; if yours does not, you can typically save to PDF, which can then easily be converted to SVG (this is useful for TikZ diagrams in particular).

Make sure to include an alt attribute: it will be read by assistive technology and displayed while the image is loading

Poster layout

Posters made using this template are composed of a sequence of blocks. You can use CSS to customize the way the blocks are designed; by default they scroll left to right on wide screens and top to bottom on narrow screens.

Try resizing your browser to see how the poster's layout changes.
Project logo
A stand-alone figure to fill the remaining space.