Kapitel 05 - Teil 3 - Feingeschliffen

maninweb

Hallo zusammen...

heute - kurz vor Weihnachten - ist's fast geschafft. Im letzten Kapitel zu unserem
Workshop geht's darum, der Seite den letzten Feinschliff zu geben.

Und - ouups - ein Problem bei der Darstellung zu beseitigen. Also, in diesem
Sinne, nix wie ran...

Kapitel 05 - Teil 3 - Feingeschliffen

Grüße

Lisa

Hallo womaninweb,

so, da habe ich nun heute nachmittag noch Teil 3 durchgearbeitet. Und da es noch gar keine Rückmeldungen gibt, fange ich mal an.

Teil 2 von Kapitel 5 war wieder sehr gut strukturiert, habe da viel gelernt. Teil 3 dagegen fand ich etwas verwirrend. Den Schnelldurchlauf bei der Designänderung fand ich etwas ärgerlich. Vor allem wegen der unsystematischen Bezeichnungen und Namen der Grafiken war der Zusammenhang irgendwie schwer erkennbar. Im body wird plötzlich eine Grafik bg.gif eingebunden. Wegen der unspezifischen Namen hatte ich dort zunächst meinen neuen Farbverlauf drin, und der sah in y-Richtung gekachelt wirklich dämlich aus. Aber das betrifft jetzt wirklich mehr den Aufbau der Lektion (falls die Verwirrung der didaktische Sinn war, dann bitte diesen Absatz ignorieren ).
Was noch merkwürdig ist: Der untere Rand im Inhalts-Container lässt sich für den Mozilla bei mir partout nicht erzeugen.
Weiter bewirkt *html #content { margin-left: -406px; } bei mir gerade das Gegenteil, nämlich einen Versatz, während wenn ich es auskommentiert lassen, gibt es keinen Versatz.

So ich stelle mal hier den Link ein zu meinem etwas abgespeckten Ergebnis. An irgendeiner Stelle habe ich vermutlich einen der Schlagschatten versehentlich gelöscht, habe es aber erst hinterher gemerkt, und die Verzerrung der Schrift ist auch nicht gerade der Glanzpunkt, aber egal: Ziehenders Welt
Kritik zum Code ist mir natürlich herzlich willkommen.

Da ich mir ein solches Fiasko wie bei der Übung ersparen will, denke ich natürlich vorher gut über meine künftige Seite nach (was da wo gekachelt werden soll Wink

). Dabei drängen sich noch folgende Überlegungen auf:

Wenn ich später mal ein "Corporate Design" einführe (was ich nach bislang 20-jähriger Selbstständigkeit noch nicht habe, es war noch nie Zeit dafür ), muss ich dann auf allen Seiten den Kopf austauschen. Na gut, das kann man ja in einem einmaligen Kraftakt noch bewältigen. Jedoch:
Wenn ich dann neue Unterseiten einfüge, muss ich ja jedesmal auf allen Seiten das linke Menü anpassen. Könnte man das nicht irgendwie so lösen, dass Kopf und Menüleiste in einer separaten Datei abgelegt und jeweils von da "geholt" oder referenziert werden. Im Falle der Ergänzung von Seiten/Menüpunkten könnte man dann die Änderungen in dieser Menü-Datei vornehmen und müsste nicht "zu Fuß" alle Seiten ändern. Wie kann man das "dynamischer" lösen?
"Darf" man denn in diesem Stadium nun zu einem anderen Editor übergehen? Vor allem beim css-Schreiben unterlaufen selbst mir (!) zwar nicht unbedingt Schreibfehler, aber Syntaxfehler (irgendwie schleichen sich immer := Zuweisungen ein, in css darf es ja nur ein Doppelpunkt sein). Auch das tag-Schreiben ohne Makro bzw. Shortcuts ist lästig. Bis jetzt mache ich das alles mit dem Proton, der hat aber außer Syntax-Highlighting nicht viel zu bieten.
Welchen sollte man da nehmen? Phase5 und NetObjects Fusion 8 habe ich schon irgendwann heruntergeladen, aber ja (leider) bis jetzt noch nicht ausprobiert.
Und last but not least, ein wenig ketzerisch: Ist das jetzt eigentlich der Abschluss des Workshops oder gibts noch einen "fortgeschrittenen"?

Du siehst, ich stecke noch immer in der Konzeption fest, möchte aber möglichst gut strukturiert herangehen (sozusagen mit wohlüberlegter Faulheit).

Nochmal ganz herzlichen Dank für Eure Arbeit und besonders für Deine Geduld,

liebe Grüße
Lisa

womaninweb

Hallo Lisa,

ich fange erstmal da an, wo ich am schnellsten helfen kann.

Den unteren Rand bekommst du, wenn du die Höhenangaben aus den Containeranweisungen #inhalt entfernst. Den brauchst du sowieso nicht mehr.

Was den Versatz angeht, so weiss ich nicht, welchen Browser du verwendest. Ich habe deine Seite im IE 6 angeschaut und dort ist der Versatz wieder da. Meine Vorlage für das Tutorial habe ich mir auch mal im IE 7 angesehen und dort ignoriert der IE die Anweisung mit dem Versatz und stellt alles korrekt dar. Schmeiss auch da mal die Höhenangabe von 100% raus, mal sehen, was dann passiert.

Es tut mir leid, wenn die Änderungen in den Grafiken zur Verwirrung geführt haben. Beabsichtigt war es schon, in dem Fehler reinzulaufen. Zum einem, um noch mal vor Augen zu führen, dass Vorüberlegungen, auch im Entwurf, die Arbeit vereinfachen. Zum anderen zeigen wir aber auch, so hoffe ich, dass mit einer guten CSS Struktur solche "Patzer" kein Beinbruch sind. Durch die strikte Trennung von Gestaltung und Inhalt haben solche Änderungen wenig Einfluß auf den Inhalt. Vielleicht wäre es für den Einstieg leichter gewesen eine Version zu basteln, die glatt funktioniert. Anderseits dachte ich mir, wenn der geneigte Leser in den Selbstversuch geht, wird er früher oder später auf ähnliche Probleme stossen und dann vielleicht frustriert sein. Ihm vorher Möglichkeiten aufzeigen, wie man mit Problemen umgehen kann, schien mir sinnvoll. Jedenfalls hast du dir schon überlegt, was du wie machen möchtest ohne in Fehler reinzulaufen. Was natürlich nicht heisst, dass es nirgendwo zu Problemen kommt. Wink

Hätten mehr Bilder geholfen die Änderungen nachzuvollziehen? Wenn du da konkrete Vorstellungen hast, was dir beim Verständnis geholfen hätte, immer her damit!

Was die spätere Umsetzung deiner Seite angeht, so ist im Voraus abzuklären, wie oft du z.B. deine Menüpunkte ergänzen musst. In unserem angenommen Beispiel ist dies nicht so oft der Fall, so dass das Einfügen eines weiteren Listenelements in alle Seiten nicht in Schwerstarbeit ausartet. Musst du deine Seite öfters ändern, so wäre über ein einfaches CMS nachzudenken. Das erfordert allerdings auch ein wenig (mehr) Kenntnis der Materie und Geduld, sich darin einzuarbeiten.

Was eine Fortsetzung angeht, so hatten wir ja geplant, das Ganze nochmal in Expression Web nachzuvollziehen. Dabei stände aber eher die Handhabung des Programms im Vordergrund. Die Grundlagen haben wir ja mit diesem Tutorial beschrieben. Ich hätte allerdings nichts dagegen, mehr zu schreiben. Ist aber auch eine Frage der Zeit.

Wenn du dich in HTML und CSS soweit sicher fühlst, spricht nichts dagegen einen professionelleren Editor zu nutzen. An die Syntax wirst du dich trotzdem gewöhnen müssen, alles nimmt einem der Editor doch nicht ab. Wink

Also, wenn du noch Verbesserungsvorschläge hast, bin ich absolut offen.

Gruß,
womaninweb

Lisa

Hallo womaninweb,

das ging ja wieder schnell. Mit dem unteren Rand passt es jetzt sehr gut, nachdem ich die Höhe herausgenommen habe. Und den Versatz sehe ich jetzt auch nicht mehr, getestet in FF 1.5.0.12 und IE 6.0 unter Windows 2000. Herzlichen Dank.

Und Du hast natürlich ganz Recht: Solche Probleme treten früher oder später höchstwahrscheinlich auf, selbst wenn man glaubt, alles (theoretisch) vorher zu bedenken, kann man ja nicht wissen, womit was die User die Seite ansehen. Mehr Bilder brauche ich persönlich nicht (aber wirklich meine ganz persönliche Ansicht). Mir hilft eine durchsichtige (logische) Bezeichnung und Struktur, also z.B. bekommen bei mir Container und Bilder zusammengehörende Namen, etwa inhalt.jpg im Container Inhalt, kopf.jpg und kopf_verlauf.jpg im Container Kopf usw.

Alles in allem denke ich, dass der Workshop ganz gut gelungen ist. Ich nehme an, Ihr stellt die einzelnen Tutorials auch noch auf Eure eigene Site. Dort ist die Formatierung dann sicher etwas großzügiger - hier im Forum sind (sicher softwarebedingt) die Zeilenabstände recht gering und der Code nicht kopierbar, dadurch wird es etwas unübersichtlich. Man überliest leicht einen entscheidenden Satz. Wenn ich mir dagegen Eure neue CSS-Referenz ansehe, die gefällt mir sehr gut: sehr schön übersichtlich und gut gegliedert.

Nun, mit dem Editor werde ich jetzt erstmal etwas testen. Und das sollte für den Anfang schon gehen. Ich habe mir gerade überlegt, wenn man die Site immer schön übersichtlich gliedert (mit Kommentaren) lässt sich ja der Menüblock möglicherweise mit Suchen/Ersetzen durch den Editor austauschen.

Hab noch mal herzlichen Dank,

liebe Grüße
Lisa

Office Forum -> Workshops -> Workshop: Webdesign für Einsteiger
zurück: Ablaufplan weiter: Kapitel 02 - Teil 4 - Der Konformist – XHTML!		Unbeantwortete Beiträge anzeigen
	Status: Feedback	Diese Seite Freunden empfehlen Zu Browser-Favoriten hinzufügen

Forum / Themen		Antworten	Autor	Aufrufe	Letzter Beitrag
Verwandte Themen
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 02 - Teil 1 - Mit HTML und XHTML ins Internet	1	womaninweb	4039	21. Dez 2007, 16:06 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 02 - Teil 3 - Es lebt immer noch!	1	womaninweb	2717	21. Dez 2007, 16:05 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 02 - Teil 4 - Der Konformist – XHTML	1	womaninweb	2459	21. Dez 2007, 16:04 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 03 - Teil 2 - Schaffe, schaffe, Seite bastle	1	womaninweb	2540	21. Dez 2007, 16:03 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 03 - Teil 3 - Stein auf Stein ...	1	womaninweb	2249	21. Dez 2007, 16:03 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 04 - Teil 1 - Style Sheets – Blätter aufgebrezelt	1	womaninweb	2116	21. Dez 2007, 16:01 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 04 - Teil 2 - Hat es deine Augen oder meine?	1	womaninweb	2049	21. Dez 2007, 16:01 maninweb
	Wichtig: Workshop: Webdesign für Einsteiger: Kapitel 05 - Teil 3 - Feingeschliffen	1	womaninweb	1852	21. Dez 2007, 16:00 maninweb
	Workshop: Webdesign für Einsteiger: Kapitel 04 - Teil 3 - Kaskadierung, Prioritäten, Boxmodell	5	maninweb	2124	16. Sep 2008, 17:19 womaninweb
	Workshop: Webdesign für Einsteiger: Kapitel 03 - Teil 2 - Schaffe, schaffe, Seite bastle	19	maninweb	2699	13. Sep 2008, 19:55 womaninweb
	Workshop: Excel Projekte: Pivot-Tabelle - Teil 1 - Erstellung von Pivot-Tabellen	0	Lukas Mosimann	7339	26. Apr 2008, 07:59 Lukas Mosimann
	Workshop: Webdesign für Einsteiger: Kapitel 05 - Teil 1 - An die Arbeit, fertig, los!	5	maninweb	1450	03. Apr 2008, 11:05 voler

- Kapitel 05 - Teil 3 - Feingeschliffen

- AW: Kapitel 05 - Teil 3 - Feingeschliffen

- AW: Kapitel 05 - Teil 3 - Feingeschliffen

- AW: Kapitel 05 - Teil 3 - Feingeschliffen

Du kannst Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum antworten. Du kannst deine Beiträge in diesem Forum nicht bearbeiten. Du kannst deine Beiträge in diesem Forum nicht löschen. Du kannst an Umfragen in diesem Forum nicht mitmachen. Du kannst Dateien in diesem Forum nicht posten Du kannst Dateien in diesem Forum herunterladen


----> Diese Seite Freunden empfehlen <------	Impressum - Besuchen Sie auch: HTML Editor Forum