>Why Developing For The Web

> Most of the times you read something, is on your computer screen, more often than not, in your browser.

\ Otho Mantegazza _ Dataviz for Scientists _ Part 5.0

Quarto for The Web

We have learned that one of the best output of Quarto is a web page.

Quarto for The Web

Quarto for The Web

Why Outputs For The Browser

  • Free and open source.
  • Best and most complete graphic tool available.
    • Full set of typographical tools.
    • Vector organization of shapes in space.
    • Transitions.
    • Interaction.

Why Outputs For The Browser

Combination of elegant and consolidated open standards:

  • HTML Text markup
  • CSS Style (fonts, colors, pagination)
  • JS Program in the browser

Program in The Browser

With Javascript you can run code on the front end.

This means that you can build data visualization directly on the reader’s device:

It scales better, looks better, interacts better.

But it takes a lot of code to build a good data visualization with Javascript.

Let’s try.

Exercise

Use Javascript to change the content of this slides:

  1. Open the browser javascript console.

  2. Make a new variable that stores the string “Ciao!”.

var newContent = "Ciao!"
  1. Select the content of this page, and change it to what’s stored in newContent.
document.getElementById('exercise').innerHTML = newContent

The content of the page was changed only on your device. If you reload it you’ll get the original content back.