You are curently reading the begining of the cøntent 2 (linked to the class BTM).
Here is the following of the first half of the web site, that we entitled "Cøntent 1" and that is linked to the class "TOP". This part will appear on the top of the third page of the zine.
To properly print this template (or, to begin, export properly the pdf), please follow these steps:
• use Firefox
Usualy, to do web-to-print, we prefer Chromium and Chrome because they are the only brothers nicely interpretating the @page fonction that allows to define the size of the page. —For exemple, a 3×4 meters web-to-print pdf is POSSIBLE. I did it. Twice— But here, we want to print on A4 sheets, so Firefox is perfectly fine.
• if you want to print any background (full color, gradient, picture...), scroll to the top of the page before clicking on 🖨️ or ctrl+P / md+P
• on the print setting window, for "Margins", select "None"
• still on the print setting window, bellow, on the "Options" section, select "Print backgrounds"
• remember it is ment to be double-sided printed, then vertically fold. The BIG PINK NUMBERS on the backgroud of the A4 pages are here to show the print order (1 is behind 2, etc.). The yellow numbers on the left and the right in the middle are the page numbers once bounded.
Wouldn't you like to have some resources to start and explore web to print possibilities?
GENERAL
developper.mozzilla.org/
www.w3schools.com/
HTML introduction
https://developer.mozilla.org/fr/docs/Apprendre/HTML/Introduction_%C3%A0_HTML
First steps with CSS
https://developer.mozilla.org/fr/docs/Learn/CSS/First_steps
Initiation à la mise en forme du texte (FR)
https://developer.mozilla.org/fr/docs/Learn/CSS/Styling_text/initiation-mise-en-forme-du-texte
What can we say more about this web-to-print template that will appears oon the top of the page 5?
ID & class (FR)
https://www.alsacreations.com/article/lire/535-quelle-est-la-difference-entre-une-classe-class-et-un-id.html – https://css-tricks.com/the-difference-between-id-and-class/
CSS layout
https://web.dev/one-line-layouts/
css grid
https://css-tricks.com/snippets/css/complete-guide-grid/
web color
https://htmlcolorcodes.com/fr/
media queries
developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries
Maybe not much. That will be situated on the top of the page 6.
Badass Libre Fonts by Women
https://www.design-research.be/by-womxn/
Velvetyne type foundry
http://velvetyne.fr/
Typothèque Esa
http://typotheque.le75.be/
Bye Bye Binary typothèque
https://typotheque.genderfluid.space/
Let's say we'd be happy you take this template and feed it with your own content. This paragraph will be placed on the top of the page 7.
Now, I guess, it's your turn to experiment and fill in the content of this paragraph that will appears on zine's page 7 bottom.
And continue, please, continue: give the top of the page 8 some content.
Ho, what a surprise, here is the content that we can write ont he page 8 of the printed zine, that will be readable online through the button linked to the class "BTM".
Here is the room for the content of the page 9 on the top.
Here is the room for the content of the page 9 bottom.
Content of the page 10 on the top.
What, you think it's repetitive and borring? Wanna have more fun?
Content of the page 10 on the bottom.
Do you love gradients? I do love gradients. The syntax for CSS Linear Gradients is: "background-image: linear-gradient(direction, color-stop1, color-stop2, ...)". For exemple, if you want a diagonal gradient, replace "direction" by "to bottom right". The CSS fonction "radial-gradient()" also exists. The colors can be names (like: red, orange, yellow, green, blue, indigo, violet) or hexadecimal referencies like: #e66465, #9198e5, or rgb references like: rgba(255,0,0,0). Want to learn more?
developer.mozilla.org/fr/docs/Web/CSS/gradient/linear-gradient
Content of the page 11 on the bottom.
Page 12 content on top
Content of the page 12 on the bottom.
Page 13 content, on top
Page 13 content on bottom
Page 14 top
Page 14 bottom
Page 15 top
Page 15 btm
Template made in html and css
by Lucile Olympe Haute
and Davide Bevilacqua
using Anthony & Minipax types,
and adapting the printable website of web.2print.org,
all that during
NØ SCHOOL Nevers
on July 2022
Here you can write something that will appear on the bottom of the cover page. If your zine is ment to be cut in two A6 zines, you should repeat the credits here.
Template made in html and css
by Lucile Olympe Haute
and Davide Bevilacqua
using Anthony & Minipax types,
and adapting the printable website of web.2print.org,
all that during
NØ SCHOOL Nevers
on July 2022