HTML/CSS Workshop: Unterschied zwischen den Versionen

(10 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)

Zeile 1:

== ~~Hallo liebe~~ Metalabber und Interessierte! ==

== Liebe Metalabber und Interessierte von überall ==

~~Ich würde sehr gerne einen~~ Workshop ~~für den '''28~~.~~Mai 2013 um 19:00''' ansetzen und vorbereiten~~.

Der Workshop wird in einer monatlichen Basis stattfinden.

Es sind auch mit demm Thema verwandte Vorträge geplant.

Allerdings bin ich mir noch nicht bewusst wie viele Interessenten es gibt, vorsichtshalber aber mal in die '''Bibliothek''' damit, es sei denn es finden sich weit aus mehr Interessenten, in dem Fall würde ich dann den Hauptraum beanspruchen.

~~Diesen Workshop würde ich dann auch je nach Interesse und Beteiligung der Teilnehmer regelmäßig stattfinden lassen.~~

=== Requirements ===

~~Die Zielgruppe sind für den Anfang größtenteils Anfänger, generell bin ich aber für jeden~~, ~~der etwas beitragen kann und will~~, ~~dankbar~~.

~~Ich weiß nicht wie viele der Themenpunkte an diesem ersten Workshop abgearbeitet werden können~~.

Alles was du benötigst ist ein funktionierendes Laptop, egal ob Mac, Windows oder Linux.

Nur wäre eine grafische Oberfläche von großem Vorteil (Das Ergebnis lässt sich schwer in Text-only Browsern beobachten.)

~~Ich plane jedoch auch Fragen~~ und ~~Diskussionen~~ und ~~Hinweise ein~~, ~~damit ich nicht zu viel an einem Tag anzugehen versuche~~.

=== Zielgruppe: ===

Allerdings ist Webentwicklung/Design ein Thema welches erst viel Vorwissen benötigt, jedoch werde ich ~~weiters~~ versuchen dass wir so schnell wie möglich zum Editor kommen und unser erstes Konstrukt schreiben :)

Die Zielgruppe sind für den Anfang größtenteils '''Anfänger''' und jenen die sich unter HTML/CSS gar nix vorstellen können. Generell bin ich aber für jeden, der etwas beitragen kann und will, dankbar. Allerdings ist Webentwicklung/Design ein Thema welches erst viel Vorwissen benötigt, jedoch werde ich versuchen dass wir so schnell wie möglich zum Editor kommen und unser erstes Konstrukt schreiben. :)

{{Veranstaltung

Zeile 16:

Zeile 17:

|image=Html5badge.jpg

|involved=[[User:Misan|Misan]]

|when=~~28.05.2013 19:00~~

|when= - zur Zeit beschäftigt, Termin kommt bald!

|category=Workshop

|status=active

Zeile 22:

Zeile 23:

}}

~~=== Eckdaten ===~~

~~'''Zielgruppe~~:~~'''~~ Interessierte~~, Anfänger, Leute die ihre Wissenslücken füllen wollen~~

=== Ich bin dabei ===

Datum noch nicht freigegeben - bitte meldet euch dazu in der Mailing Liste.

== Vergangene Workshops ==

=== 1. Workshop - 28.Mai 2013 um 19:00 ===

== Hallo liebe Metalabber und Interessierte! ==

~~'''Ort:''' Bibliothek~~

Der Workshop wurde im Nachhinein auf den Hauptraum verlegt weil doch großes Interesse bestand.

~~'''Zeit:''' 28.5.2013 19:00 (nach dem Java Meetup)~~

~~'''Dauer~~:~~''' Bis zu 2~3 Stunden, generell aber open end.~~

Lösung für den letzten Workshop:

~~=== Requirements ===~~

After und Before Pseudo Selektoren müssen laut Spezifikation content festgelegt haben.

Auch wenn der content auf leer (also '' ) gesetzt wird, ist es notwendig.

~~Alles was du benötigst ist ein funktionierendes Laptop, egal ob Mac, Windows oder Linux~~.

.group:after

~~Nur wäre eine grafische Oberfläche von großem Vorteil (Das Ergebnis lässt sich schwer in Text-only Browsern beobachten.)~~

{

content: ''''''';

clear: both;

}

~~== Teilnehmer ==~~

*[[User:Misan|Misan]]

* Min

* [[User:Vierlex|vierlex]]

* [[User:Scenor|scenor]]

* weirdrat

* RXC

* Andreas

* [[User:Redplanet|redplanet]]

* du?

== Themenpunkte ==

=== Themenpunkte ===

Teil 1

=== Einleitung ===

==== Einleitung ====

'''Dauer:''' 15 Minuten

Zeile 67:

Zeile 69:

** In vorhandener Software verwenden (wie Forensoftware oder andere Anwendungen die eine Ordnerstruktur vorgeben)

=== Theorie - HTML und CSS ===

==== Theorie - HTML und CSS ====

'''Dauer:''' 30 Minuten

'''HTML'''

* Geschichte und Stand der heutigen Definition <abbr title="Hyper Text Markup Language">HTML5</abbr> & <abbr title="Cascading Style Sheets">CSS3</abbr>

* HTML ist keine Programmiersprache sondern eine "Markup" Sprache ähnlich wie <abbr title="Scalable Vector Graphics">SVG</abbr>/<abbr title="Standard Generalized Markup Language">SGML</abbr>/<abbr title="eXtensible Markup Language">XML</abbr> etc

* HTML ist keine Programmiersprache sondern eine "Markup" Sprache ähnlich wie <abbr title="Scalable Vector Graphics">SVG</abbr>/<abbr title="Standard Generalized Markup Language">SGML</abbr>/<abbr title="eXtensible Markup Language">-XML</abbr> etc

* Herkömmliche Methoden

** Wie hat man früher gewerkt

Zeile 118:

Zeile 121:

Bei Vorschlägen für den Aufbau des Workshops meldet euch bitte einfach :)

</div>

== Tools & Quellen ==

Zeile 177:

Zeile 181:

http://www.google.com/fonts

http://www.fontsquirrel.com/ Contrast Ratio Checker:

http://www.fontsquirrel.com/

Icon Fonts!

http://weloveiconfonts.com/

Contrast Ratio Checker:

http://leaverou.github.io/contrast-ratio/#%23FFF-on-%230072

Zeile 191:

Zeile 201:

http://subtlepatterns.com/

Codesniffer: Ist dein HTML valide?

Zeile 205:

Zeile 216:

http://jsfiddle.net/

Fällt dir die Wahl für einen Editor schwer?

Man braucht kein Dreamweaver oder PHPDesigner um professionelle Seiten erstellen zu können.

Editoren wie http://sublimetext.com oder Notepad++ sind lightweight und können sehr gut erweitert und konfiguriert werden!

== Abschließende Worte ==