Änderung SchulhomePage

This commit is contained in:
Sabrina Hennrich 2025-06-13 12:19:06 +02:00
parent ca031126e1
commit 6bc072022f

View File

@ -15,25 +15,16 @@
<section class="weKnow">
<div class="container">
<div class="container-10">
<NuxtImg
src="/uploads/water_dot_c2b934736e.webp"
provider="strapi"
alt=""
/>
<div class="textBox">
<h2>Und jetzt auch noch die Schulhomepage?</h2>
<h3>Als Schulleitung oder Lehrer stehen Sie schon jetzt unter enormem Druck?</h3>
<p> <u>Lehrermangel</u>,
steigende <u>bürokratische Aufgaben</u> und immer neue Herausforderungen rauben Zeit und Kraft.
Und dann soll auch noch die Schulhomepage gepflegt werden? Nun auch noch barrierefrei? Hilfe!</p>
<h4>Wie wäre es, wenn Ihre Webseite so einfach zu bedienen wäre, dass Sie sich wirklich entlastet
und unterstützt fühlen? </h4>
<p>Mit einer speziell für Schulen entwickelten, einfachen Benutzeroberfläche wird es zum Kinderspiel,
<b>Termine</b>, <b>Erlebnisberichte</b> oder <b>Neuigkeiten</b> selbst zu veröffentlichen. Und das ganz ohne technische Vorkenntnisse.</p>
<p>Und falls die Zeit trotzdem knapp ist, übernehmen wir auch das gerne für Sie.
Wir pflegen Ihre Seite zuverlässig, stehen als Ansprechpartner bereit und arbeiten eng mit Ihnen
und Ihrem Team zusammen, eben ganz nach Ihren Vorgaben und Bedürfnissen.</p>
<h2>Sie möchten sich eine neue Webseite für Ihre Schule oder Ihren Kindergarten erstellen lassen?</h2>
<p> Wir entwickeln moderne, barrierefreie Webseiten, die Eltern, Schüler und Mitarbeitende klar informieren und sich ganz einfach pflegen lassen. </p>
</div>
</div>
@ -52,24 +43,12 @@
<path d="M 0 0 L 500 0 L 500 14 Q 354.4 -2.8 250 11 Q 145.6 24.8 0 14 L 0 0 Z" fill="#FFF"/>
</svg>
<div class="paper">
<h2>Barrierefreiheit ist Pflicht &mdash; doch zum Glück auch unsere Stärke!</h2>
<h2>Barrierefreiheit ist für Bildungseinrichtungen in Deutschland Pflicht!</h2>
<p>
Schulen in Deutschland sind gesetzlich verpflichtet, ihre digitalen Angebote barrierefrei zu gestalten, damit alle Menschen, unabhängig von Einschränkungen, gleichberechtigten Zugang zu Informationen erhalten.
Wir erstellen Ihre Schulhomepage von Beginn an nach den <b>Anforderungen der Barrierefreiheit (BITV 2.0)</b> und sorgen dafür, dass Ihre Seite auch dann barrierefrei bleibt, wenn Inhalte später von Ihnen oder dem Kollegium selbst eingepflegt werden.
</p>
<p>
Wir entwickeln Ihre Schulhomepage von Beginn an nach den geltenden Richtlinien und sorgen mit einem stabilen System dafür, dass Ihre Seite auch dann barrierefrei bleibt, wenn Inhalte später von Ihnen oder dem Kollegium selbst eingepflegt werden.
</p>
<p>
Dabei orientieren wir uns an:
</p>
<ul class="check">
<li><strong>EU-Richtlinie 2016/2102</strong> für barrierefreie Websites öffentlicher Stellen</li>
<li><strong>Barrierefreie-Informationstechnik-Verordnung (BITV 2.0)</strong> verbindlich für Schulen in Deutschland</li>
<li><strong>Web Content Accessibility Guidelines (WCAG) 2.1</strong> internationaler Standard</li>
</ul>
<p>
Wir nehmen Barrierefreiheit nicht nur ernst, wir machen sie praktisch und umsetzbar.</p>
<p> Für Sie bedeutet das konkret:
Wir nehmen Barrierefreiheit nicht nur ernst, wir machen sie praktisch und umsetzbar. Für Sie bedeutet das konkret:
<ul class="check">
<li><b>weniger Risiko</b></li>
<li><b>mehr Inklusion</b></li>
@ -83,46 +62,85 @@
</svg>
</section>
<section class="reference">
<div class="container-10">
<h2>Vertrauen, das uns ehrt: Die Stadt Konstanz setzt bereits auf unsere Expertise</h2>
<div class="reference-content">
<div class="reference-image">
<NuxtImg
<section class="cmsAdmin">
<div class="container-10">
<NuxtImg
src="/uploads/schulverwaltung_4405a91768.png"
provider="strapi"
src="/uploads/Image_Comp_BSK_After_b4358b0e19.png"
alt="Berchenschule Konstanz Webseite"
width="600"
height="400"
/>
</div>
<div class="reference-text">
width="80%"
/>
<div class="textBox">
<h2>Inhalte pflegen ganz ohne Webdesign-Kenntnisse?</h2>
<p>
Die Berchenschule der Stadt Konstanz hat uns bereits 2024 mit der
<a href="https://www.digimedialoop.de/projekt/neugestaltung-schulhomepage-und-corporate-design-berchenschule" target="_blank" rel="noopener noreferrer">
Neugestaltung ihrer Schulhomepage
</a>
und des Corporate Designs beauftragt.</p>
<p> Ein Projekt, bei dem wir passgenau auf die individuellen Bedürfnisse der Schule eingegangen sind.
Na klar! Wir setzen auf eine <b>intuitive Verwaltungsoberfläche</b>, mit der Sie Inhalte ganz einfach selbst pflegen können:
</p>
<p>
Das Ergebnis ist eine moderne, benutzerfreundliche Webseite, die sowohl Schüler, Eltern als auch Lehrkräften den Alltag erleichtert und dadurch die Kommunikation verbessert.
<ul class="check">
<li>Termine eintragen</li>
<li>Artikel veröffentlichen</li>
<li>Formulare, Downloads und Infos bereitstellen</li>
<li>Speisepläne hochladen</li>
<li>Bilder austauschen</li>
</ul>
<p class="noArea">
Kein WordPress! &mdash; Keine ständigen Updates! &mdash; Keine Plugins! &mdash; Kein Design-Chaos!
</p>
<h3>Dürfen wir auch Sie entlasten?</h3>
<button
class="my-4 pinkBtn"
role="button"
aria-label="Kontaktformular öffnen"
@click.prevent="toggleContactBubble"
>
Kontaktieren Sie uns!
</button>
</div>
</div>
</div>
</section>
</div>
</div>
</section>
<section class="reference">
<NuxtImg
provider="strapi"
src="/uploads/watercolor_da8a37ce48.webp"
alt=""
class="reference-bg"
sizes="100vw"
priority
/>
<svg class="sectionWave wave-top" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 20">
<path d="M 0 0 L 500 0 L 500 14 Q 354.4 -2.8 250 11 Q 145.6 24.8 0 14 L 0 0 Z" fill="#FFF"/>
</svg>
<div class="container-10">
<div class="reference-content">
<div class="reference-image">
<NuxtImg
provider="strapi"
src="/uploads/Image_Comp_BSK_After_b4358b0e19.png"
alt="Berchenschule Konstanz Webseite"
width="600"
height="400"
/>
</div>
<div class="reference-text">
<h2>Die Stadt Konstanz setzt bereits auf unsere Expertise</h2>
<p>
Die Berchenschule in Konstanz hat uns 2024 mit der
<a href="https://www.digimedialoop.de/projekt/neugestaltung-schulhomepage-und-corporate-design-berchenschule" target="_blank" rel="noopener noreferrer">
Neugestaltung ihrer Schulhomepage
</a>
beauftragt.</p>
<p>
<b>Das Ergebnis:</b> Eine moderne, barrierefreie und benutzerfreundliche Webseite. Sie erleichtert die Kommunikation, spart Zeit und funktioniert!
</p>
<h3>Dürfen wir auch Sie unterstützen?</h3>
<button
class="my-4 pinkBtn"
role="button"
aria-label="Kontaktformular öffnen"
@click.prevent="toggleContactBubble"
>
Kontaktieren Sie uns!
</button>
</div>
</div>
</div>
<svg class="sectionWave wave-bottom" style="transform: scale(1,-1)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 20">
<path d="M 0 0 L 500 0 L 500 14 Q 354.4 -2.8 250 11 Q 145.6 24.8 0 14 L 0 0 Z" fill="#FFF"/>
</svg>
</section>
<FAQArea
page-link="/branchen/schulhomepage"
@ -139,6 +157,7 @@
<style lang="sass">
.schoolPage
overflow-X: hidden
hyphens: auto
.weKnow
position: relative
img
@ -150,7 +169,15 @@
z-index: 4
.textBox
z-index: 5
margin-left: 15%
margin-left: 25%
max-width: 550px
width: 45%
h2
font-size: 1.8rem
p
font-size: 1.2rem
@media(max-width: $breakPointMD)
width: 80%
h4
font-family: 'Mainfont'
@ -181,10 +208,48 @@
transform: rotate(-1deg)
border: 1px solid $lightgrey
box-shadow: 2px 2px 10px 2px #EEE
h2
font-size: 1.8rem
.cmsAdmin
text-align: center
.textBox
margin: 2rem auto
max-width: 800px
h2
margin: 1rem auto 1rem auto
ul
display: inline-block
text-align: left
padding: 0
margin: 1rem auto
li
.noArea
font-style: italic
background-image: radial-gradient(ellipse at center, $lightgrey 0%, rgba($lightgrey, 0.8) 30%, rgba($lightgrey, 0.3) 60%, transparent 100%)
padding: 1rem 1rem
font-size: 1rem
border-radius: .5rem
text-align: center
.reference
margin: 5rem 0
position: relative
padding: 5rem 0
overflow: hidden
.reference-bg
position: absolute
top: 0
left: 0
width: 100%
height: 100%
object-fit: cover
object-position: center
opacity: 0.15
z-index: -1
pointer-events: none
.reference-content
display: grid
@ -201,8 +266,10 @@
height: auto
.reference-text
h3
margin-top: 1rem
max-width: 500px
margin: 2rem 15%
@media(max-width: $breakPointMD)
margin: 2rem 0