Seit einigen Jahren gebe ich Workshops und halte Vorträge, um meine Ideen zu modularer Webentwicklung zu verbreiten. Ich verstehe Webseiten als eine Kombination vieler Einzelteile. Es ist mein Anliegen, die Erstellung dieser Einzelteile möglichst einfach und portabel zu gestalten.

Portrait von Jens Grochtdreis

Umsetzung der Workshops in Texte

Nach meinen ersten Vorträgen fing ich an, die Inhalte meiner Vorträge und Schulungen aufzuschreiben. So reifte über mehrere Jahre ein Manuskript, das ich nun endlich finalisieren möchte. Wohl wissend, dass in der Frontendentwicklung nichts final ist.

An dieser Stelle wird es die Quintessenz meiner Überlegungen frei verfügbar als Webseite geben. Einen festen Termin kann und will ich nicht geben. Aber ich hoffe, noch bis Juni 2017 insgesamt fertig zu werden.

Für all diejenigen, die wie ich gerne längere Texte als PDF lesen und sammeln, werde ich die Texte über Leanpub zugänglich machen. Dies ist auch ein prima Weg, mich für meine Arbeit ein wenig zu entschädigen.

Kennen Sie solchen Code?


nav.navigation > ul > li > .submenu > ul > li.archive:hover {
	border: 2px solid transparent !important;
}

nav.navigation > ul > li.has-submenu > .submenu > ul > li.special {
	background: #ededed;
}

nav.navigation > ul > li.has-submenu > .submenu > ul > li.special a {
	color: #AD1921;
}
      

Im Laufe der Lebenszeit eines Projektes wird häufig solch schlecht wartbarer Code geschrieben. Die Gründe dafür sind vielfältig. Ich helfe meinen Kunden dabei, solche Codemonster in Zukunft zu verhindern. Idealerweise beseitigen wir auch die Gespenster der Vergangenheit.

Der Code wäre in dieser Form wartbarer

Der oben gezeigte Code wäre in dieser Form wartbarer, verständlicher und würde den gleichen Zweck erfüllen:


.navigation .archive:hover {
	border: 2px solid transparent !important;
}

.navigation .special {
	background: #ededed;
}

.navigation .special a {
	color: #AD1921;
}
      

Grobe, bisherige Struktur

  • Eine Seite ist eine Ansammlung von Modulen
  • Layout und Design
  • Der neue Blick auf das CSS
  • Mit CSS gestalten
  • Die berühmten "Best Practices"
  • Jedes Modul ist eine eigene Welt
  • Module identifizieren
  • Differenz zwischen Design und Realität
  • Die objektorientierten Ansätze
  • Sind Klassen wirklich klasse?
  • Sind IDs wirklich böse?
  • Entkoppelung von HTML und CSS
  • Mein modularer Ansatz
  • Semantische Klassen
  • Realistische Dummy-Inhalte nutzen
  • Eine eigene UI-Sammlung
  • Schnipsel im CSS dank Präprozessoren
  • Ein System erarbeiten, das alle intuitiv verstehen

Eindruck vom Inhalt

Einen Eindruck vom Inhalt können Sie sich über meine Vortragsfolien und einen Videomitschnitt meines Vortrags auf der Contao-Konferenz 2015 verschaffen.

Webseiten modular entwickeln

Modulare Webseiten entwickeln