DONUT/donut-formations
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
edd0aeca60fc4638fda26f17832c7a2502e8c9c8
donut-formations/documents_ville_marseille/index.html
T

359 lines
20 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Accéder aux documents officiels de la Ville de Marseille | Donut formation</title>
<meta name="description" content="Boîte à outils citoyenne : délibérations, vidéos et procès-verbaux des conseils municipaux, recueil des actes administratifs, marchés publics et données essentielles, documents budgétaires, demande de permis de construire. Le Donut Marseille, InfoLab citoyen.">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet">
<style>
:root{
--bg:#f6f4ee;
--surface:#ffffff;
--sand:#efeae0;
--navy:#1a2332;
--gold:#e8b04d;
--gold-soft:#f0c879;
--gold-deep:#996713;
--ink:#1d2532;
--muted:#5d6a7c;
--line:#e2ddd1;
--ok:#1a6b3a;
--ok-bg:#edf7f1;
--ok-border:#b3ddc4;
--warn:#b9560a;
--warn-bg:#fef3ec;
--warn-border:#f3d2b6;
--red:#c0392b;
--red-bg:#fdf0ec;
--red-border:#eebcb3;
--blue:#1a4a8a;
--blue-bg:#eef3fb;
--blue-border:#c5d6f0;
--radius:0.6rem;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
font-family:'Inter',system-ui,sans-serif;
background:var(--bg);
color:var(--ink);
line-height:1.8;
font-size:0.98rem;
-webkit-font-smoothing:antialiased;
}
.wrap{max-width:880px;margin:0 auto;padding:0 1.5rem}
/* Barre de progression */
#progress{
position:fixed;top:0;left:0;height:3px;width:0;
background:linear-gradient(90deg,var(--gold),var(--gold-soft));
z-index:1000;transition:width .1s linear;
}
/* En-tete (bandeau sombre) */
header.top{
background:linear-gradient(160deg,#10161f 0%,var(--navy) 60%,#16202e 100%);
border-bottom:3px solid var(--gold);
padding:3.5rem 0 3rem;
color:#e9edf4;
}
.kicker{
display:inline-block;font-family:'JetBrains Mono',monospace;
font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;
color:var(--gold);border:1px solid var(--gold);border-radius:999px;
padding:0.35rem 0.9rem;margin-bottom:1.4rem;
}
h1{
font-weight:900;line-height:1.12;letter-spacing:-0.01em;
font-size:clamp(1.9rem,5vw,3rem);margin-bottom:1rem;color:#f3f5f9;
}
h1 .gold{color:var(--gold)}
.lede{font-size:1.08rem;color:#aeb9c9;max-width:680px}
.brandline{
margin-top:1.8rem;font-family:'JetBrains Mono',monospace;
font-size:0.78rem;color:#9aa7bb;
}
.brandline b{color:#e9edf4}
/* Sommaire */
nav.toc{
background:var(--sand);border:1px solid var(--line);
border-radius:var(--radius);padding:1.4rem 1.6rem;margin:2.5rem 0;
}
nav.toc h2{
font-size:0.78rem;text-transform:uppercase;letter-spacing:0.14em;
color:var(--gold-deep);margin-bottom:0.9rem;font-weight:700;
}
nav.toc ol{list-style:none;counter-reset:toc;display:grid;gap:0.45rem}
nav.toc li{counter-increment:toc;display:flex;gap:0.7rem;align-items:baseline}
nav.toc li::before{
content:counter(toc,decimal-leading-zero);
font-family:'JetBrains Mono',monospace;font-size:0.78rem;
color:var(--gold-deep);font-weight:700;flex:none;
}
nav.toc a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
nav.toc a:hover{border-bottom-color:var(--gold)}
section{padding:2.6rem 0;border-top:1px solid var(--line)}
section:first-of-type{border-top:none}
h2.sec{
font-size:clamp(1.35rem,3.5vw,1.7rem);font-weight:800;
line-height:1.25;margin-bottom:0.4rem;display:flex;gap:0.8rem;align-items:flex-start;
}
h2.sec .nbr{
font-family:'JetBrains Mono',monospace;color:var(--gold-deep);
font-size:1rem;font-weight:700;flex:none;padding-top:0.35rem;
}
.sub{color:var(--muted);font-size:0.95rem;margin-bottom:1.4rem}
h3{font-size:1.05rem;font-weight:700;margin:1.6rem 0 0.6rem;color:var(--gold-deep)}
p{margin-bottom:1rem}
ul.clean{list-style:none;display:grid;gap:0.55rem;margin:0.6rem 0 1.1rem}
ul.clean li{padding-left:1.4rem;position:relative}
ul.clean li::before{content:"▸";position:absolute;left:0;color:var(--gold-deep);font-size:0.9rem}
strong{color:#0f1726;font-weight:700}
a.link{color:var(--gold-deep);text-decoration:none;border-bottom:1px solid var(--line);word-break:break-word}
a.link:hover{border-bottom-color:var(--gold)}
/* Carte outil */
.tool{
background:var(--surface);border:1px solid var(--line);
border-left:3px solid var(--gold);border-radius:var(--radius);
padding:1.2rem 1.4rem;margin:1.2rem 0;
box-shadow:0 1px 3px rgba(26,35,50,.05);
}
.tool .where{
font-family:'JetBrains Mono',monospace;font-size:0.8rem;
color:var(--muted);margin-top:0.7rem;display:flex;gap:0.5rem;align-items:baseline;flex-wrap:wrap;
}
.tool .where .lbl{color:var(--gold-deep);text-transform:uppercase;letter-spacing:0.08em;font-size:0.66rem;flex:none}
.btn-go{
display:inline-block;margin-top:0.9rem;background:var(--navy);color:#fff;
font-weight:700;font-size:0.85rem;padding:0.5rem 1rem;border-radius:0.4rem;
text-decoration:none;border:1px solid var(--navy);
}
.btn-go:hover{background:#2a3852}
/* Encadres */
.box{border-radius:var(--radius);padding:1.05rem 1.25rem;margin:1.2rem 0;border:1px solid}
.box .bt{font-weight:700;margin-bottom:0.35rem;display:flex;gap:0.5rem;align-items:center}
.box p:last-child{margin-bottom:0}
.info-box{background:var(--blue-bg);border-color:var(--blue-border)}
.info-box .bt{color:var(--blue)}
.warn-box{background:var(--warn-bg);border-color:var(--warn-border)}
.warn-box .bt{color:var(--warn)}
.good-box{background:var(--ok-bg);border-color:var(--ok-border)}
.good-box .bt{color:var(--ok)}
.red-box{background:var(--red-bg);border-color:var(--red-border)}
.red-box .bt{color:var(--red)}
.red-box strong{color:#8c281c}
/* Acronymes (tooltip) */
.acr{
border-bottom:1px dotted var(--gold-deep);cursor:help;position:relative;
font-weight:600;color:var(--gold-deep);outline:none;
}
.acr::after{
content:attr(data-full) " : " attr(data-tip);
position:absolute;left:50%;bottom:140%;transform:translateX(-50%) translateY(4px);
background:#16202e;color:#e9edf4;border:1px solid var(--gold);
padding:0.6rem 0.8rem;border-radius:0.5rem;width:max-content;max-width:280px;
font-size:0.8rem;font-weight:400;line-height:1.5;text-align:left;
opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:50;
box-shadow:0 8px 24px rgba(26,35,50,.25);
}
.acr:hover::after,.acr:focus::after{opacity:1;transform:translateX(-50%) translateY(0)}
/* Tableau */
.table-wrap{overflow-x:auto;margin:1.2rem 0;border:1px solid var(--line);border-radius:var(--radius)}
table{width:100%;border-collapse:collapse;font-size:0.9rem;min-width:520px;background:var(--surface)}
th,td{padding:0.7rem 0.9rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--navy);color:var(--gold);font-size:0.74rem;text-transform:uppercase;letter-spacing:0.06em}
tbody tr:last-child td{border-bottom:none}
tbody tr:nth-child(even){background:#faf8f3}
td code,.mono{font-family:'JetBrains Mono',monospace;font-size:0.84rem;color:var(--gold-deep)}
/* Generateur de courriel */
.gen{
background:var(--sand);border:1px solid var(--line);border-radius:var(--radius);
padding:1.4rem;margin:1.4rem 0;
}
.gen label{display:block;font-size:0.78rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--gold-deep);margin:0.7rem 0 0.3rem;font-weight:700}
.gen input{
width:100%;background:var(--surface);border:1px solid var(--line);border-radius:0.4rem;
color:var(--ink);padding:0.55rem 0.7rem;font-family:'JetBrains Mono',monospace;font-size:0.86rem;
}
.gen input:focus{outline:none;border-color:var(--gold)}
.gen .preview{
margin-top:1.1rem;background:var(--surface);border:1px solid var(--line);border-radius:0.5rem;
padding:1rem;white-space:pre-wrap;font-size:0.88rem;line-height:1.7;color:var(--ink);
}
.gen .preview .h{color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:0.8rem}
.gen-btns{display:flex;gap:0.6rem;flex-wrap:wrap;margin-top:1rem}
.gen-btns button,.gen-btns a{
font-family:inherit;font-size:0.85rem;font-weight:700;cursor:pointer;
border-radius:0.4rem;padding:0.55rem 1.1rem;text-decoration:none;border:1px solid var(--navy);
}
.b-primary{background:var(--navy);color:#fff}
.b-primary:hover{background:#2a3852}
.b-ghost{background:transparent;color:var(--navy);border-color:var(--line)}
.b-ghost:hover{background:var(--sand)}
.copied{color:var(--ok);font-size:0.82rem;margin-left:0.4rem;opacity:0;transition:opacity .2s;align-self:center}
.copied.show{opacity:1}
/* Lexique */
.lex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0.8rem;margin-top:1.2rem}
.lex-item{background:var(--surface);border:1px solid var(--line);border-radius:0.5rem;padding:0.8rem 0.95rem}
.lex-sigle{font-family:'JetBrains Mono',monospace;color:var(--gold-deep);font-weight:700;font-size:0.9rem}
.lex-def{font-size:0.84rem;color:var(--muted);margin-top:0.25rem}
/* Sources */
.src-list{display:grid;gap:0.5rem;font-size:0.88rem}
.src-list a{color:var(--gold-deep);text-decoration:none;border-bottom:1px solid transparent}
.src-list a:hover{border-bottom-color:var(--gold)}
.src-list .n{font-family:'JetBrains Mono',monospace;color:var(--muted);margin-right:0.5rem}
footer{background:var(--sand);border-top:3px solid var(--gold);padding:3rem 0;margin-top:1rem;text-align:center}
footer .brand{font-size:1.3rem;font-weight:900;margin-bottom:0.6rem;color:var(--ink)}
footer .brand .gold{color:var(--gold-deep)}
footer p{color:var(--muted);font-size:0.86rem;max-width:560px;margin:0 auto}
footer .mono{display:block;margin-top:0.5rem}
@media(max-width:600px){
.wrap{padding:0 1.1rem}
header.top{padding:2.6rem 0 2.2rem}
h2.sec{gap:0.5rem}
.acr::after{max-width:220px}
}
</style>
</head>
<body>
<div id="progress"></div>
<header class="top">
<div class="wrap">
<span class="kicker">Donut formation · Transparence locale</span>
<h1>Accéder aux <span class="gold">documents officiels</span> de la Ville de Marseille</h1>
<p class="lede">Une boîte à outils citoyenne pour retrouver, lire et utiliser les actes publics de la commune : délibérations, conseils municipaux, procès-verbaux, recueil des actes administratifs, marchés publics, budgets, permis de construire. Tout est public. Encore faut-il savoir où regarder.</p>
<p class="brandline">Module produit par <b>Le Donut Marseille</b>, InfoLab citoyen · formations.ledonut-marseille.org</p>
</div>
</header>
<div class="wrap">
<nav class="toc">
<h2>Les huit outils</h2>
<ol>
<li><a href="#delib">Rechercher les délibérations du conseil municipal</a></li>
<li><a href="#video">Revoir les séances du conseil municipal (vidéos)</a></li>
<li><a href="#pv">Lire les procès-verbaux des conseils municipaux</a></li>
<li><a href="#raa">Consulter le recueil des actes administratifs</a></li>
<li><a href="#mpe">Suivre les marchés publics en cours et leurs données essentielles</a></li>
<li><a href="#dce">Retrouver les dossiers de consultation archivés</a></li>
<li><a href="#budget">Accéder aux documents budgétaires</a></li>
<li><a href="#pc">Obtenir une copie d'un permis de construire</a></li>
</ol>
</nav>
<div class="box info-box">
<div class="bt">💡 Pourquoi cette boîte à outils</div>
<p>La plupart des actes d'une commune sont des <strong>documents administratifs communicables</strong> : toute personne peut les consulter, sans avoir à se justifier. Mais ils sont dispersés sur plusieurs plateformes, parfois peu visibles. Ce module rassemble les accès directs et explique, pour chacun, ce qu'on y trouve, comment le lire, et où sont les angles morts.</p>
</div>
<!-- 1 DELIBERATIONS -->
<section id="delib">
<h2 class="sec"><span class="nbr">01</span><span>Rechercher les délibérations du conseil municipal</span></h2>
<p class="sub">Le moteur de recherche officiel des délibérations marseillaises</p>
<p>Une <strong>délibération</strong> est une décision votée par le <span class="acr" data-full="CM" data-tip="L'assemblée des élus de la commune, qui vote le budget, les subventions, les marchés et l'essentiel des décisions.">CM</span>. Chaque délibération porte un numéro au format <span class="mono">AA/NNN/XXX</span> (année, numéro d'ordre, code de la commission). C'est l'acte juridique : il fixe ce que la commune décide et engage.</p>
<p>La Ville met à disposition une base de recherche à facettes (moteur Alfresco) où sont déposées les délibérations. On y cherche par numéro, par mot-clé, par date de séance ou par thème.</p>
<div class="tool">
<strong>Base de recherche des délibérations</strong>
<div class="where"><span class="lbl">Accès</span> deliberations.e-mrs.fr</div>
<a class="btn-go" href="https://deliberations.e-mrs.fr/alfresco/s/mrs/delib#faceted-search-delibs" target="_blank" rel="noopener">Ouvrir le moteur de recherche</a>
</div>
<h3>Comment s'en servir efficacement</h3>
<ul class="clean">
<li>Si vous connaissez déjà le <strong>numéro</strong> de la délibération (par exemple repéré dans un article ou un ordre du jour), cherchez-le directement, c'est le plus rapide.</li>
<li>Sinon, partez d'un <strong>mot-clé</strong> (nom d'une association, d'un quartier, d'un équipement) puis affinez avec les facettes (date, séance).</li>
<li>Notez bien la <strong>date de séance</strong> : elle vous servira ensuite à retrouver la vidéo (outil 2) et le procès-verbal (outil 3) correspondants.</li>
</ul>
<div class="box warn-box">
<div class="bt">⚠️ Délibération n'est pas procès-verbal</div>
<p>La délibération vous dit <strong>ce qui a été décidé</strong> et le résultat du vote. Elle ne retrace pas les <strong>débats</strong>. Pour savoir qui a dit quoi, qui s'est abstenu et pourquoi, il faut le procès-verbal (outil 3) ou la vidéo (outil 2).</p>
</div>
<div class="box red-box">
<div class="bt">🚨 Angle mort : les annexes ne sont pas mises en ligne</div>
<p>Une délibération renvoie presque toujours à des <strong>annexes</strong> qui en portent le contenu réel : conventions, plans de financement, tableaux chiffrés, listes nominatives de bénéficiaires de subventions, cahiers des charges, plans. La Ville <strong>ne publie pas ces annexes</strong> avec le texte de la délibération. On se retrouve donc à lire la décision sans pouvoir vérifier ce qu'elle décide concrètement : qui touche quoi, pour quel montant, à quelles conditions. Cela rend la lecture pleine et entière d'une délibération <strong>quasiment caduque</strong>.</p>
<p style="margin-top:0.7rem">Pour obtenir les annexes, il faut les <strong>demander</strong> par la voie du droit d'accès aux documents administratifs : elles sont communicables au même titre que la délibération elle-même (voir le module Donut dédié à ce droit).</p>
</div>
</section>
<!-- 2 VIDEOS -->
<section id="video">
<h2 class="sec"><span class="nbr">02</span><span>Revoir les séances du conseil municipal</span></h2>
<p class="sub">Les débats en vidéo, pour vérifier ce qui a vraiment été dit</p>
<p>Les séances du <span class="acr" data-full="CM" data-tip="Assemblée des élus de la commune. À Marseille, il siège plusieurs fois par an en séance publique.">CM</span> sont publiques. La Ville en propose la diffusion et la rediffusion. C'est l'outil le plus complet pour reconstituer un débat : ton, interruptions, explications de vote, échanges entre élus.</p>
<div class="tool">
<strong>Conseil municipal en vidéo</strong>
<div class="where"><span class="lbl">Accès</span> marseille.fr · Mairie · Conseil municipal</div>
<a class="btn-go" href="https://www.marseille.fr/mairie/conseil-municipal/le-conseil-municipal" target="_blank" rel="noopener">Accéder aux séances</a>
</div>
<div class="box good-box">
<div class="bt">✅ L'usage citoyen le plus utile</div>
<p>Croisez la vidéo avec le procès-verbal. Si une intervention marquante n'apparaît pas, ou est résumée de façon édulcorée dans le <span class="acr" data-full="PV" data-tip="Compte rendu écrit et officiel d'une séance, retraçant les débats et les votes.">PV</span>, vous tenez une observation documentée. Repérez le moment dans la vidéo (horodatage) pour pouvoir le citer précisément.</p>
</div>
</section>
<!-- 3 PV -->
<section id="pv">
<h2 class="sec"><span class="nbr">03</span><span>Lire les procès-verbaux des conseils municipaux</span></h2>
<p class="sub">Le compte rendu officiel et validé des séances</p>
<p>Le <span class="acr" data-full="PV" data-tip="Procès-verbal : compte rendu officiel d'une séance du conseil, approuvé lors d'une séance suivante.">PV</span> est le document écrit qui retrace une séance : ordre du jour, débats, interventions, résultats des votes. Il est approuvé lors d'une séance ultérieure, ce qui lui donne sa valeur officielle. La Ville en publie des extraits.</p>
<div class="tool">
<strong>Extraits des procès-verbaux</strong>
<div class="where"><span class="lbl">Accès</span> marseille.fr · Conseil municipal · Procès-verbal</div>
<a class="btn-go" href="https://www.marseille.fr/mairie/conseil-municipal/extrait-du-proces-verbal-du-conseil-municipal" target="_blank" rel="noopener">Lire les procès-verbaux</a>
</div>
<h3>Ce qu'un procès-verbal permet de faire</h3>
<ul class="clean">
<li>Vérifier le <strong>sens d'un vote</strong> et l'identité de ceux qui se sont opposés ou abstenus.</li>
<li>Retrouver les <strong>arguments</strong> avancés au moment de la décision (utile pour comprendre ou contester ensuite).</li>
<li>Documenter une <strong>promesse</strong> ou un <strong>engagement</strong> pris oralement en séance.</li>
</ul>
<div class="box warn-box">
<div class="bt">⚠️ Extrait ne veut pas dire intégralité</div>
<p>La Ville publie des <strong>extraits</strong>. Si le PV intégral d'une séance n'est pas en ligne, ou si la version publiée vous paraît incomplète, vous pouvez en demander la communication intégrale par la voie du droit d'accès aux documents administratifs (voir le module Donut consacré à ce droit).</p>
</div>
</section>
<!-- 4 RAA -->
<section id="raa">
<h2 class="sec"><span class="nbr">04</span><span>Consulter le recueil des actes administratifs</span></h2>
<p class="sub">Le journal officiel de la commune, et le point de départ des délais de recours</p>
<p>Le <span class="acr" data-full="RAA" data-tip="Recueil des actes administratifs : publication périodique qui rend opposables les actes réglementaires de la commune.">RAA</span> est la publication périodique qui regroupe les actes à caractère réglementaire de la commune : arrêtés du maire, délibérations réglementaires, décisions. C'est l'équivalent local d'un journal officiel.</p>
<div class="tool">
<strong>Recueil des actes administratifs</strong>
<div class="where"><span class="lbl">Accès</span> marseille.fr · Conseil municipal · Recueil des actes administratifs</div>
<a class="btn-go" href="https://www.marseille.fr/mairie/conseil-municipal/recueil-des-actes-administratifs" target="_blank" rel="noopener">Consulter le recueil</a>
</div>
<div class="box info-box">
<div class="bt">💡 Pourquoi le RAA est stratégique</div>
<p>La publication d'un acte au RAA est ce qui le rend <strong>opposable</strong> et fait courir le <strong>délai de re
Reference in New Issue View Git Blame Copy Permalink