|
Tabellen in css |
Dirty-Harry
Pixelschubser Threadstarter
Beiträge: 13 |
@DukeXP
Du kannst dennoch gerne Deine Anregungen hier posten oder mir per PN zukommen lassen. Bin für konstruktive(also konkrete Vorschläge/code) Anregungen immer zu haben.
@languitar
Für die grundsätzliche Struktur wird sehr wohl CSS eingesetzt. Die einzige Tabelle die eingesetzt wird und auch wohl im Quelltext enthalten bleiben wird, ist die zur Zentrierung. Die Umsetzung zu CSS geht allmählich voran. Die Site wurde ja nicht neu gecodet. Der Großteil des Codes ist noch von der alten Tabellen/Frameseite. Nach und nach werden immer mehr Sachen ins CSS eingepflegt. Über das Design läßt sich natürlich streiten und es mag sein das das eine oder andere mal noch geändert wird aber das ist auch nicht das Problem. Es werden vielleicht auch einige Desognelemente von CSS genommen aber vom Aufbau her soll die Site schon so bleiben. Es geht auch darum die Site komplett mit CSS zu designen. Nebenbei gefragt was ist denn so Tolles an axedon.com(Die Eingabefelder des Kontaktformulars finde ich allerdings schon gut)? Ich weiß nicht ob das Design da per CSS so toll ist. Ich will die Seite nicht schlecht machen aber ich sehe dort nichts etwas besonders tolles oder was mir weiterhilft. So ein Design ist bei unserer Seite ja auch nicht gewollt. Mag sein das das steinzeitlich ist. Wichtig war und ist das Navigation sowie die Newsfeeder von heise und golem immer sichtbar sind und das ohne Javascript oder Frames. Und das ist ja mit CSS erreicht. Ebenso wollen wir schnelle Ladezeiten erreichen und dennoch Klickbuttons und Grafiken benutzen können. Die gesamten Grafiken schlagen mit 329kb zu Buche wovon zunächst 249kb geladen werden. Ich denke das das im Rahmen ist.
Wenn Du nicht scrollen mußt bei 1024 ist das soch genau das was bis dahin erreicht werden sollte.
Was meinst Du mit abgeschaltetem Stylesheet?
MfG Harry
---
Nach Rücksprache mit meinem Bewährungshelfer, meinen Psychiater sowie meinem Anwalt, lehne ich jede juristische Verantwortung für die Inhalte meiner Beiträge ab und schiebe diese auf den anderen Teil meiner gespaltenen Persönlichkeit.
|  Profil
Website
Editieren
Zitieren
|
Ehemaliges Mitglied (#1460)
Posting-Schinder
Beiträge: 609 |
Dirty-Harry schrieb am 13.03.2005 00:16
Die Umsetzung zu CSS geht allmählich voran. Die Site wurde ja nicht neu gecodet. Der Großteil des Codes ist noch von der alten Tabellen/Frameseite. Nach und nach werden immer mehr Sachen ins CSS eingepflegt. |
Ich darf Dir aus Erfahrung sagen, dass Du mit dieser Arbeitsweise den Sinn von CSS niemals verstehen wirst, und immer nur Spaghetticode dabei rauskommt.
Layout mit CSS und Struktur mit semantisch sinnvollem HTML bei Trennung von Inhalt und Layout ist eine völlig neue (eigentlich alte Herangehesweise an die Problematik des Erstellens einer Website. Ich habe die Erfahrung gemacht, dass nur ein Umschreiben und "Auslagern ins Stylesheet" überhaupt nichts bringt. Du hast den Sinn von der "neuen" Arbeitsweise noch nicht verstanden. Das ist deutlich zu sehen. Das ist aber auch nicht schlimm, denn es gehört einiges dazu, sich von jahrelangem Tabellenvergewaltigen zu lösen.
vom Aufbau her soll die Site schon so bleiben. Es geht auch darum die Site komplett mit CSS zu designen. |
Dagegen ist nichts einzuwenden, aber ein Umstieg auf CSS-Layout bedeutet immer ein komplett neu schreiben.
Was meinst Du mit abgeschaltetem Stylesheet? |
Wieder ein Hinweis darauf, dass Du CSS noch nicht im Ansatz verstanden hast. Aber gut, dass Du hier Leute gefunden hast, die Dir das erklären können, wenn Du willst.
Eine mit CSS layoutete Webseite, die mit semantischem HTML strukturiert ist, und wo Inhalt ganz klar von Layout getrennt wurden, ist in JEDEM, und ich meine auch in Netscape 0.8 oder sowas, Browser benutzbar. Das hast Du mit Tabellen nicht, denn ich glaube Netscape 1 oder sogar noch 2 kennt Tabellen nichtmal.
"abgeschaltetes Stylesheet" bedeutet, dass Du die Zeile in der Du Dein Stylesheet einbindest auch rausnehmen kannst, und die Seite trotzdem noch eine klar zu erkennende Struktur hat, und zu 100% benutzbar ist. Klar, das Layout, das Design ist weg. Dinge stehen nicht nebeneinander, sondern untereinander. Aber Die Elemente der Seite sind alle sichtbar und benutzbar.
DAS ist der Fortschritt bei CSS-Layout und semantischem HTML!
Semantisches HTML? Das heißt: HTML so coden, wie früher, wso wie HTML gedacht war. Es gibt für alle Strukturen ein sinnvolles Tag! bis für Überschriften, für Textabsätze, für Adressen, und für Tabellen, usw. So Dinge wie die physische Textauszeichnung in und haben in HTML nichts mehr verloren, wenn man etwas wichtiges ausdrücken will, schreibt man . Woher soll ein Vorlesebrowser wissen, dass er etwas betonen muss? An einem fetten Wort kann er das nicht erkennen!
Dämmerts? Frag ruhig, wenn Dich noch Fragen quälen...das Thema ist nicht einfach für langjährige Tabellendesigner!
Viel Erfolg!
|  Profil
Editieren
Zitieren
|
Dirty-Harry
Pixelschubser Threadstarter
Beiträge: 13 |
@Efchen
Das sind mal vernünftige, positive Worte von Dir.
Es wird schon so sein, dass ein neuer Code dabei herauskommt. Ich sehe dieses Projekt als Lernphase, um Layout und Inhalt zu trennen. Ich möchte es austesten, welche HTML-Tags wie in CSS umgesetzt werden und wirken und welche HTML-Tags sinnvoll und nötig sind und welche nicht. Es geht mir um den Lernprozess und einem Vergleich zwischen beiden Methoden. Die Arbeitsweise ist mir bewusst und bin auch bei anderen Testprojekten so vorgegangen und denke das durch das "Auslagern" ein neuer Code entsteht. Da ja nicht nur einfach ausgelagert wird, sondern die entsprechende Seite neu gecodet wird. Ich hatte nur gemeint, dass wir hier nicht bei völlig null begonnen haben. Du wirst sehen, dass in einigen Teilen der Seite noch Tabellen verwendet werden, während in anderen keine mehr vorhanden sind und das layout dort nur von CSS definiert wird. Die Seite ist zu 100% ohne das Stylesheet zu bedienen und nutzbar. Eine Auflistung welche HTML-Tags man nicht (mehr) verwenden sollte, fände ich ziemlich gut, da ich da doch Lücken habe.
MfG Harry
---
Nach Rücksprache mit meinem Bewährungshelfer, meinen Psychiater sowie meinem Anwalt, lehne ich jede juristische Verantwortung für die Inhalte meiner Beiträge ab und schiebe diese auf den anderen Teil meiner gespaltenen Persönlichkeit.
|  Profil
Website
Editieren
Zitieren
|
Ehemaliges Mitglied (#1460)
Posting-Schinder
Beiträge: 609 |
Dirty-Harry schrieb am 14.03.2005 11:28
Eine Auflistung welche HTML-Tags man nicht (mehr) verwenden sollte, fände ich ziemlich gut, da ich da doch Lücken habe. |
Bei SelfHTML in der Kurzreferenz werden einige Tags unter "physikalische Textauszeichnung" beschrieben, wie z.B. oder . Diese Tags haben keine semantische Bedeutung. Ein ist nur fett, aber was sagt es aus? Nichts. Was bedeutet ein fettes Wort? Das ist nicht definiert. Warum verwendete man bisher fette Worte? Um etwas zu betonen, richtig. Dafür gibt es aber ein Tag, sogar zwei: für Betonung und für stark betont. Du musst Dir bei Deinen Tags immer überlegen, ob sie eine semantische Bedeutung haben. Ein Vorlesebrowser kann aus einem fetten Wort nicht erkennen, dass das Wort hervorgehoben werden soll, bei Verwendung von aber sehr wohl. Überschriften einfach mit zu formatieren, sagt rein gar nichts darüber aus, dass es sich dabei um eine Überschrift handelt. Deswegen muss & Co. her.
Bei SelfHTML kriegst Du schonmal eine kleine Liste, aber wenn Du Dich so fragst, wirst Du selbst herausfinden, was semantisch sinnvoll ist und was nicht. Ein div z.B., das immer als Wundermittel im CSS-Design angepriesen wird, hat semantisch keinerlei Bedeutung. Daher ist es auch falsch, damit nur so num sich zu werfen, dann kommt nur div-Soup bei raus, die im Prinzip auch nicht besser ist, als Tabellenlayout.
Bin für Fragen gerne zu haben!
Gruß,
-Efchen
|  Profil
Editieren
Zitieren
|
Dirty-Harry
Pixelschubser Threadstarter
Beiträge: 13 |
Werde das mit den semantischen TAGS beherzigen. Habe dazu bei SelfHTML die "logische" und "physische" Textauszeichnung" gefunden.
Das die DIVs als Tabellenersatz herhalten ist klar. Welche Alternative dazu gibt es wenn so ein Layout gewünscht wird?
MfG
Harry
---
Nach Rücksprache mit meinem Bewährungshelfer, meinen Psychiater sowie meinem Anwalt, lehne ich jede juristische Verantwortung für die Inhalte meiner Beiträge ab und schiebe diese auf den anderen Teil meiner gespaltenen Persönlichkeit.
Diese Nachricht wurde geändert von: Dirty-Harry |  Profil
Website
Editieren
Zitieren
|
Ehemaliges Mitglied (#1460)
Posting-Schinder
Beiträge: 609 |
Dirty-Harry schrieb am 14.03.2005 21:37
Werde das mit den semantischen TAGS beherzigen. |
Es ist zukunftsweisend, barrierefrei und benutzerfreundlich.
Das die DIVs als Tabellenersatz herhalten ist klar. Welche Alternative dazu gibt es wenn so ein Layout gewünscht wird? |
Aber es ist schlecht. Meiner Meinung nach ist es falsch, sich ein Tabellenlayout anzusehen und zu versuchen, das mit CSS abzubilden. Das geht meistens in die Hose. Das sage ich aus der Erfahrung in diversen Foren heraus. Die Leute klammern sich zu sehr an ihr Layout und sind dafür bereit, das auf Kosten der Semantik zu machen, Sie begreifen nicht, dass die Nutzbarkeit und Barrierefreiheit wichtiger ist, als ein pixelgenaues Layout. Ein Text- oder ein Vorlesebrowser schert sich einen Dreck um pixelgenaues Layout. Nur auf die Semantik kommt es an. Deswegen sollte man ein richtiges CSS-Layout mit einer Layout-losen, semantisch korrekten HTML-Seite beginnen. Erst, wenn die Seite mit Struktur und Content fertig ist, macht man das Layout.
Dabei divs einzusetzen ist nicht verkert, nein, divs sind schon eine nützliche Sache. Aber divs sind semantisch aussagelos und sollten daher sparsam eingesetzt werden. Außerdem blähen zu viele divs (wo man bei Anfängern immer wieder sieht, dass mehr als 50% der divs weggelassen werden können, und weitere 30% durch semantisch sinnvollere Tags ersetzt werden können) den Code unnötig auf, was zu längeren Ladezeiten und dadurch zu höheren Kosten führt.
Versuche einfach mal eine Deiner Seiten neu zu schreiben, ohne Layout, aber mit sinnvoller Semantik. Solange Du keinen Gedanken an das Layout verschwendest, wirst Du merken, dass divs absolut unnötig sind. Erst, wenn Du Elemente gruppieren willst, z.B. um ihnen gemeinsame Eigenschaften zu geben (z.B. zwei Listen, die als Menüs dienen sollen, die an einem Fensterrand kleben sollen (float)), machen divs Sinn.
macht zum Beispiel keinen Sinn. Alle Eigenschaften, die Du dem div zuweisen willst, kannst Du auch dem h1 zuweisen. Beides sind Block-Elemente, sioe verhalten sich also auch noch völlig gleich.
reicht also völlig aus, ist semantisch korrekt und ist kompakter und übersichtlicher.
|  Profil
Editieren
Zitieren
|
Rieke
Foren-Team
Beiträge: 1792 |
Ich weiss ich weis ich weiss ... ich bin ein CSS-Krüppel ... und ja .. eigendlich liebe ich Tabellen ... alles war so schön einfach als sich noch niemand um den Quelltext einer Seite gescherrt hat ... aber ich muss mich den Agumenten beugen und versuche grade einen Teil unserer zukünftigen Seiten mit Inhalt zu bestücken und hierbei weitestgehend auf Tabellen zu verzichten und mit css zu arbeiten.
Leider will es nicht so wirklich wie ich es mir denke ...
tr auf
td auf xxx td zu
tr zu
neue tr auf ...
Das war recht einfach.
Nun gehts im Grunde
div auf div zu
div auf div zu
aber wie bringe ich ihm bei daraus NICHT div auf div zu div auf div zu also nebeneinander stehende Inhalte (spalten) zu machen ?
Ein br ignoriert er einfach und versucht trotzdem das nächste div neben des vorherige zu setzen.
Jemand einen Rat für mich ?
Hier mal ein Stück reduzierter vereinfachter Quelltext
---
|  Profil
E-Mail
Website
Editieren
Zitieren
|
languitar
Foren-Team
Beiträge: 2795 |
|  Profil
Editieren
Zitieren
|
Ehemaliges Mitglied (#1460)
Posting-Schinder
Beiträge: 609 |
Rieke schrieb am 17.03.2005 12:06
Nun gehts im Grunde
div auf div zu
div auf div zu |
Nein. Das ist genauso schlecht wie Tabellen
Jetzt gehts mit semantischem HTML. U.U. kann man da hin und wieder sinnvoll ein div verwenden, aber semantische Bedeutung haben die Dinger keine und sind daher sparsam einzusetzen. Wer glaubt, seine Zellen in divs umzuwandeln, produziert Code der genauso schlecht ist, wie vorher.
|  Profil
Editieren
Zitieren
|
buu
Pixelschubser
Beiträge: 1 |
Hallo,
so eine ähnliche Aufgabe hat sich mir auch in css gestellt - leider kann man dabei kaum auf divs verzichten, da viele browser probleme bekommen, non-divs als blockelement zu behandeln
wenn man eine webside nach logischen gesichtspunkten unterteilt (semantischer natur), ist dann nicht das einzig sinnvolle element das div?
mfg buu
|  Profil
E-Mail
Editieren
Zitieren
|
Ehemaliges Mitglied (#1460)
Posting-Schinder
Beiträge: 609 |
Ich habe nie behaupten wollen, dass ein unsinnig sei. Nur viele Anfänger denken, ein CSS-Layout erstellt man mit . So allein ist das Quatsch.
Sie denken, Formatierungen in CSS kann man nur auf anwenden, positionieren kann man nur s usw. Seine Formate kann man aber auf alle HTML-Tags anwenden (Ausnahmen bestätigen die Regel), und es gibt sehr oft eine semantisch bessere Alternative zu einem div. Anfänger packen oft einfachen Text in ein div, obwohl ein sinnvoller wäre usw.
In der Regel verzichte ich auch nicht auf divs, weil es immer bei der Einteilung des Anzeigebereichs mehrere Elemente gibt, die irgendwie zusammengehören, denen man zusammen einen Abstand oder ein Hintergrundbild geben will usw. Dann ist ein natürlich sinnvoll.
Aber s auf mehreren Ebenen ineinander verschachtelt ist div-Soup. |  Profil
Editieren
Zitieren
| |
|
|