0
Webseiten sind keine Gemälde

Webstandards für ein besseres Web




        Webstandards für ein besseres Web
Webkrauts


Die Initiative für die Webkrauts ging von einem
Blogeintrag im August 2005 aus.
Nach dem Aufruf fanden sich in...
Webkrauts


    Die Webkrauts setzen sich dafür ein, die Vorteile
●


    der Webstandards auch im deutschsprachigen
    R...
Webseiten sind keine Gemälde


    WWW als Oberfläche für den Austausch
●


    wissenschaftlicher Informationen entwickel...
Am Anfang war ...


    Die Aufbruchstimmung
●



        Jeder wollte mitmischen, alles mußte schnell gehen
    –

      ...
Webseiten sind keine Gemälde


    Eine Webseite ist ein Dokument
●



    Es gibt
●



        Absätze, Listen, Überschri...
Webseiten sind keine Gemälde


    Vom Inhalt, nicht von der Gestaltung her denken!
●



    Webseiten sind Dokumente!
●

...
Was wissen wir über den Surfer?


    Nur daß er die Seite anschaut. Sonst nicht viel!
●



Wichtige Fragen für die Entwic...
Standards?

                    XML             HTML
       SVG
W3C                      CSS                WCAG
      Mat...
Was sollen Standards?


    Sie können helfen, daß ich früher nachhause gehe.
●



    Alle Browser haben eine gemeinsame ...
Gegenfrage: was soll DAS?




Besser wäre es so:




                     Webstandards für ein besseres Web
Ebenen einer Webseite



        Dynamik              Javascript, DOM


         Layout              CSS


         Strukt...
Semantik


    Die Inhalte einer Webseite werden danach
●


    ausgezeichnet was sie sind, nicht wie sie aussehen
    sol...
Semantik und Layout


    Erst bestimmen, was es ist, dann das Aussehen
●


    bestimmen.
    Wenn die Überschrift die gl...
Jeder Browser hat sein Stylesheet




            Webstandards für ein besseres Web
Ein bischen CSS-Magic




            Webstandards für ein besseres Web
Ein HTML, viele CSS: CSSZengarden




           Webstandards für ein besseres Web
Das gleiche HTML, anderes CSS




            Webstandards für ein besseres Web
Das gleiche HTML, anderes CSS




            Webstandards für ein besseres Web
Das gleiche HTML, anderes CSS




            Webstandards für ein besseres Web
Empfehlenswerte Bücher (1)




http://www.amazon.de/dp/3898428370/



                                      Webstandards f...
Empfehlenswerte Bücher (2)
     http://www.amazon.de/dp/3898428370/
                                           http://www....
Am Ende


                                                http://webkrauts.de




                                        ...
Upcoming SlideShare
Loading in...5
×

Webseiten sind keine Gemaelde

1,853

Published on

Webseiten sind keine Gemälde - Webstandards für ein besseres Web. Vortrag vor der PHPUG in Frankfurt.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,853
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
17
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Webseiten sind keine Gemaelde"

  1. 1. Webseiten sind keine Gemälde Webstandards für ein besseres Web Webstandards für ein besseres Web
  2. 2. Webkrauts Die Initiative für die Webkrauts ging von einem Blogeintrag im August 2005 aus. Nach dem Aufruf fanden sich innerhalb von etwa drei Tagen über 60 Interessierte zusammen. Die Webkrauts sind weder eine Organisation, noch ein Verein. Wir sind eine Initiative. Webstandards für ein besseres Web
  3. 3. Webkrauts Die Webkrauts setzen sich dafür ein, die Vorteile ● der Webstandards auch im deutschsprachigen Raum stärker zur Geltung zu bringen. Webstandards bieten viele Vorteile für alle, die das Internet benutzen. Webdesigner und -entwickler unterstützen wir ● dabei, Standards einzusetzen und so ihre Arbeit zu verbessern. Wir leisten Aufklärungsarbeit durch ● Veröffentlichungen im Netz und in anderen Medien. Webstandards für ein besseres Web
  4. 4. Webseiten sind keine Gemälde WWW als Oberfläche für den Austausch ● wissenschaftlicher Informationen entwickelt textorientiert – wenige Elemente – Content is King – Kommerzialisierung ging schnell und ungeplant ● Tabellenlayout: der erste Hack im Web ● Analogie zu Altbekanntem – Webstandards für ein besseres Web
  5. 5. Am Anfang war ... Die Aufbruchstimmung ● Jeder wollte mitmischen, alles mußte schnell gehen – Browser“krieg“ um Vorherrschaft im Web – Webstandards für ein besseres Web
  6. 6. Webseiten sind keine Gemälde Eine Webseite ist ein Dokument ● Es gibt ● Absätze, Listen, Überschriften ... – Es gibt keine ● Fussnoten, Anmerkungen, Subheadlines, Werbung ... – HTML ist leider semantisch schwach. – Webstandards für ein besseres Web
  7. 7. Webseiten sind keine Gemälde Vom Inhalt, nicht von der Gestaltung her denken! ● Webseiten sind Dokumente! ● Webstandards für ein besseres Web
  8. 8. Was wissen wir über den Surfer? Nur daß er die Seite anschaut. Sonst nicht viel! ● Wichtige Fragen für die Entwicklung einer Webseite: Ist der Browser komplett geöffnet? ● Ist der Rechner auf Invertierung geschaltet? ● Wie schnell ist die Internetverbindung? ● Sind Plugins installiert und Javascript an? ● Wie ist Grundschriftgröße seines Systems? ● Welche Schriften sind installiert? ● u.v.m. Webstandards für ein besseres Web
  9. 9. Standards? XML HTML SVG W3C CSS WCAG MathML WCAG (Web Content Accessibility Guidelines) SWF XMLHttpRequest ECMA-Script innerHTML Webstandards für ein besseres Web
  10. 10. Was sollen Standards? Sie können helfen, daß ich früher nachhause gehe. ● Alle Browser haben eine gemeinsame Basis, die sie ● interpretieren und die ich kenne. Keine Sonderbehandlung notwendig. ● Es wird eine Seite entwickelt, nicht verschiedene ● Varianten. Standards sind zur Qualitätssicherung da. ● Webstandards für ein besseres Web
  11. 11. Gegenfrage: was soll DAS? Besser wäre es so: Webstandards für ein besseres Web
  12. 12. Ebenen einer Webseite Dynamik Javascript, DOM Layout CSS Struktur (X)HTML Inhalt MySQL, XML Business-Logik PHP, ASP, JAVA Webstandards für ein besseres Web
  13. 13. Semantik Die Inhalte einer Webseite werden danach ● ausgezeichnet was sie sind, nicht wie sie aussehen sollen. Eine Überschrift wird mit <h1> bis <h6> umfaßt. ● Eine Liste wird mit <ul> oder <ol> und <li> ● gemacht, nicht einfach Absätze untereinander oder Zeilenumbrüche Das Aussehen kommt durch CSS. ● Webstandards für ein besseres Web
  14. 14. Semantik und Layout Erst bestimmen, was es ist, dann das Aussehen ● bestimmen. Wenn die Überschrift die gleiche Schriftgröße wie ● der Absatz hat, kann man trotzdem nicht auf die Überschrift verzichten Webstandards für ein besseres Web
  15. 15. Jeder Browser hat sein Stylesheet Webstandards für ein besseres Web
  16. 16. Ein bischen CSS-Magic Webstandards für ein besseres Web
  17. 17. Ein HTML, viele CSS: CSSZengarden Webstandards für ein besseres Web
  18. 18. Das gleiche HTML, anderes CSS Webstandards für ein besseres Web
  19. 19. Das gleiche HTML, anderes CSS Webstandards für ein besseres Web
  20. 20. Das gleiche HTML, anderes CSS Webstandards für ein besseres Web
  21. 21. Empfehlenswerte Bücher (1) http://www.amazon.de/dp/3898428370/ Webstandards für ein besseres Web
  22. 22. Empfehlenswerte Bücher (2) http://www.amazon.de/dp/3898428370/ http://www.amazon.de/dp/3827323797/ http://www.amazon.de/dp/382724224X/ http://www.amazon.de/dp/8790785754/ http://www.amazon.de/dp/3827324777/ http://www.amazon.de/dp/3815825989/ http://www.amazon.de/dp/3827323436/ Webstandards für ein besseres Web
  23. 23. Am Ende http://webkrauts.de http://blog.grochtdreis.de Jens Grochtdreis Diese Präsentation steht unter der Creative Commons Lizenz „Attribution-ShareAlike 2.0“ http://creativecommons.org/licenses/by-sa/2.0/de/ Webstandards für ein besseres Web
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×