Moderne Browser besitzen einen sogenannten »DOCTYPE-Switch«. Durch unterschiedliche Angaben im Code eines HTML-Dokumentes können die Browser in unterschiedliche Darstellungsmodi geschaltet werden. Dieses kann zu weitreichenden Konsequenzen in Bezug auf die Darstellung führen. Dieser Artikel soll erklären, wie der DOCTYPE-Switch funktioniert, und zeigt anhand von Beispielen, welche Unterschiede zwischen den einzelnen Darstellungsmodi bestehen.
Inhaltsverzeichnis
Einleitung
Was ist der DOCTYPE-Switch?
Browser mit DOCTYPE-Switch
Was ist ein DOCTYPE?
Die unterschiedlichen Darstellungsmodi
Full Standards Mode
Almost Standards Mode
Quirks Mode
In welchem Modus befindet sich ein Browser gerade?
Webdesign-Pannen gibt es tausende, einige sind aber auffällig oft selbst bei vermeintlich professionell gemachten Webauftritten zu finden. Wir zeigen die häufigsten Ausrutscher. Unsere Checkliste hilft, den eigenen Auftritt zu verbessern.
...
CSS und Layer
Hyperlinks dienen nicht nur zur statischen Verknüpfung mit Inhalten. Wir zeigen Ihnen, was mithilfe von CSS, Javascript und Layern zusätzlich möglich ist.
...
Diagnostic CSS: A set of styles to call eye-watering attention to bad markup, missing or empty attributes, and so on. In both advanced CSS and iE-friendly versions!
Reset CSS: Smooths out many browser inconsistencies by explicitly assigning values to things like element margins and padding, forcing all elements to have the same font size, and so on. You can find resets in most CSS frameworks, and they're a great starting point for creating your own "baseline" styles.
css4you
CSS 4 you
die deutsche Seite für Cascading Stylesheets (CSS)
W | w3c | wallpaper | warez | wasserfarben | web app | web apps verknüpfungen | web components | web design | web development | web font | web fonts | web fundamentals | web mailer | web sockets | web-entwickler | webcam | webdesign | webdesigner | webdesignshock | webdev | webentwicklung | Website-Baukasten | webydo | werbung | windows | windows 8 | wireframe | wix.com | wordpress-fehler | | |
Das Beispiel zeigt die unberuehrte Checkbox rot umrandet, klickt man hinein aendert sich die Rahmenfarbe zu hellgrau, klickt man weiter im Formular wechselt die Farbe verblueffenderweise noch einmal zu dunkelblau. Es klappt mit allen modernen Browsern. (sl)
Erstellt: 2016-12
E
ekiwi
Homepage-Tools
Tools, Grafiken, Dienste für die Website
Das Grammiweb bietet Ihnen auf über 2000 Seiten ständig neue Informationen und Tipps rund um den Ausbau und die Optimierung Ihrer Webseiten. Artikel, Anleitungen, Übersichten und vor allem eine Unmenge praktischer Anwendungsbeispiele helfen Ihnen neben vielen anderen nützlichen Inhalten, schnell und unkompliziert zu professionellen Ergebnissen zu gelangen.
HTML lernen und die eigene Website mit HTML5 und CSS3 Schritt für Schritt selber erstellen
... ein Wunsch und bald Wirklichkeit - herzlich willkommen zum HTML-Seminar, das für Erfolgsorientierte konzipiert ist. Dieser HTML-Kurs ist sowohl für Einsteiger und HTML-Neulinge als auch für Fortgeschrittene. Effektiv und erfolgsorientiert, weil aktuelle Technik gezeigt wird und Veraltetes vermieden wird.
Der Name ist Programm - durch gezielte Beschränkung auf das Wesentliche können Sie HTML lernen und Websites erfolgreich und mit dem nötigen Hintergrundwissen erstellen. Der Kurs ist weit mehr als nur eine HTML-Einführung! Für Fortgeschrittene sind weiterführende Inhalte und Anregungen mit aufgenommen.
Nach dem Lernen der notwendigen Einzelteile (sprich HTML-Befehle für die Struktur und CSS-Anweisungen für das Design) wird anhand von 3 Beispielprojekten (siehe rechts) mehrere komplette Webdesigns nachgebaut. So sind rasch die Zusammenhänge von HTML, CSS und Design gelernt.
...
...
Hinter dem Begriff verbirgt sich eine besondere Art des Internetauftritts. Es handelt sich dabei nämlich nicht um eine gewöhnliche Website. Eine Landingpage – auch Marketing- oder Zielseite – wird meist für Kampagnen, vor allem aber zum Erreichen bestimmter Unternehmensziele genutzt.
...
Eine "Landingpage" (auch "Landeseite"; englisch "landing page") oder "Zielseite", selten auch "Marketingpage", ist eine speziell eingerichtete Webseite, die nach einem Mausklick auf ein Werbemittel oder nach einem Klick auf einen Eintrag in einer Suchmaschine erscheint. Diese "Landingpage" ist auf den Werbeträger und dessen Zielgruppe optimiert. Diese wird überwiegend im Online-Marketing verwendet.
Bei einer "Landingpage" steht ein bestimmtes Angebot im Mittelpunkt, welches ohne Ablenkung vorgestellt wird. Ein wesentliches Element ist die Integration eines Response-Elements (z. B. Anfrageformular, Link zum Webshop oder Call-Back-Button), das die einfache Interaktion mit dem Besucher sicherstellt.
Landingpages sind nicht zu verwechseln mit "Brückenseiten" (englisch "doorway page"), deren Intention nicht direkte Werbung ist, sondern die hauptsächlich Zwecken der Suchmaschinenoptimierung und dem „Empfang“ der Benutzer dienen.
...
Lorem Ipsum ist ein einfacher Demo-Text für die Print- und Schriftindustrie. Lorem Ipsum ist in der Industrie bereits der Standard Demo-Text seit 1500, als ein unbekannter Schriftsteller eine Hand voll Wörter nahm und diese durcheinander warf um ein Musterbuch zu erstellen. Es hat nicht nur 5 Jahrhunderte überlebt, sondern auch in Spruch in die elektronische Schriftbearbeitung geschafft (bemerke, nahezu unverändert). Bekannt wurde es 1960, mit dem erscheinen von "Letraset", welches Passagen von Lorem Ipsum enhielt, so wie Desktop Software wie "Aldus PageMaker" - ebenfalls mit Lorem Ipsum
...
Erstellt: 2011-11
little-boxes
Little Boxes — der einfache Weg zu HTML und CSS
Webseiten bestehen aus rechteckigen Kästchen, die im Browserfenster übereinander-, nebeneinander- und ineinandergestapelt werden. HTML erstellt diese Kästchen, CSS gestaltet sie. Lauter little boxes.
...
Wir erklären das Grundgerüst einer Website. Außerdem erfahren Sie in diesem HTML-Ratgeber, wie Sie Zeichensätze, Sonderzeichen und Kodierung korrekt darstellen und damit ärgerliche Fehler auf Ihrer Website vermeiden.
phase 5 (W3)
Der HTML-Editor "phase 5" hat eine besondere Erwähnung auf dem Etymologie-Portal verdient. Ohne diesen Editor wäre das Etymologie-Portal vermutlich nie entstanden. Nachdem ich 2 Jahre die Idee eine Homepage zu erstellen mit mir herumtrug war "phase 5" auf einer CD-ROM einer PC-Zeitschrift der entscheidende Anstoß loszulegen. Und nach abermals zwei Jahren unspezifischem Experimentierens kombinierte ich schließlich das Erwachte Interesse an Wortgeschichten mit den nun vorhandenen Editiermöglichkeiten um das Etymologie-Portal ins Netz zu stellen.
Also an dieser Stelle ein großes Dankeschön an den Entwickler Ulli Meybohm und an die Programmierer, die seine Arbeit fortführen. (Wer sich hinter "hdb" verbirgt, konnte ich nicht herausbekommen.)
Ich habe mir auch andere Editoren angesehen, aber für meine Bedürfnisse konnte ich keinen Editor finden, der "phase 5" das Wasser reichen kann.
Zu den Funktionen, auf die ich nicht verzichten könnte, gehört auf jeden Fall die Datei-übergreifende Such- und Ersetzungs-Funktion. Selbst die mittlerweile ca. 10.000 Seiten meiner gesamten Internetpräsenz und mindestens die gleiche Anzahl von Hilfsdateien kann die Suchfunktion problemlos durchsuchen. Lediglich die Wartezeit verlangt etwas Geduld. Und so ist der technische Upgrade auf einen neuen (schnelleren) Rechner immer schon voraussehbar.
Nun aber noch zur Namensgebung:
Soweit ich mich erinnern kann, war auf der Homepage zu "phase 5", noch zu Ulli Meybohm's Zeiten, zu erfahren, dass er seine Entwicklungsschritte in "Phasen" (statt "Versionen") aufteilte. Und mit der "Phase 5" ging er dann wohl den Schritt in die Öffentlichkeit. Die Versionsbezeichnung wurde zum Produktnamen und zu Weihnachten 2007 soll nun "phase 5, Version 5.5" verfügbar sein.
"phase 5" von Ulli Meybohm ins Leben gerufen, wird seit 1998 weiterentwickelt von hdb, dem Autor des ftp-uploader.
Ein Klassiker unter den deutschen html Editoren! Einige Features des html Editors sind: Projektverwaltung, Cascaded Style Sheets, Java(Script), VBScript, html Formulare, integrierter Bildbetrachter, Syntax Debugger, Umlaut-Konvertierung, Fussnotenassistent, Einrückassistent, Verschlüsselungs-Funktionen, projektweites Ersetzen von Text, benutzerdefinierte Menüs und Vorlagen, Dateimanagerpanel zum schnellen Wechsel zwischen den einzelnen Dokumenten, mehrere Dokumente gleichzeitig editieren, Tabellenassistent u.v.m.
Kostenlose Nutzung für Privatanwender und Schulen.
...
Der html-Editor Phase 5 ist ein seit 1996 ständig weiterentwickeltes Freeware-Tool zum Erstellen und Bearbeiten von html-Dateien. Er verwaltet komplette Websites als Projekt, merkt sich Vorgaben, bietet eine Browservorschau, einen Bildbetrachter und beherrscht enorm viele html-Tags, die auf Knopfdruck eingefügt werden. Unterstützt wird nicht nur html, sondern auch Java, Tabellen, Listen, Cascading Style Sheets, VBScript und Formulare. Durch Syntaxhighlighting wird die Darstellung der Quelltexte verschiedener Sprachen (html, sql, perl...) erheblich verbessert. Weitere Funktionen sind das dateiübergreifende Suchen / Ersetzen, Includes werden unterstützt, eine integrierte Rechtschreibprüfung, Syntax-Schemes-Editor, das Setzen von Lesezeichen u.v.m.
zdnet
Noch vor Weihnachten 2007 erscheint die neue Programmversion phase 5.5
+ verbesserte HTML-Syntax Überprüfung mit DOM-Objektbaum Ansicht
+ integriertes HTML-Tidy
+ Bildbetrachter mit eingebautem ImageMap-Generator und Lupe
+ Toolbars können nun per Drag&Drop nach Lust&Laune umgebaut werden
+ Suchen & Ersetzten wurde stark überarbeitet
+ einfaches Markieren von Tag-Blöcken per Maus (Strg+Klick) oder Taste (F12)
+ Änderungen an geöffneten Dokumenten durch andere Programme werden erkannt
+ Externe Browser-Vorschau auch ohne zwingendes Speichern der Datei
+ Pipette zum abgreifen von Farben und zuschaltbare Farbpaletten
+ Speichern von Dateien beschleunigt
+ Entfernen sämtlicher HTML-Tags in markierten Blöcken
+ in der erweiterten Toolbar sind nun viele nützliche Funktionen per Mausklick abrufbar
- .. und es wurden natürlich auch Fehler behoben =)
Ich habe die neue Version von phase 5 mit Spannung erwartet, aber ich bin enttäuscht. Einige liebgewonnene Funktionen sind entweder verschwunden oder so verändert, dass es ärgerlich ist.
Am 20.12.2007 festgestellte Nachteile der Version 5.5.0:
"Abspeichern-Icon" verändert die Farbe nicht zwischen "nicht gespeichert/gespeichert"
Nach dem Schließen des Suchen-Fensters und neuem Öffnen (F11-Taste) sind die gefundenen Dateien verschwunden und der Suchlauf muß erneut gestartet werden. (Absolut ärgerlich)
Beim Öffnen des Suchfensters ist die vorhergehende Suchauswahl durch den aktuellen Ordner ersetzt. D.h. um das gesamte Homepage-Verzeichnis zu durchsuchen muß man wieder den entsprechenden Ordner auswählen. (Sehr ärgerlich)
Genau geht es um folgendes Phänomen:
Phase 5 V5.4.2:
Eine Suche nach einem Wort liefert Treffer (z.B.) in 100 Dateien. Man kann (z.B.) 10 Dateien markieren und per "ENTER" offnen. Das Suchfenster verschwindet dezent im Hintergrund und kann mit der "F11"-Taste wieder zum Vorschein gebracht werden. Die Ergebnisliste ist dabei unverändert und die zehn vorher geöffneten Datein sind noch markiert, so daß man weiß wo man fortfahren muss. Und so kann man in 10er-Schritten alle 100 Treffer prüfen und bearbeiten.
Phase 5 V5.5.0:
Eine Suche nach einem Wort liefert (z.B.) Treffer in 100 Dateien. Man kann (z.B.) 10 Dateien markieren und per "ENTER" offnen. Das Suchfenster verschwindet dezent im Hintergrund und kann mit der "F11"-Taste wieder zum Vorschein gebracht werden. Beim Drücken auf die "F11"-Taste wird die Suchfunktion allerdings vollkommen neu aufgerufen, d.h. die vorhandene Ergebnisliste ist verschwunden. Der Suchlauf muß neu gestartet werden. (Dies habe ich gerade eben noch mal getestet (da ich wieder mit der Version 5.4.2 arbeite) - und es funktioniert genau so.) Ich habe heute extra die Zeit für einen kompletten Suchlauf meiner Seiten gestoppt und bin auf 12 Minuten gekommen. Da macht es einen Unterschied, ob man einmal sucht oder 10 mal.
Die ungeordnete Liste ist nicht mehr mit "einem" Klick aufrufbar. (fehlt mir sehr)
Die Syntax-Hervorhebung funktioniert manchmal nicht. Ich hatte zwei Dateien gleichzeitig geöffnet, in der einen wurden die HTML-Tags blau markiert in der anderen Datei nicht.
Die Funktion "Speichern unter" ist erst in einem Untermenu zu finden, und erfordert somit mehr Klicks als vorher.
Die Sortierfunktion finde ich überhaupt nicht mehr.
The dictionaries are files with an ADM file extension and are available for downloaded in ZIP files. After downloading the file, open the ZIP file and copy the ADM file to the location your application stores its dictionaries.
Dictionaries für den HTML-Editor Phase5
Hier findet man zusätzliche Dictionaries für den HTML-Editor als Download-Dateien. Dort dienen sie zur Rechtschreibprüfung.
In Phase 5 ist die Rechtschreibprüfung unter "Bearbeiten" zu finden.
Diese Website ist ein Versuch, zu demonstrieren, was mit Hilfe von Cascading Stylesheets möglich ist. Praktische Anwendungen werden Schritt für Schritt ausgearbeitet, ergänzt durch eine ausführliche Darstellung von theoretischen Grundlagen und aktuellen Entwicklungen.
...
Für wen ist diese Website?
Sie ist als technischer Ratgeber zum Thema CSS konzipiert ...
...
Was findet man hier?
The Styleworks ist in sechs Abschnitte aufgeteilt:
Die Referenz ist zweigeteilt und enthält als Vollreferenz ausführliche Erklärungen zu allen aktuell gültigen CSS-Eigenschaften und ihren Werten, auch denen, die in CSS 2.1 nicht mehr vorhanden sind und denen, die heute noch kein Browser unterstützt. Zusätzlich werden Hinweise auf künftige Entwicklungen gegeben.
Die Schnellreferenz enthält eine tabellarische Zusammenfassung über alle gültigen CSS-Eigenschaften und Selektoren sowie deren Umsetzung durch die aktuellen Browser. Ihre Aufteilung stimmt im Großen und Ganzen mit den Kapiteln der Spezifikation überein.
Grundlegendes: CSS besteht nicht nur aus den Eigenschaften, sondern erhält seine umfangreichen Möglichkeiten erst durch die Zusammenhänge und Interaktionen zwischen ihnen. In diesem Kapitel werden deshalb wichtige Konzepte und Definitionen erläutert.
Der Abschnitt Tutorials und Artikel bringt praktische Arbeitsanweisungen, Beiträge zu aktuellen Entwicklungen sowie Antworten zu interessanten Fragen und außergewöhnliche Versuche mit CSS.
Unter CSS-Quizzes finden sich Quizfragen in zwei Schwierigkeitsgraden und geordnet nach den Teilgebieten des CSS. Dort kann sich jeder seine Kenntnisse selbst beweisen.
Die Rubriken 'Grundlegendes' und 'Tutorials und Artikel' werden laufend ergänzt und erweitert, die Referenzen werden nur noch aktualisiert, wenn es notwendig ist.
Was findet man auf dieser Website nicht?
...
Warum dieser Name?
Inspiriert zu diesem Namen hat mich der Name des wissenschaftlich-technischen Museums "Scienceworks" in Melbourne. Dort gibt es viel zu sehen, zu lernen, zu erfahren und 'anzufassen', egal ob man die Materie bereits kennt oder nicht. Und das entspricht auch in etwa meinem Konzept für diese Website: "Stylesheets 'zum Anfassen'".
...
Klaus Langenberg
Diese Webseite soll unerfahrenen aber auch erfahrenen Webmastern den Alltag mit ihrer Homepage vereinfachen. Es stehen eine Vielzahl von Online-Tools zur Verfügung die beim generieren von HTML- oder Javacode oder zur Promotion der Page helfen sollen. Es gibt auch viele Tutorials und Tricks wie sie ihre Homepage noch aufwerten können, bzw. verbessern können. Also schauen sie sich um und nutzen sie die Möglichkeit ihre Page zu verbessern und zu optimieren.
Die Bezeichnung dt. "Webseite" ist vom Begriff engl. "website" bzw. "web site" abgeleitet.
Das Wort engl. "site" bedeutet dt. "Ausstellungsgelände", "Bau", "Baugelände", "Bauplatz", "Baustelle", "Gelände", "Grundstück", "Lage", "Lage (eines Gebäudes, einer Stadt etc.)", "Landschaft", "Ort", "Platz", "Platz im Kristallgitter", "Position", "Schauplatz", "site plan" = "Lageplan", "Sitz einer Industrie", "Standort", "Stelle", "Stätte", "Örtlichkeit", "örtliche Lage". Das Wort engl. "site" bedeutet also vieles - aber nicht dt. "Seite".
Das Wort dt. "Seite" bedeutet engl. "page", "side".
Das Wort engl. "website" bedeutet also etwa dt. "Internetpräsenz", also das Gesamtangebot einer Firma, eines Vereins, einer Person, das unter einer Adresse im Internet erreicht werden kann.
Das englische-deutsche Mischwort "Webseite" ist jedoch völlig unsinnig und müßte wörtlich als "gewebte Seite" verstanden werden.
Sowohl das engl. "site" als auch der dt. "Sitz" gehen zurück auf lat. "situs" = dt. "Ort", "Platz", "Stelle".
Das dt. "Seite" als auch das engl. "side" gehen zurück auf althdt. "sito" = dt. "schlaff" (im Sinne von die "schlaffe Seite", d. h. die "Flanke des Körpers").
Im Deutschen gibt es seit kurzem ein neues Wort: "Webseite". Dieses ist offensichtlich eine Lehnübersetzung des englischen "website", ebenso wie "Festplatte" für "hard disk", "Suchmaschine" für "search engine" und dergleichen. Doch bei "Webseite" stellt sich ein ungutes Gefühl ein, spätestens wenn einem eine interne Suchmaschine die Möglichkeit «Search this site» anbietet. Dies kann ja nicht bedeuten «Diese Seite durchsuchen», denn dazu brauche ich ja keine Suchmaschine, dafür genügt der «Find»-Befehl! – Was ist hier schiefgegangen?
Es gibt eine Krankheit namens «Volksetymologie», an der wir alle mehr oder weniger stark leiden: Wenn zwei Wörter völlig verschieden lauten, jedoch dasselbe bedeuten, stört uns das gar nicht. Wenn aber zwei Wörter, vor allem kurze und alltägliche, fast oder ganz gleich lauten, jedoch nicht dasselbe bedeuten, fällt uns das auf und bereitet uns ein merkwürdiges Unbehagen. Diese Reaktion stellt sich übrigens genauso bei Wortpaaren aus einer Sprache wie solchen aus verschiedenen Sprachen ein. Wir versuchen dann, die Bedeutungsdifferenz durch Überbrückung zu erklären («Das heisst so, weil ...»), kommen damit aber sehr oft nur zu unbefriedigenden Lösungen.
Ein Löffel Sprachgeschichte kuriert solche Beschwerden dagegen meist schnell und zuverlässig. Unsere beiden Wörter "site" und "Seite" beispielsweise haben gar nichts miteinander zu tun! Seite ist sprachgeschichtlich identisch mit englisch side. Dass wir ein "t", die Englischsprachigen aber ein "d" sagen, ist eine historisch bedingte Regelmässigkeit. Prüfen Sie nach: "wide", "ride", "glide", "red", "dead", "lead" usw. In den Ausdrücken "auf der anderen Seite" und "on the other side" zeigt sich die Identität noch ganz direkt. Dagegen hat es das Englische vorgezogen, für die "Seite eines Buches", wie so häufig bei sog. Kulturwörtern, einen aus dem Latein stammenden französischen Ausdruck zu entlehnen: "page". Dass wir dafür "Seite" verwenden, kommt daher, dass ein "folium", "ein Blatt eines mittelalterlichen Codex", eben auf der vorderen ("folio recto") und, nach dem Wenden, auf der hinteren Seite ("folio verso") beschriftet werden konnte. Und vielleicht haben wir uns ja gerade deshalb noch nicht dazu durchringen können, "Heimseite" für "homepage" zu sagen, weil es da ja keine Rückseite gibt...
Mit alledem nun hat englisch "site" nichts zu schaffen. Es ist ebenfalls ein Lehnwort aus dem Französischen und bezeichnet wie dort – und ganz ähnlich schon in der lateinischen Form "situs" – einen "Standort". Dies kann z.B. ein Standort sein, auf dem ein Haus oder ein Gebäudekomplex errichtet werden soll, wie nun auf dem elektronischen "site" eine Homepage oder ein "Web project". Es kann aber auch ein archäologisches Grabungsgelände bezeichnen, wo hoffnungsvoll nach etwas gesucht wird, wie wir es nun auch im elektronischen "site" mit einer Suchmaschine zu tun gewohnt sind.
Es bleibt höchstens noch das Problem, wie wir "website" im Deutschen wiedergeben sollen. Es gibt, soviel ich sehe, keine elegante Lösung. Aber brauchen wir denn überhaupt ein deutsches Äquivalent? Gewiss nicht! Schliesslich haben schon die Benutzer des Wortes "Webseite" den ersten Teil englisch belassen. (Wenn man ihn deutsch aufzufassen versucht, kommt heute die unsinnige Bedeutung "eine Seite zum Weben" heraus.) Können wir es dann mit dem zweiten Teil nicht ebensogut gleich halten? Es war ja ohnehin nur die phonetische Ähnlichkeit von "site" und "Seite", die zur Verdeutschung des zweiten Teils verlockte. Diese aber ist, wie wir nun wissen, sehr ungünstig. Als Fazit somit die Empfehlung: Verwenden wir das "Website", bestücken wir es mit vielen schönen "Seiten", aber begraben wir die "Webseite"!
Allen YouTubes und Instagrams zum Trotz besteht das Web auch in den Zehnerjahren zu weiten Teilen aus Text. Es sollte uns nicht gleichgültig sein, wie dieser gestaltet und dargestellt wird.
„Warum sieht meine Bildunterschrift auf dem iPad so matschig aus? Wie geht man sinnvoll mit Weißraum und Zeilenlängen um? Und welches ist eigentlich der beste Webfont-Hostingdienst?“
Mit einem thematischen Rundumschlag, der von den Feinheiten der Schriftglättung über klassische Typoknigge bis hin zu praktischen Softwaretipps reicht, meldet sich Blogveteran und Typograf Gerrit van Aaken (praegnanz.de) zu Wort. Sein Erstlingswerk darf sich im Grunde kein deutschsprachiger Webdesigner entgehen lassen.
Kurzbeschreibung
Dieses Buch beweist ein für allemal, dass Design, das auf Standard-Vorlagen beruht, nicht langweilig sein muss. Dieses Inspirations-Wunderwerk diskutiert anhand von Beispielen der CSS-Zen Garden-Website, wie CSS-basierte Websites entwickelt werden, die den visuellen Ansprüchen kommender Web-Generationen entsprechen und zeigt Methoden, die durch CSS so erst möglich werden. In Abschnitten zu Design, Layout, Bildbearbeitung, Typografie und Effekten führen die Autoren durch jede Phase des Design-Prozesses. Als ganz besonderes Goodie zum Abschluss rekonstruiert das Kapitel 7 den Aufbau von ausgewählten Sites und zeigt so die Herangehensweise von Weltklasse-Designern auf.
Buchrückseite
Willkommen! Dieses Buch beschreibt ein Projekt, das mithelfen soll, die Zukunft des Webs zu gestalten. Zen und die Kunst des CSS-Designs kam aufgrund einer am 8. Mai 2003 gestarteten Website zustande. Diese Site sollte die Herangehensweise an Webdesign ändern und mauserte sich zu einem internationalen Phänomen. Sie trägt die Bezeichnung "CSS Zen Garden" und ist eine Gemeinschaftsarbeit vieler talentierter Menschen rund um die Welt. Wir nehmen das 5jährige Jubiläum des Zengardens zum Anlass, das Buch neu aufzulegen. Der CSC Zen Garden ist längst ein Klassiker und hat schon zahlreiche Webdesigner inspiriert. Darum haben wir das im Jahr 2005 erschienene englische Originalbuch überarbeitet und aktualisiert. Der Zen-Garten ist größer geworden und alle im Buch präsentierten Beispiele sind weiterhin aktuell sowie online abrufbar. Dabei lernen Sie grundlegende CSS-Design-Regeln bzw. wichtige Webstandards anschaulich und praxisnah kennen. Wenn Sie bislang noch nicht und nur recht wenig mit CSS gearbeitet haben, werden Sie schnell von der Flexibilität und den zahlreichen Design-Möglichkeiten begeistert sein.
...
Kapitel 1, Die Quellansicht Ein Überblick über die Entstehung des CSS-Zen-Gartens und die Entwicklung von CSS; Erläuterung einer sauberen Markup-Struktur und der Grundlagen des Designs.
Kapitel 2, Design Grundlegende Designelemente und ihre Umsetzung für das Web. Farbtheorie, Proportionen und Positionierung, Verhältnis zwischen Schrift und Fotografie, harmonische Verwendung von Adobe Photoshop und CSS.
Kapitel 3, Layout Die technischen Grundlagen für den Aufbau komplexer CSS-Layouts. Spalten, Float-Elemente und Positionierungschemata.
Kapitel 4, Bilder Die Verwendung von Bildern zur Verbesserung des Layouts und ihre Erstellung. Bildersetzung, Format von Grafi kdateien und die Suche nach geeignetem Bildmaterial.
Kapitel 5, Typographie Alles über Schriften; Einschränkungen im Web und Notlösungen dafür. Unter anderem geht es um Schriftgrößen, Schriftarten und bildbasierte Typen.
Kapitel 6, Spezialeffekte Neue Tricks, nachdem Sie die Grundlagen gemeistert haben. Fortgeschrittene CSS-Effekte zum Filtern von Stilen für verschiedene Browser, neue und flexible Layouttechniken, Lösungen für technische Einschränkungen mit intelligentem Code.
Kapitel 7, Rekonstruktion Ein Blick über die Schulter von sechs Designern, um herauszufinden, wie sie es gemacht haben. Ausgewählte Designs werden in diesem Kapitel Schritt für Schritt neu erstellt. Sie erleben mit, wie die Prinzipien aus den vorhergehenden fünf Kapiteln zusammen angewendet werden, um die gewünschte Wirkung zu erzielen.
Other Submissions 1/11
This page is an archived list of submitted Zen Garden designs that didn't make the cut for one reason or another. Due to many of these designs being hosted on servers outside our direct control, expect broken links. The designs added to the Zen Garden are also available. Total designs listed: 1039
Erstellt: 2011-01
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
webdesigner-magazin
Webdesigner-Magazin
Das Online-Angebot des Webstandards-Magazin ist recht dürftig. Die Download-Möglichkeiten erschließen sich nur dem Käufer der Zeitschrift.