» Design: Grundgerüst von Tabellen auf CSS umgestellt

CivicJogi · 03.10.2009, 18:49

Mir ist das neue Design etwas zu hell. Insbesondere die großen weißen Content-Boxen mit der riesigen Schrift, die sich nur geringfügig vom hellgrauen Hintergrund abheben.

Den Header finde ich auch etwas zu gedrungen. Der alte ist auch irgendwie schmuckvoller.

mgutt · 05.10.2009, 10:12

Aktuell weiß ich da keine Lösung. Ich werde da wohl mal einen Designer dran lassen müssen. Als Coder liegen meine Schwerpunkte eben woanders. Allerdings finde ich den Kopf eigentlich nice. Naja mal sehen was zukünftige Entwürfe so bringen.

Ich werde erstmal weiter alles auf CSS umstellen, damit ein Designer möglichst flexibel vorgehen kann. Hier z.B. das Template zur Auflistung der Foren:

<div id="fbox">
	<div id="ftop"><span id="ftlft"></span><span id="ftmdl"></span><span id="ftrgt"></span></div>
	<ul id="ful">
<!-- BEGIN cat -->
		<li class="fcli">
			<a href="{indexrow.cat.U_VIEWCAT}">{indexrow.cat.CAT_DESC}</a>
		</li>
<!-- END cat -->
<!-- BEGIN forum -->
		<li class="fli">
			<dl class="ficon<!-- BEGIN new_posts -->new<!-- END new_posts --><!-- BEGIN forum_icon --> style="background:url({indexrow.forum.FORUM_ICON}) no-repeat"<!-- END forum_icon -->">
				<dt class="ftitle">
					<a href="{indexrow.forum.U_VIEWFORUM}">{indexrow.forum.FORUM_NAME}</a><br />
					{indexrow.forum.FORUM_DESC}
					<ul class="sful">
<!-- BEGIN subforums -->
						<li class="sfli">
							<img src="{indexrow.forum.row.subforums.sub.I_SUB}" border="0" alt="{indexrow.forum.row.subforums.sub.L_SUB_ALT}" />
							<a href="{indexrow.forum.row.subforums.sub.U_SUB}" title="{indexrow.forum.row.subforums.sub.L_SUB_DESC}">{indexrow.forum.row.subforums.sub.L_SUB}</a>
						</li>
<!-- END subforums -->
					</ul>
				</dt>
				<dd class="ftopics" title"{L_TOPICS}">
					{indexrow.forum.TOPICS}
				</dd>
				<dd class="fposts" title"{L_POSTS}"">
					{indexrow.forum.POSTS}
				</dd>
				<dd class="flast">
					<a href="{indexrow.forum.U_LAST_TOPIC}" title="{indexrow.forum.LAST_TOPIC_TITLE_ALT}">{indexrow.forum.LAST_TOPIC_TITLE}</a><br />
					{indexrow.forum.LAST_POST_TIME}
					<!-- BEGIN userlink -->&nbsp;<a href="{indexrow.forum.U_LAST_POSTER}"><!-- END userlink -->{indexrow.forum.LAST_POSTER}<!-- BEGIN userlink --></a><!-- END userlink -->
					&nbsp;<a href="{indexrow.forum.U_LAST_POST}"><img src="{I_LAST_POST}" border="0" alt="{L_LAST_POST}" /></a>
				</dd>
			</dl>
		</li>
<!-- BEGIN link -->
		<li class="fli">
			<dl class="ficon<!-- BEGIN forum_icon --> style="background:url({indexrow.link.FORUM_ICON}) no-repeat"<!-- END forum_icon -->">
				<dt class="ftitle">
					<a href="{indexrow.link.U_VIEWFORUM}">{indexrow.link.FORUM_NAME}</a><br />
					{indexrow.link.FORUM_DESC}
					<ul class="sful">
<!-- BEGIN subforums -->
						<li class="sfli">
							<img src="{indexrow.link.row.subforums.sub.I_SUB}" border="0" alt="{indexrow.link.row.subforums.sub.L_SUB_ALT}" />
							<a href="{indexrow.link.row.subforums.sub.U_SUB}" title="{indexrow.link.row.subforums.sub.L_SUB_DESC}">{indexrow.link.row.subforums.sub.L_SUB}</a>
						</li>
<!-- END subforums -->
					</ul>
				</dt>
				<dd class="fhits">
					{indexrow.link.HITS}
				</dd>
			</dl>
		</li>
<!-- END link -->
	</ul>
	<div id="fbtm"><span id="fblft"></span><span id="fbmdl"></span><span id="fbrgt"></span></div>
</div>
<!-- END footer -->

Normalerweise wäre ich eigentlich auch bei Tabellen geblieben, aber dann ist das nicht so flexibel, weshalb ich mich für ein ul li / dl dd Konstrukt entschieden habe, wie es auch in phpBB3 neuerdings eingesetzt wird.

Ich hoffe, dass insbesondere der Teil ausreichend für einen anständigen Rahmeneffekt sein wird:

<div id="ftop"><span id="ftlft"></span><span id="ftmdl"></span><span id="ftrgt"></span></div>

Damit der untere Teil der Box auch unabhängig von dem oberen Teil bearbeitet werden kann, habe ich diesem andere Klassennamen beginnend mit fb (Forum-Box-Bottom) gegeben. So kann ein Designer bei Bedarf den unteren Teil mit einem Schatten versehen oder sowas.

Allerdings habe ich bisher keine Titel-Reihe für die Boxen vorgesehen. Da muss ich noch was nachbessern.

Das gleiche Konstrukt werde ich denke ich auch bei der Darstellung eines Themas einsetzen. Hier dann dt der Autor und dd der Beitragstext.

Den Validator habe ich auch mal drüber fliegen lassen, da muss noch einiges nachgebessert werden. Über 700 "Fehler" alleine auf der Forenübersicht

CivicJogi · 05.10.2009, 10:32

mguttAktuell weiß ich da keine Lösung. Ich werde da wohl mal einen Designer dran lassen müssen. Als Coder liegen meine Schwerpunkte eben woanders. Allerdings finde ich den Kopf eigentlich nice. Naja mal sehen was zukünftige Entwürfe so bringen.
...

Ich weiß, wir sind hier nicht in einem Grafik-Forum, aber sicherlich gibt es hier auch den ein oder anderen (mich eingeschlossen), der da was zaubern könnte.
So ein kleiner Ausschreibungs-Thread könnte da sicher nicht schaden. Evtl. mit späterer Abstimmung durch die Forenuser und Preise für Platz 1 bis 3.

mgutt · 05.10.2009, 10:42

Da muss aber schon jemand dran, der nicht einfach nur Grafiker ist, sondern Webdesigner. Usability, Ladezeiten und Farbharmonie sind andere Schwerpunkte als möglichst stylisch zu sein.

Deswegen sieht man auch keine große Seite im Netz mit besonders anspruchsvollen Grafiken.

Woll-E · 05.10.2009, 10:45

Ich erinnere dich mal freundlicherweise an unseren PN Kontakt von damals und bereit, mich da mal was näher mit zu befassen.

CivicJogi · 05.10.2009, 11:00

mguttDa muss aber schon jemand dran, der nicht einfach nur Grafiker ist, sondern Webdesigner. Usability, Ladezeiten und Farbharmonie sind andere Schwerpunkte als möglichst stylisch zu sein.

Deswegen sieht man auch keine große Seite im Netz mit besonders anspruchsvollen Grafiken.

Sorry! Ich wusste nicht, dass die eine Fähigkeit die andere automatisch ausschließt. :suspekt:

Woll-E · 05.10.2009, 11:09

Das hat Marc ja auch nicht behauptet, dass es sich ausschließt

mgutt · 05.10.2009, 11:14

Ein Webdesigner hat einen anderen Schwerpunkt bzw. weitere wichtige Fertigkeiten. Dazu zählt z.B. auch CSS, damit man weiß, was eigentlich umsetzbar ist.

Ich will nicht die grafischen Fähigkeiten der Mitglieder bezweiflen, aber Seiten wie z.B. diese hier wären nicht für unsere Besucherzahlen geeignet, auch wenn sie schön aussehen.

@ wolfree
ich adde dich mal in icq

CivicJogi · 05.10.2009, 12:12

Meine Contest-Anmerkung bezog sich erstmal nur auf den Header für das neue Design. Sorry, dass es falsch rüber kam.
Den Rest darauf anzupassen sollte dann kein Problem darstellen. In einem Forum gibts ja da nicht allzu viel unterschiedliche Grafik.
Ein paar Rahmenlinien und Farbverläufe, die ja eh dann dynamisch wiederholt werden und Buttons.

... aber gut, wird schon irgendwie werden!

El Splatty · 05.10.2009, 12:15

menüpunkte sind nicht mehr unterstrichen. browser ist der neueste ff

maxrev.de · Gast

Mach mit!

Wenn Dir die Beiträge zum Thread "Design: Grundgerüst von Tabellen auf CSS umgestellt" gefallen haben oder Du noch Fragen hast oder Ergänzungen machen möchtest, solltest Du Dich gleich bei uns anmelden:

Registrierte Mitglieder genießen die folgenden Vorteile:
✔ kostenlose Mitgliedschaft
✔ keine Werbung
✔ direkter Austausch mit Gleichgesinnten
✔ neue Fragen stellen oder Diskussionen starten
✔ schnelle Hilfe bei Problemen
✔ Bilder und Videos hochladen
✔ und vieles mehr...

Autor	Nachricht
CivicJogi General Name: MikirukimiJumojiki Geschlecht: Fahrzeug: Mazda 3 BM \| Civic EJ9 FL sold Anmeldedatum: 28.12.2008 Beiträge: 4911 Wohnort: MD	03.10.2009, 18:49 zitieren Mir ist das neue Design etwas zu hell. Insbesondere die großen weißen Content-Boxen mit der riesigen Schrift, die sich nur geringfügig vom hellgrauen Hintergrund abheben. Den Header finde ich auch etwas zu gedrungen. Der alte ist auch irgendwie schmuckvoller. Gefällt mir Teilen twittern
▲	pn

mgutt Administrator Name: Marc Geschlecht: Anmeldedatum: 28.08.2004 Beiträge: 52434 Wohnort: Lohmar Meine eBay-Auktionen:	05.10.2009, 10:12 zitieren Aktuell weiß ich da keine Lösung. Ich werde da wohl mal einen Designer dran lassen müssen. Als Coder liegen meine Schwerpunkte eben woanders. Allerdings finde ich den Kopf eigentlich nice. Naja mal sehen was zukünftige Entwürfe so bringen. Ich werde erstmal weiter alles auf CSS umstellen, damit ein Designer möglichst flexibel vorgehen kann. Hier z.B. das Template zur Auflistung der Foren: <div id="fbox"> <div id="ftop"><span id="ftlft"></span><span id="ftmdl"></span><span id="ftrgt"></span></div> <ul id="ful"> <!-- BEGIN cat --> <li class="fcli"> <a href="{indexrow.cat.U_VIEWCAT}">{indexrow.cat.CAT_DESC}</a> </li> <!-- END cat --> <!-- BEGIN forum --> <li class="fli"> <dl class="ficon<!-- BEGIN new_posts -->new<!-- END new_posts --><!-- BEGIN forum_icon --> style="background:url({indexrow.forum.FORUM_ICON}) no-repeat"<!-- END forum_icon -->"> <dt class="ftitle"> <a href="{indexrow.forum.U_VIEWFORUM}">{indexrow.forum.FORUM_NAME}</a><br /> {indexrow.forum.FORUM_DESC} <ul class="sful"> <!-- BEGIN subforums --> <li class="sfli"> <img src="{indexrow.forum.row.subforums.sub.I_SUB}" border="0" alt="{indexrow.forum.row.subforums.sub.L_SUB_ALT}" /> <a href="{indexrow.forum.row.subforums.sub.U_SUB}" title="{indexrow.forum.row.subforums.sub.L_SUB_DESC}">{indexrow.forum.row.subforums.sub.L_SUB}</a> </li> <!-- END subforums --> </ul> </dt> <dd class="ftopics" title"{L_TOPICS}"> {indexrow.forum.TOPICS} </dd> <dd class="fposts" title"{L_POSTS}""> {indexrow.forum.POSTS} </dd> <dd class="flast"> <a href="{indexrow.forum.U_LAST_TOPIC}" title="{indexrow.forum.LAST_TOPIC_TITLE_ALT}">{indexrow.forum.LAST_TOPIC_TITLE}</a><br /> {indexrow.forum.LAST_POST_TIME} <!-- BEGIN userlink --> <a href="{indexrow.forum.U_LAST_POSTER}"><!-- END userlink -->{indexrow.forum.LAST_POSTER}<!-- BEGIN userlink --></a><!-- END userlink -->  <a href="{indexrow.forum.U_LAST_POST}"><img src="{I_LAST_POST}" border="0" alt="{L_LAST_POST}" /></a> </dd> </dl> </li> <!-- BEGIN link --> <li class="fli"> <dl class="ficon<!-- BEGIN forum_icon --> style="background:url({indexrow.link.FORUM_ICON}) no-repeat"<!-- END forum_icon -->"> <dt class="ftitle"> <a href="{indexrow.link.U_VIEWFORUM}">{indexrow.link.FORUM_NAME}</a><br /> {indexrow.link.FORUM_DESC} <ul class="sful"> <!-- BEGIN subforums --> <li class="sfli"> <img src="{indexrow.link.row.subforums.sub.I_SUB}" border="0" alt="{indexrow.link.row.subforums.sub.L_SUB_ALT}" /> <a href="{indexrow.link.row.subforums.sub.U_SUB}" title="{indexrow.link.row.subforums.sub.L_SUB_DESC}">{indexrow.link.row.subforums.sub.L_SUB}</a> </li> <!-- END subforums --> </ul> </dt> <dd class="fhits"> {indexrow.link.HITS} </dd> </dl> </li> <!-- END link --> </ul> <div id="fbtm"><span id="fblft"></span><span id="fbmdl"></span><span id="fbrgt"></span></div> </div> <!-- END footer --> Normalerweise wäre ich eigentlich auch bei Tabellen geblieben, aber dann ist das nicht so flexibel, weshalb ich mich für ein ul li / dl dd Konstrukt entschieden habe, wie es auch in phpBB3 neuerdings eingesetzt wird. Ich hoffe, dass insbesondere der Teil ausreichend für einen anständigen Rahmeneffekt sein wird: `<div id="ftop"><span id="ftlft"></span><span id="ftmdl"></span><span id="ftrgt"></span></div>` Damit der untere Teil der Box auch unabhängig von dem oberen Teil bearbeitet werden kann, habe ich diesem andere Klassennamen beginnend mit fb (Forum-Box-Bottom) gegeben. So kann ein Designer bei Bedarf den unteren Teil mit einem Schatten versehen oder sowas. Allerdings habe ich bisher keine Titel-Reihe für die Boxen vorgesehen. Da muss ich noch was nachbessern. Das gleiche Konstrukt werde ich denke ich auch bei der Darstellung eines Themas einsetzen. Hier dann dt der Autor und dd der Beitragstext. Den Validator habe ich auch mal drüber fliegen lassen, da muss noch einiges nachgebessert werden. Über 700 "Fehler" alleine auf der Forenübersicht
▲	pn email

CivicJogi General Name: MikirukimiJumojiki Geschlecht: Fahrzeug: Mazda 3 BM \| Civic EJ9 FL sold Anmeldedatum: 28.12.2008 Beiträge: 4911 Wohnort: MD	05.10.2009, 10:32 zitieren mguttAktuell weiß ich da keine Lösung. Ich werde da wohl mal einen Designer dran lassen müssen. Als Coder liegen meine Schwerpunkte eben woanders. Allerdings finde ich den Kopf eigentlich nice. Naja mal sehen was zukünftige Entwürfe so bringen. ... Ich weiß, wir sind hier nicht in einem Grafik-Forum, aber sicherlich gibt es hier auch den ein oder anderen (mich eingeschlossen), der da was zaubern könnte. So ein kleiner Ausschreibungs-Thread könnte da sicher nicht schaden. Evtl. mit späterer Abstimmung durch die Forenuser und Preise für Platz 1 bis 3.
▲	pn

mgutt Administrator Name: Marc Geschlecht: Anmeldedatum: 28.08.2004 Beiträge: 52434 Wohnort: Lohmar Meine eBay-Auktionen:	05.10.2009, 10:42 zitieren Da muss aber schon jemand dran, der nicht einfach nur Grafiker ist, sondern Webdesigner. Usability, Ladezeiten und Farbharmonie sind andere Schwerpunkte als möglichst stylisch zu sein. Deswegen sieht man auch keine große Seite im Netz mit besonders anspruchsvollen Grafiken.
▲	pn email

Woll-E Premium-Member Name: Woll-E Geschlecht: Fahrzeug: EH6 Anmeldedatum: 03.05.2009 Beiträge: 21228 Wohnort: Köln	05.10.2009, 10:45 zitieren Ich erinnere dich mal freundlicherweise an unseren PN Kontakt von damals und bereit, mich da mal was näher mit zu befassen.
▲	pn

CivicJogi General Name: MikirukimiJumojiki Geschlecht: Fahrzeug: Mazda 3 BM \| Civic EJ9 FL sold Anmeldedatum: 28.12.2008 Beiträge: 4911 Wohnort: MD	05.10.2009, 11:00 zitieren mguttDa muss aber schon jemand dran, der nicht einfach nur Grafiker ist, sondern Webdesigner. Usability, Ladezeiten und Farbharmonie sind andere Schwerpunkte als möglichst stylisch zu sein. Deswegen sieht man auch keine große Seite im Netz mit besonders anspruchsvollen Grafiken. Sorry! Ich wusste nicht, dass die eine Fähigkeit die andere automatisch ausschließt.
▲	pn

Woll-E Premium-Member Name: Woll-E Geschlecht: Fahrzeug: EH6 Anmeldedatum: 03.05.2009 Beiträge: 21228 Wohnort: Köln	05.10.2009, 11:09 zitieren Das hat Marc ja auch nicht behauptet, dass es sich ausschließt
▲	pn

mgutt Administrator Name: Marc Geschlecht: Anmeldedatum: 28.08.2004 Beiträge: 52434 Wohnort: Lohmar Meine eBay-Auktionen:	05.10.2009, 11:14 zitieren Ein Webdesigner hat einen anderen Schwerpunkt bzw. weitere wichtige Fertigkeiten. Dazu zählt z.B. auch CSS, damit man weiß, was eigentlich umsetzbar ist. Ich will nicht die grafischen Fähigkeiten der Mitglieder bezweiflen, aber Seiten wie z.B. diese hier wären nicht für unsere Besucherzahlen geeignet, auch wenn sie schön aussehen. @ wolfree ich adde dich mal in icq
▲	pn email

CivicJogi General Name: MikirukimiJumojiki Geschlecht: Fahrzeug: Mazda 3 BM \| Civic EJ9 FL sold Anmeldedatum: 28.12.2008 Beiträge: 4911 Wohnort: MD	05.10.2009, 12:12 zitieren Meine Contest-Anmerkung bezog sich erstmal nur auf den Header für das neue Design. Sorry, dass es falsch rüber kam. Den Rest darauf anzupassen sollte dann kein Problem darstellen. In einem Forum gibts ja da nicht allzu viel unterschiedliche Grafik. Ein paar Rahmenlinien und Farbverläufe, die ja eh dann dynamisch wiederholt werden und Buttons. ... aber gut, wird schon irgendwie werden!
▲	pn

El Splatty Grand Master Anmeldedatum: 03.08.2005 Beiträge: 16866 Wohnort: Mandschouku	05.10.2009, 12:15 zitieren menüpunkte sind nicht mehr unterstrichen. browser ist der neueste ff
▲	pn email

maxrev.de Gast	27.02.2010, 10:16 zitieren Mach mit! Wenn Dir die Beiträge zum Thread "Design: Grundgerüst von Tabellen auf CSS umgestellt" gefallen haben oder Du noch Fragen hast oder Ergänzungen machen möchtest, solltest Du Dich gleich bei uns anmelden: Registrierte Mitglieder genießen die folgenden Vorteile: ✔ kostenlose Mitgliedschaft ✔ keine Werbung ✔ direkter Austausch mit Gleichgesinnten ✔ neue Fragen stellen oder Diskussionen starten ✔ schnelle Hilfe bei Problemen ✔ Bilder und Videos hochladen ✔ und vieles mehr...
▲

	Re: √	Letzter Beitrag
Emailversand auf SMTP umgestellt Da es diverse Nutzer gab, die keine Benachrichtigungsmails mehr bekamen, haben wir den Emailversand auf SMTP umgestellt. Wir müssen jetzt warten ob sich das Problem dadurch... [Ankündigungen]von mgutt	7 230	09.12.2011, 22:26 mgutt
Hauptadresse wurde umgestellt Hallo, ab sofort sind wir nur noch unter www.carhififorum.de... von mgutt	2 368	14.09.2009, 08:32 mgutt
Die Suche wurde testweise auf Genauigkeit umgestellt Die Suchergebnisse liefern ab sofort das genauste Ergebnis zuerst, im Gegensatz zu der bisherigen Sortierung nach der letzten Antwort. Demnach resultiert die Suche nach EG3 Tuning an erster Stelle den EG3 Tuning Guide , denn auch wenn dieses Thema... Seite 2, 3 [Ankündigungen]von mgutt	28 651	07.01.2009, 13:33 polynechramorph
Tabellen Ich möchte gern in meinem Wiki eine Tabelle einfügen. In der Hilfe hab ich auch den Quelltext für eine sortierbare Tabelle gefunden. {\| class="wikitable sortable" \|- class="hintergrundfarbe5" ! ABC !! Länge !! Breite !! Farbe !!... von tauchmaus	1 262	13.03.2009, 21:06 mgutt
Tabellen mit Berechnungsfunktion Hallo, ich würde Benutzern in meinem Mediawiki 1.15.1 gerne eine Möglichkeit bieten Formulare auf Tabellenbasis auszufüllen, bei denen z.b. aus allen in einer Spalte eingegebenen Zahlen in einem bestimmten Feld die Summe angezeigt wird. Hat jemand... von sue_li	0 667	14.01.2011, 12:50 sue_li
Vorlage: Tabellen-Fehler {\| class="wikitable" style="float:right; width:300px;" ! colspan="2" style="background:#000000; color:#ffffff" \| {{{Schlacht}}} \|- !colspan="2"... von bsg4ever	0 246	30.06.2010, 06:06 bsg4ever
Tabellen ohne Rahmen Hallo zusammen, Ich versuche verzweifelt durch die Verwendung class wikitable Rahmen um meine Tabellen zu bekommen., doch leider werden diese nicht angezeigt. Habe common.css angelegt (war nicht vorhanden) hat aber nicht zum Erfolg geführt und bin... von Tubantus	1 193	19.06.2012, 22:35 stefahn
hat jemand zufällig KWF tabellen zur hand? ich weiß, is n autoforum aber bin leider nur in autoforen angemeldet.. (sollte ich vielleicht mal drüber nachdenken) egal, zu meiner frage: ich finde meine tabellen zur berechnung des kapitalwertes nicht mehr, hat einer von euch evtl. welche? als... [Geld & Finanzen]von Frauenautofahrer	0 364	11.01.2011, 16:48 Frauenautofahrer
Mediawiki Cargo: Formular mit Tabellen erstellen Hallo zusammen, ich habe die Aufgabe, ein Seitenformular zu erstellen. (Extension: Cargo) In diesem Formular sollen nicht nur Sections, also einfache Textfelder, enthalten sein, sondern auch ausfüllbare Tabellen. Nun ist meine Frage, wie ich das... von eabend	0 23	02.08.2021, 13:15 eabend
Tabellen haben keine Sortier-Pfeile Moin ! ich meine zu nachfolgender Frage - es hat schon einmal funktionert! Es geht darum das wir Tabellen wie folgt aufgebaut haben: {\| class="wikitable sortable" \|Nummer \|Status \|Kurztext \|Bearbeiter \|Anmerkungen \|- <!--... von jan99	2 78	18.05.2015, 08:42 jan99