Premier commit avec page d'accueil
This commit is contained in:
Alex
parent
1e5343a7c9
commit
83181a8ea0
0
css/layout.css
Normal file
0
css/layout.css
Normal file
0
css/print.css
Normal file
0
css/print.css
Normal file
58
css/style.css
Normal file
58
css/style.css
Normal file
@ -0,0 +1,58 @@
|
||||
body{
|
||||
font-family: CenturySchoolbook;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: CenturySchoolbook;
|
||||
src: url(../fonts/CenturySchoolbook-Regular.woff);
|
||||
}
|
||||
|
||||
a{
|
||||
color:#ff0000;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.5em;
|
||||
line-height: 1.7em;
|
||||
text-align: center;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1, h2{
|
||||
color:#ff0000;
|
||||
}
|
||||
|
||||
header{
|
||||
border-top: 20px solid #ff0000;
|
||||
}
|
||||
|
||||
footer{
|
||||
border-bottom: 20px solid #ff0000;
|
||||
}
|
||||
|
||||
|
||||
figure.gauche{
|
||||
float: left;
|
||||
}
|
||||
|
||||
figure.droite{
|
||||
float: right;
|
||||
}
|
||||
|
||||
figure.centre{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
img{
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
footer p{
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
hr {height: 40px; background: url('../images/separation.png') no-repeat 50% 50%; margin: 3em 0; border: 0;}
|
||||
BIN
fonts/CenturySchoolbook-Regular.woff
Normal file
BIN
fonts/CenturySchoolbook-Regular.woff
Normal file
Binary file not shown.
BIN
images/alice.jpg
Normal file
BIN
images/alice.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 141 KiB |
BIN
images/cestquoilehack.jpg
Normal file
BIN
images/cestquoilehack.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
images/chapeau-bol-fromage.jpg
Normal file
BIN
images/chapeau-bol-fromage.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
images/chapeau-bol.jpg
Normal file
BIN
images/chapeau-bol.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
BIN
images/ensavoirplus.jpg
Normal file
BIN
images/ensavoirplus.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
images/lapin-costume.jpg
Normal file
BIN
images/lapin-costume.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
images/lapin-trompette.jpg
Normal file
BIN
images/lapin-trompette.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 59 KiB |
BIN
images/questionhack.jpg
Normal file
BIN
images/questionhack.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
BIN
images/rendrevisite.jpg
Normal file
BIN
images/rendrevisite.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
images/reponsesco.jpg
Normal file
BIN
images/reponsesco.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
images/separation.png
Normal file
BIN
images/separation.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
143
index.html
Normal file
143
index.html
Normal file
@ -0,0 +1,143 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr" dir="ltr">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>UNE INTRODUCTION AUX HACKERSPACES ET À LEURS ACTIVITÉS</title>
|
||||
<link rel="stylesheet" href="css/layout.css">
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
<link rel="stylesheet" href="css/print.css" media="print">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>UNE INTRODUCTION AUX HACKERSPACES ET À LEURS ACTIVITÉS</h1>
|
||||
</header>
|
||||
|
||||
<div class="page">
|
||||
|
||||
<article class="intro">
|
||||
<figure class="gauche">
|
||||
<img src="images/alice.jpg" alt="Alice, debout sur un pupitre cylindrique, regardant dans une boite posée sur une table.">
|
||||
<img src="images/cestquoilehack.jpg" alt="c'est quoi le hack ?">
|
||||
</figure>
|
||||
|
||||
<p>Les hackerspaces sont des lieux physiques où les gens peuvent se rencontrer et travailler sur des projets.</p>
|
||||
|
||||
<p>Ce sont des lieux réels – par opposition aux lieux de rencontre en ligne – où se réunir avec
|
||||
des personnes partageant les mêmes centres d'intérêts.</p>
|
||||
|
||||
<p>L'éthique des hackers en fait des acteurs du bien commun opposés aux hiérarchies et aux autorités conventionnelles. </p>
|
||||
|
||||
<p>Leurs projets sont logiciels et matériels et touchent à tous les domaines comme la technique, la science et l'art.</p>
|
||||
</article>
|
||||
|
||||
<hr>
|
||||
|
||||
<article>
|
||||
<figure class="droite">
|
||||
<img src="images/chapeau-bol.jpg" alt="Petit homme pressé tenant un bol et un bout de fromage">
|
||||
<img src="images/questionhack.jpg" alt="Question hacktivistes">
|
||||
</figure>
|
||||
<h2>Partager</h2>
|
||||
|
||||
<p>La curiosité est au coeur de la culture Hacker. Comment marchent un logiciel, une imprimante ou un système politique ?
|
||||
Le comprendre et diffuser ce savoir, c'est donner les moyens de l'améliorer, l'adapter, le détourner de manière créative et originale.</p>
|
||||
|
||||
<p> Le logiciel libre est directement issu de cette culture. Il démontre que la mise en commun et la transparence sont gages de qualité, de pérennité et de créativité.
|
||||
Mise à disposition d'outils communs et gestion démocratique ou participative sont des manifestations concrètes de cet esprit de partage dans les hackerspaces.</p>
|
||||
|
||||
|
||||
|
||||
<h2>Ouvrir</h2>
|
||||
|
||||
<p>L'ouverture d'esprit est une nécessité : une communité inclusive, rejet des discriminations, encouragement de la participation sans limites d'âge ou de niveaux.
|
||||
Elle induit également une pensée en réseau où aucun de nous n'est meilleur que nous tous. Les hackerspaces existent pour sortir de l'isolement et faire des choses ensemble, se construire sur la base des conseils et des questions.</p>
|
||||
|
||||
<h2>Construire</h2>
|
||||
|
||||
<p>Produire en autonomie, créer selon ses besoins ou ses désirs, modifier ou réparer l'existant. C'est la pratique quotidienne que préconise la culture Hacker.
|
||||
Car personne ne devrait être forcé à s'agenouiller devant des systèmes de masse dont les produits sont défectueux, nuisibles, ou obsolescents par nature.</p>
|
||||
</article>
|
||||
|
||||
<hr>
|
||||
|
||||
<article>
|
||||
|
||||
<figure class="gauche">
|
||||
<img src="images/chapeau-bol-fromage.jpg" alt="Petit homme pressé buvant un bol et tenant un bout de fromage">
|
||||
<img src="images/reponsesco.jpg" alt="Réponses collectives">
|
||||
</figure>
|
||||
|
||||
<h2>Le hack, c'est...</h2>
|
||||
<ul>
|
||||
<li>Une culture égalitariste vivante</li>
|
||||
<li>Un partage des connaissances</li>
|
||||
<li>Des lieux collectifs ouverts</li>
|
||||
<li>Des espaces de discussion</li>
|
||||
<li>Une démarche créative </li>
|
||||
<li>Des projets concrets</li>
|
||||
<li>Une pensée critique</li>
|
||||
<li>Des collaborations multiples</li>
|
||||
<li>Des évènements réguliers</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<p>Aujourd'hui les hackerspaces font vivre cette culture avec honnêteté. Ce sont des lieux de rencontre, de confrontation des représentations, des lieux de création foisonnante.</p>
|
||||
|
||||
<p>Les pratiques qui émergent de la culture Hacker ont dépassé le cadre informatique. Elles ont donné naissance à l'hacktivisme, l'application du hack à la politique et à la critique sociale.
|
||||
Les hackerspaces naissent du désir de diffuser cette pensée et ses actions.</p>
|
||||
|
||||
<p>Les hacktivistes analysent la technologie pour ce qu'elle est : une idéologie promue par un système économique et politique à bout de souffle qui promet le meilleur et produit le pire.</p>
|
||||
|
||||
<p>En conscience de ce contexte, les hacktivistes travaillent à défendre collectivement leur singularité. Ils s'organisent au quotidien et montent régulièrement
|
||||
des événements ouverts au grand public pour faire connaître le hack.</p>
|
||||
|
||||
|
||||
</article>
|
||||
|
||||
<hr>
|
||||
|
||||
<article>
|
||||
|
||||
<figure class="droite">
|
||||
<img src="images/lapin-costume.jpg" alt="Lapin habillé d'un costume ayant un parapluie sous le bras">
|
||||
<img src="images/rendrevisite.jpg" alt="Rendre visites">
|
||||
</figure>
|
||||
|
||||
<ul>
|
||||
<li>06 - Nice <a href="https://nicelab.eu">nicelab.eu</a></li>
|
||||
<li>28 - Chartres <a href="https://betamachine.fr">betamachine.fr</a></li>
|
||||
<li>31 - Toulouse <a href="https://tetalab.org">tetalab.org</a></li>
|
||||
<li>34 - Montpellier <a href="lebib.org">lebib.org</a></li>
|
||||
<li>35 - Rennes <a href="https://breizh-entropy.org">breizh-entropy.org</a></li>
|
||||
<li>45 - Orléans <a href="https://labomedia.org">labomedia.org</a></li>
|
||||
<li>75 - Paris <a href="https://fuz.re">fuz.re</a></li>
|
||||
<li>92 - Nanterre <a href="https://electrolab.fr">electrolab.fr</a></li>
|
||||
<li>94 - Choisy-le-Roi <a href="https://tmplab.org">tmplab.org</a></li>
|
||||
<li>18 - Humbligny <a href="https://usinette.org">Usinette.org</a></li>
|
||||
<li>Bruxelles <a href="https://hacklab.brussels">hacklab.brussels</a></li>
|
||||
</ul>
|
||||
|
||||
</article>
|
||||
|
||||
<hr>
|
||||
|
||||
<article>
|
||||
|
||||
<figure class="centre">
|
||||
<img src="images/lapin-trompette.jpg" alt="Lapin habillé de cartes à jouer et jouant de la trompette">
|
||||
<img src="images/ensavoirplus.jpg" alt="En savoir plus">
|
||||
<h2><a href="https://hackerspaces.org">hackerspaces.org</a></h2>
|
||||
</figure>
|
||||
|
||||
</article>
|
||||
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<p>Document sous licence CC4.0 BY-SA-NC partagé sur https://git.interhacker.space/interhack/cquoilehack</p>
|
||||
<h1>MERCI POUR VOTRE ATTENTION ET BON HACK</h1>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user