feat(why): convert to slides, remove autopreview

Author: amyheather

_quarto.yml

@@ -48,6 +48,4 @@ format:
       - cosmo
       - styles/theme.scss
     css:
-      - styles/styles.css
-    include-after-body:
-      - styles/autopreview.html
+      - styles/styles.css

images/examples_page_screenshot.png

@@ -1,141 +1,249 @@
 ---
 title: Why make a website for your research?
-format: 
-  html:
-    page-layout: full
+format:
+  revealjs:
+    theme: simple
+    slide-number: true
+    preview-links: false
 ---
 
-Quarto lets you create free, professional websites. This page explains why researchers use them and the kinds of things you can make.
+## This workshop
 
-## Your research project
+In this workshop, we're going to teach you how to use **Quarto** to create websites.
 
-Research tends to accumulate across many different places - Word documents, PDFs, data files, presentations, emails, code repositories. It can be hard for collaborators to find things, and nearly impossible for anyone outside the project to navigate. Much of it stays hidden.
+. . .
 
-A Quarto website can bring everything together in one place that anyone can visit. It's relevant to any kind of research (qualitative or quantitative) and you can include whatever makes sense for your project:
+But first, **why would you want to?**
+
+. . .
+
+There are many ways researchers use Quarto websites...
+
+---
+
+## Ways researchers use Quarto websites
+
+1. Research projects
+2. Programme or team homepage
+3. Training, modules, and courses
+4. Researcher profiles
+5. Manuscripts
+6. Conferences and events
+7. Package documentation
+
+---
+
+## 1. Research projects
+
+Research tends to accumulate across many different places:
+
+- Word documents, PDFs, data files
+- Presentations and emails
+- Code repositories
+
+. . .
+
+Hard for collaborators to find things, and nearly impossible for anyone outside the project to navigate. **Much of it stays hidden.**
+
+---
+
+## 1. Research projects
+
+A Quarto website brings everything together in **one place that anyone can visit**.
+
+Relevant to any kind of research (qualitative or quantitative).
+
+. . .
+
+A project website might include:
 
 - An overview of the study and its aims
 - Relevant documents, reports, and materials
 - Embedded videos, presentations, and visualisations
 - Notes, updates, or a log of progress
 
-If your research involves code (Python, R, etc.), you can go further: run code directly within the site, display outputs automatically, and embed interactive figures. But none of that is required.
+---
+
+## 1. Research projects
+
+Can accompany a journal paper as a richer alternative to a standard appendix:
 
-A project website can accompany a journal paper as a richer alternative to a standard appendix - searchable, mixed media, and openly accessible to anyone. Or it can simply serve as a research compendium: everything in one place, properly organised.
+- Searchable
+- Mixed media
+- Openly accessible to anyone
 
-Example:
+. . .
+
+Or serve as a **research compendium** (everything in one place, properly organised).
+
+. . .
+
+If your research involves code (Python, R, etc.), you can run code directly within the site, display outputs automatically, and embed interactive figures.
+
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://the-epic-study.quarto.pub/the-epic-project/"
-  title="The Early Psychosis: Investigating Cognition (EPIC) Project">
+  title="The Early Psychosis: Investigating Cognition (EPIC) Project"
+  style="border:none;">
 </iframe>
 
-## Homepage for a research programme or team
+---
+
+## 2. Programme or team homepage
 
-If you lead a group, collaborate across institutions, or are part of a larger programme of work, a Quarto website can serve as the public-facing home for everything you do.
+If you lead a group, collaborate across institutions, or are part of a larger programme, a Quarto website can be the **public-facing home for everything you do**.
 
-This might include:
+. . .
 
 - An overview of the programme's aims and funding
-- Profiles of team members (Quarto has built-in "about page" templates)
+- Profiles of team members
 - A list of outputs: papers, datasets, tools, presentations
 - News or blog posts about recent developments
 - Links to resources for collaborators or the public
 
-Example:
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://pythonhealthdatascience.github.io/stars/"
-  title="STARS">
+  title="STARS"
+  style="border:none;">
 </iframe>
 
-## Training, modules, and courses
+---
+
+## 3. Training, modules, and courses
+
+Quarto is widely used for **teaching materials**.
 
-Quarto is widely used for teaching materials. Course notes, worked examples, exercises, and slide decks can all live together on one structured, searchable site that learners can work through
+Course notes, worked examples, exercises, and slide decks can all live together on one structured, searchable site.
 
-The site can be open to anyone, easy to update and verion controlled, so you always know what changed and when.
+. . .
 
-Example:
+- Open to anyone
+- Easy to update
+- Version controlled - you always know what changed and when
+
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://sta210-s22.github.io/website/"
-  title="STA 210: Regression Analysis">
+  title="STA 210: Regression Analysis"
+  style="border:none;">
 </iframe>
 
-## Researcher profiles
+---
 
-You can create a personal academic website that goes far beyond a LinkedIn profile or institutional staff page. A researcher profile site lets you present your work exactly as you want to, with your own design and structure. You can include your biography, research interests, publications, teaching, and links to your other profiles online.
+## 4. Researcher profiles
 
-You can also have a blog - a place to share updates, write about your work, or post short pieces between papers.
+Create a **personal academic website** that goes far beyond a LinkedIn profile or institutional staff page, and moves with you if you change institutions.
 
-It can also move with you if you change institutions.
+. . .
 
-Example:
+- Present your work exactly as you want to
+- Biography, research interests, publications, teaching
+- Links to ORCID, Google Scholar, GitHub, and more
+- A blog - share updates, write about your work, post short pieces between papers
+
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://amyheather.github.io/"
-  title="Amy Heather">
+  title="Amy Heather"
+  style="border:none;">
 </iframe>
 
-## Manuscripts
+---
+
+## 5. Manuscripts
+
+Quarto has a dedicated **manuscripts format** for scholarly articles.
 
-Quarto has a dedicated manuscripts format for scholarly articles. You write your paper in Quarto and can output it as a website, a PDF, or a Word document - all from the same source file.
+Write your paper in Quarto and output it as a website, a PDF, or a Word document - all from the same source file.
 
-This won't be relevant to everyone - but for research involving data analysis, you can embed code meaning your figures and results are always generated directly from the analysis — nothing can go out of sync.
+. . .
 
-Example:
+::: {.callout-note}
+This won't be relevant to everyone. But for research involving data analysis, embedding code means your figures and results are always generated directly from the analysis — nothing can go out of sync.
+:::
+
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://daniel1noble.github.io/ecoevo_1000/"
-  title="Supplementary Materials for: The promise of community-driven preprints in ecology and evolution">
+  title="Supplementary Materials for: The promise of community-driven preprints in ecology and evolution"
+  style="border:none;">
 </iframe>
 
-## Conferences and events
+---
+
+## 6. Conferences and events
+
+If you are hosting an event (e.g., a workshop, symposium, summer school, or conference), Quarto works well here too.
 
-If you are hosting an event - a workshop, symposium, summer school, or conference - Quarto works well here too. You can publish the programme, abstracts, speaker information, and practical details before the event, then add slides, recordings, and notes afterwards, all on the same site.
+. . .
 
-Because the site is just files in a repository, multiple organisers can contribute to it, and it can be updated easily as the event approaches and after it ends.
+- Publish the programme, abstracts, and speaker information **before** the event
+- Add slides, recordings, and notes **afterwards**
+- Multiple organisers can contribute via the repository
+- Easy to update as the event approaches and after it ends
 
-Example:
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
+  height="100%"
   src="https://drganghe.github.io/climate-guest-speakers/"
-  title="Climate Guest Speakers">
+  title="Climate Guest Speakers"
+  style="border:none;">
 </iframe>
 
-## Package documentation
+---
+
+## 7. Package documentation
+
+If you develop a software package in Python, R, or another language, Quarto is a great way to write its documentation.
 
-If you develop a software package - in Python, R, or another language - Quarto is a great way to write its documentation. You can include installation instructions, usage guides, tutorials, and examples, all in one navigable site.
+Installation instructions, usage guides, tutorials, and examples, all in one navigable site.
 
-Example:
+---
 
 <iframe
-  class="auto-preview"
   width="100%"
-  height="800"
-  src="http://hsma-tools.github.io/vidigi/vidigi_docs/"
-  title="vidigi">
+  height="100%"
+  src="https://hsma-tools.github.io/vidigi/vidigi_docs/"
+  title="vidigi"
+  style="border:none;">
 </iframe>
 
+---
+
 ## Next steps
 
-The rest of this tutorial will walk you through how to create a Quarto website from scratch — we'll build one together.
+::: columns
+::: {.column width="60%"}
+
+The rest of this tutorial will walk you through how to create a Quarto website from scratch — **we'll build one together**.
+
+[Go to tutorial →](/pages/setup.qmd)
+
+At the end, head to the [Examples](examples.qmd) page to see a much larger collection of real research websites built with Quarto, covering all of the categories above and more.
+
+:::
+
+::: {.column width="40%"}
+
+[![](/images/examples_page_screenshot.png)](/pages/examples.qmd)
 
-When you reach the end, head to the [Examples](examples.qmd) page to see a much larger collection of real research websites built with Quarto, covering all of the categories above and more.
+:::
+:::