HTML/CSS nach neuestem Standard

[Linn]

Hello,
1. <h1>,<p> ,... haben bestimmte Abstände (margin-top) nach oben definiert.
   Wie realisiere ich im speziellen Fall einen noch größeren Abstand?
   - <br> davor?
   - <p></p> davor ?
   - class="Größerer Abstand" ?
   - ??
2. Im Text werden immer wieder Worte oder Textteile unterstrichen, fett oder kursiv oder
   anders dargestellt, ohne dass man sagen könnte "unterstrichen" gedeutet "wichtig", "fett"
   bedeutet "noch wichtiger".
   Sind dann die Klasse unterstrichen, fett oder kursiv "erlaubt", obwohl im Text dann schon
   die Darstellung steckt?

Gruße Linn

[Melvin Cowznofski]

Hallo Linn!

1. <h1>,<p> ,... haben bestimmte Abstände (margin-top) nach oben definiert.

Richtig. Die "definierten" Abstände entsprechen, so wie andere Voreinstellungen, den Defaultwerten des entsprechenden Browsers, müssen also nicht überall gleich sein.

Wie realisiere ich im speziellen Fall einen noch größeren Abstand?

In dem Du die Innenabstände oder die Aussenabstände regulierst. Das sind http://de.selfhtml.org/css/eigenschaften/@title=CSS-Eigenschaften, die mit http://de.selfhtml.org/css/eigenschaften/innenabstand.htm@title=padding und http://de.selfhtml.org/css/eigenschaften/randabstand.htm@title=margin definiert werden.

Sind dann die Klasse unterstrichen, fett oder kursiv "erlaubt", obwohl im Text dann schon die Darstellung steckt?

Du solltest Klassen eher nach der logischen Bedeutung als nach dem Design benennen. Also zB. class="erklaerung" oder class="zusatzinfo", aber nicht class="rot_und_unterstrichen". Wenn Du nämlich eines Tages die Formatierung dieser Bereiche änderst, ergeben die Namen keinen Sinn  mehr.

Generell empfehle ich Dir, Dich mit den Kapiteln <http://de.selfhtml.org/html/text/logisch.htm@title=logische Auszeichnungen> und <http://de.selfhtml.org/html/text/physisch.htm@title=physische Auszeichnungen> vertraut zu machen!

Mit lieben Grüßen

Melvin Cowznofski

[Matthias Apsel]

Om nah hoo pez nyeetz, Melvin Cowznofski!

Ergänzend:

Unser Wiki ist im CSS-Bereich aktueller als die Doku:

http://wiki.selfhtml.org/wiki/CSS/Eigenschaften
http://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Abstand/margin
http://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Abstand/padding

Generell empfehle ich Dir, Dich mit den Kapiteln logische Auszeichnungen und physische Auszeichnungen vertraut zu machen!

Diese Unterscheidung gibt es in HTML5 nicht mehr, es haben alle Elemente eine semantische Bedeutung bekommen.

http://wiki.selfhtml.org/wiki/HTML/Textauszeichnung

Matthias

[Melvin Cowznofski]

Hallo Matthias!

Ergänzend:
Unser Wiki ist im CSS-Bereich aktueller als die Doku

Danke für den Hinweis! Nachdem ich mit der Doku "groß geworden" bin, denke ich beim Verweisen überhaupt nie daran, auf das Wiki statt auf die Doku zu verlinken. Nochdazu, wo ich Design und Layout des Wikis als augenkrebsfördernd empfinde, da das Erscheinungsbild den Charm und das Charisma einer Webseite anno 1999 hat. Aber das ist selbstverständlich eine subjektive Wahrnehmung und wenn das Wiki inhaltlich aktueller ist als die Doku, dann werde ich in Zukunft darauf achten, auf das Wiki zu verweisen.

Generell empfehle ich Dir, Dich mit den Kapiteln logische Auszeichnungen und physische Auszeichnungen vertraut zu machen!
Diese Unterscheidung gibt es in HTML5 nicht mehr, es haben alle Elemente eine semantische Bedeutung bekommen.
http://wiki.selfhtml.org/wiki/HTML/Textauszeichnung

Aber selbst im Wiki steht zB. bei <i> oder bei <b>: "...wird ein Teil eines Fließtextes ausgezeichnet, der sich vom übrigen Text abheben soll, keine besondere Bedeutung hat..." Also _keine_ besondere Bedeutung" heißt für mich aber nicht semantisch! Und auch bei den jeweils angegebenen Beispielen steht "...Das trifft _etwa_ auf ... zu". Während <abbr> oder <cite> sehr wohl eine inhaltliche Bedeutung haben, ist das bei der Verwendung von <i> oder <b> nicht automatisch der Fall, auch wenn die html5 Lahre da vielleicht keinen didaktischen Unterschied mehr daraus macht.

Mit lieben Grüßen

Melvin Cowznofski

[Matthias Apsel]

Om nah hoo pez nyeetz, Melvin Cowznofski!

Nochdazu, wo ich Design und Layout des Wikis als augenkrebsfördernd empfinde, da das Erscheinungsbild den Charm und das Charisma einer Webseite anno 1999 hat.

Ein neues ist in Arbeit. http://wiki-test.selfhtml.org/wiki/Startseite

Matthias

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

Diese Unterscheidung gibt es in HTML5 nicht mehr, es haben alle Elemente eine semantische Bedeutung bekommen.

Meister der Auslassung! Du wolltest sagen „es haben alle Elemente eine semantische Bedeutung *an den Haaren herbeigezogen* bekommen.“

Qapla'

[Matthias Apsel]

Om nah hoo pez nyeetz, Gunnar Bittersmann!

Diese Unterscheidung gibt es in HTML5 nicht mehr, es haben alle Elemente eine semantische Bedeutung bekommen.

Meister der Auslassung! Du wolltest sagen „es haben alle Elemente eine semantische Bedeutung *an den Haaren herbeigezogen* bekommen.“

Ich habe tatsächlich überlegt. Meine Formulierung war "übergestülpt".

Matthias

[molily]

Hallo,

Meister der Auslassung! Du wolltest sagen „es haben alle Elemente eine semantische Bedeutung *an den Haaren herbeigezogen* bekommen.“

Man kann es für beknackt halten, Elementen wie b und i eine inhaltliche Bedeutung zuzuweisen und sie damit fundamental umzudefinieren. Dass diese Formatierungen nicht willkürlich, sondern mit einer inhaltlichen Bedeutung verwendet wurden, lässt sich hingegen schwer leugnen. Aus den Bedeutungen wurden verbreitete gewählt. b und i z.B. wurden in bestehenden Webinhalten tatsächlich so verwendet, das war zunächst eine empirische Erkenntnis. Das ist etwas anders als »an den Haaren herbeigezogen«.

Mathias

[Gunnar Bittersmann]

@@molily:

nuqneH

Man kann es für beknackt halten, Elementen wie b und i eine inhaltliche Bedeutung zuzuweisen und sie damit fundamental umzudefinieren. Dass diese Formatierungen nicht willkürlich, sondern mit einer inhaltlichen Bedeutung verwendet wurden, lässt sich hingegen schwer leugnen. Aus den Bedeutungen wurden verbreitete gewählt. b und i z.B. wurden in bestehenden Webinhalten tatsächlich so verwendet, das war zunächst eine empirische Erkenntnis. Das ist etwas anders als »an den Haaren herbeigezogen«.

Hixies erster Versuch war schon an den Haaren herbeigezogen.

Qapla'

[Linn]

Hi Melvin

Wie realisiere ich im speziellen Fall einen noch größeren Abstand?

In dem Du die Innenabstände oder die Aussenabstände regulierst.

Mit speziell meinte ich in Einzelfällen, die vom Standard abweichen,
also etwa so:

bla bla

Überschrift (mit h1)

bla bla bla

Noch eine Überschrift (mit h1 aber größerem Abstand)

bla bla bla

Du solltest Klassen eher nach der logischen Bedeutung als nach dem Design benennen

Wenn man in einem langen Text viele unterstrichene Worte/Passagen findet, so kann man doch nicht eine gemeinsamer logische Bedeutung finden. Das einzig gemeinsame ist doch allenfalls
ein Hinweis, dass dieser Teil wichtig/zu beachten ist. Nur das kann natürlich auch für einen fett dargestellten Text gelten.
Bei einem fetten/unterstrichenen Teil handelt es sich nicht um eine "erklaerung" oder eine "zusatzinfo"
Gruß Linn

[Matthias Apsel]

Om nah hoo pez nyeetz, Linn!

Frag dich, warum die eine Überschrift anders sein soll. Formuliere diesen Grund in einem Klassennamen.

h1.klassenname wäre dann ein passender Selektor. Wenn es keinen Grund gibt, die Überschrift anders zu formatieren, formatiere sie nicht anders.

Wenn etwa nur die erste Überschrift anders sein soll als alle anderen (dann gibt es keinen inhaltlichen Grund) , verwende strukturelle Pseudoklassen

h1 { gilt für alle }
h1:first-of-type { gilt nur für die erste }

Matthias

[Linn]

Hi Matthias

Frag dich, warum die eine Überschrift anders sein soll. Formuliere diesen Grund in einem Klassennamen.

Anders formatieren heißt im konkreten Fall einen großeren Abstand als üblich zum vorangegangenen Text.
Nachdem in dem von Dir verlinkten Dokument ja auch <br> vorkommt (als Design-Element) wäre doch im konkreten Fall

  
<br>  
<h1>....</h1>  

"erlaubt" und sinnvoll, oder?
Gruße
Linn

[Matthias Apsel]

Om nah hoo pez nyeetz, Linn!

Nachdem in dem von Dir verlinkten Dokument ja auch <br> vorkommt (als Design-Element) wäre doch im konkreten Fall

<br>
<h1>....</h1>

> "erlaubt" und sinnvoll, oder?  
  
Meiner Meinung nach nicht. Schau dir die Seite zum [br-Element](http://wiki.selfhtml.org/wiki/Br) an.  
  
Matthias

-- 
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen [satt und Sattel](http://selfhtml.apsel-mv.de/java-javascript/index.php?buchstabe=S#satt).  
![](http://www.billiger-im-urlaub.de/kreis_sw.gif)  

[Gunnar Bittersmann]

@@Linn:

nuqneH

2. Im Text werden immer wieder Worte oder Textteile unterstrichen

Es ist nicht sinnvoll, auf einer Webseite irgendwas zu unterstreichen, was kein Link ist.

Nutzer sind es gewöhnt, dass Links unterstrichen sind. Sie werden auf alles klicken, was unterstrichen ist, und verägert feststellen, dass nichts passiert.

anders dargestellt, ohne dass man sagen könnte "unterstrichen" gedeutet "wichtig", "fett"
   bedeutet "noch wichtiger".

Was kann man denn sagen?

Sind dann die Klasse unterstrichen, fett oder kursiv "erlaubt", obwohl im Text dann schon
   die Darstellung steckt?

Im HTML sollte die Auszeichnung stecken. Dafür gibt es etliche Elemente: strong, em, mark, dfn, var, cite, …

Qapla'

[Linn]

Hi,

Im HTML sollte die Auszeichnung stecken. Dafür gibt es etliche Elemente: strong, em, mark, dfn, var, cite, …

Ist eine Auszeichnung kein Design-Elemnt und gehörte es dann nicht in CSS?
Gruße
Linn

[Matthias Apsel]

Om nah hoo pez nyeetz, Linn!

Im HTML sollte die Auszeichnung stecken. Dafür gibt es etliche Elemente: strong, em, mark, dfn, var, cite, …
Ist eine Auszeichnung kein Design-Elemnt und gehörte es dann nicht in CSS?

HTML ist eine Auszeichnungssprache.

Matthias

[dedlfix]

Tach!

Es ist nicht sinnvoll, auf einer Webseite irgendwas zu unterstreichen, was kein Link ist.
Nutzer sind es gewöhnt, dass Links unterstrichen sind. Sie werden auf alles klicken, was unterstrichen ist, und verägert feststellen, dass nichts passiert.

Wieviel Prozent der Links (inklusive Menüelemente etc.) sind eigentlich heutzutage noch unterstrichen? Und ist es wirklich so, dass alle verärgert reagieren? Was ist mit unterstrichenen Links, die sich als Klickfalle herausstellen? Führt das zu weniger Verärgerung?

dedlfix.

[Linn]

Hi Gunnar,

Nutzer sind es gewöhnt, dass Links unterstrichen sind. Sie werden auf alles klicken, was unterstrichen ist, und verägert feststellen, dass nichts passiert.

Warum dann in dem Dokument Textauszeichnung die Aussage:

u hervorgehobener Text ohne besondere Bedeutung üblicherweise unterstrichen dargestellt

Das müsste doch dann "depreciated" sein!

Gruße
Linn