Schnellste Methode zum Erlernen des Webdesigns für einen Entwickler

8

Ich bin ein Webentwickler und in meinen Projekten habe ich festgestellt, dass mein schwächster Punkt im Front-End-Design nicht gut ist. Sich auf andere Designer zu verlassen, kann ärgerlich sein, wenn sie nicht so schnell produzieren können, wie ich es möchte.

Meine Perspektive auf HTML / CSS ist, dass es im Grunde genommen ein großer Hack ist, der erstaunlich funktioniert. Es gibt zu viele CSS- und Browser-spezifische Bugs / Macken, um sie zu lernen und sich an sie zu erinnern, ohne extrem viel Zeit zu verschwenden, um alles zu entwirren. Gibt es eine schnelle Route, um CSS in mein Gehirn zu bekommen? Ich habe mir einige CSS-Bücher angeschaut, aber für mich haben sie wirklich lange Listen gelesen, wie man Dinge in IE6 richtig rendert und Ecken rund macht. (Im Ernst, warum erfordert es so viele Tricks, um eine scharfe Ecke zu machen? Auf jeder Plattform außer dem Web würde dies eine große Aufsicht genannt werden.)

Gibt es etwas, das analog zu CSS funktioniert, das jQuery für JavaScript verwendet? Mit jQuery müssen Sie JavaScript nicht gut beherrschen, um Dinge zu machen, die funktionieren.

Ich bin nicht daran interessiert zu erfahren, warum IE6 Dinge auf seltsame Art und Weise macht, weil ich es überhaupt nicht unterstütze. Ich interessiere mich mehr für eine Methode zu lernen, CSS zu benutzen, um das zu tun, was ich will, ohne Stunden damit zu verbringen, obskure Blogs zu lesen.

    
hekevintran 24.12.2009, 21:44
quelle

6 Antworten

4

Ja, es gibt CSS-Frameworks, die die "jQuery of CSS" sind. Einige der beliebtesten sind 960 und Blueprint . Ich persönlich benutze 960 und habe festgestellt, dass es viel Platz im Layout braucht.

Wie andere schon sagten, ist CSS schwer zu lesen. Es ist eines der Dinge, die Sie brauchen, um einen Instinkt für viel Erfahrung zu entwickeln (was in der Regel viel Probe, Fehler und Frustration bedeutet). Es ist, wie Sie hervorgehoben haben, keine ideale Situation, aber es ist, was es ist.

Eine weitere Schwierigkeit besteht darin, dass die Methoden oder der Arbeitsablauf, die verwendet werden, tatsächlich zwischen den einzelnen Personen unterschiedlich sein können. Manche Leute machen zuerst ein Mock-up in Photoshop und erzeugen dann mit HTML / CSS ein exaktes Pixel-für-Pixel-Rendering. Andere verwenden Photoshop, Illustrator oder ein anderes Werkzeug, um Ideen einfach zu skizzieren und neu zu erstellen und dann in HTML / CSS von Grund auf neu zu erstellen. Und wieder andere ziehen es vor, direkt mit HTML / CSS und nur ein paar Skizzen zu beginnen. Herauszufinden, welche dieser Methoden am besten zu dir passt, ist ein wichtiger Teil des Puzzles.

    
T. Stone 24.12.2009, 21:53
quelle
5

Zeichnen Sie mit Bleistift und Papier Ihre Ideen aus (denken Sie in Kästchen, keine Dreiecke oder Sechsecke), dann zerlegen Sie einfach alle kleinen Teile und lernen Sie, wie Sie jedes tun. Kein Problem ist zu groß, dass es nicht abgebaut werden kann. Und wie immer TMTOWTDI!

Finde Beispiele und lerne daraus - so fing ich zumindest an zu lernen. Studieren Sie die verwendeten Stile und spielen Sie mit ihnen herum. Wenn Sie etwas finden, das Ihnen gefällt, erstellen Sie ein Modell und spielen Sie damit herum. Dann testen Sie es für die browserübergreifende Kompatibilität.

Wenn Sie frustriert sind, weil etwas in Firefox und Chrome funktioniert, aber nicht im IE (das wird oft passieren), geben Sie nicht auf. Ich finde den Namen von Bill Gates verflucht und alles, wofür er steht, ist ein großartiger Stressabbau. : -)

Ein großartiges Werkzeug, das ich gerne benutze, ist Firebug , ein Plugin für Firefox, mit dem Sie unter vielen anderen Dingen CSS bearbeiten können Regeln im Browser und sehen die Ergebnisse, sobald Sie es tun.

Ich stimme zu, dass CSS in der Welt des Webdesigns eine Nebensache war, aber es ist eine höllische Erfindung und macht die Dinge so viel einfacher und schneller zu entwickeln.

    
amphetamachine 24.12.2009 22:35
quelle
2

Es braucht ziemlich viel Zeit und Übung. Aber Sie können sich eine Menge Ärger ersparen, wenn Sie Ihren HTML-Code sauber und einfach halten. Hier sind ein paar Regeln, die mir einfallen, die mir geholfen haben:

  • Verwenden Sie DOCTYPE in Ihren HTML-Seiten, beginnen Sie mit dem Übergang, da es die laxesten Regeln hat, und validieren Sie Ihren HTML-Code. Wenn Sie Ihre Seite im Standardmodus und nicht im Quirks-Modus halten, haben Sie deutlich weniger Probleme auf der ganzen Linie.
  • Wählen Sie, welche Browser Sie frühzeitig unterstützen und unterstützen Sie diese in einer logischen Reihenfolge. Für mich entwickle ich in Firefox, dann stellen Sie sicher, dass die Dinge auf Chrom / Safari solide sind. IE kann einen speziellen Kommentar verwenden, mit dem Sie HTML einfügen können, das nur für IE sichtbar ist. Verwenden Sie das, um Stylesheets für IE7 hinzuzufügen, dann IE6, um Stile zu überschreiben und Anzeigeprobleme in diesen Browsern zu beheben. Sie sollten generell mit dem besten Browser beginnen und sich rückwärts arbeiten.
  • Vorsicht beim Auffüllen. Das ist eine der problematischsten Eigenschaften, mit denen ich umgegangen bin. Wenn möglich, wählen Sie ein kleines Sub-Container-Element mit einem Rand anstelle des Padding. Es ist mehr Markup, aber Marge wird in allen Browsern viel besser behandelt.
  • Absolut positionierte Elemente innerhalb von relativ positionierten Elementen. Dies löst eine Menge. Wenn Sie ein Element relativ positionieren, bleibt es im normalen Fluss. Wenn Sie absolute Positionselemente innerhalb eines übergeordneten Elements verwenden, arbeiten die absoluten Elemente in Bezug auf die Position des übergeordneten Elements.
Jage 24.12.2009 22:42
quelle
1

In diesem Fall glaube ich nicht, dass Bücher viel helfen werden. CSS ist extrem einfach zu erlernen und extrem schwer zu beherrschen.

Alles, was ich vorschlagen kann, ist lernen, wie Sie gehen .. Sie brauchen viel Erfahrung!

Oder Sie können die Unterstützung für IE7 und insbesondere für IE6 einstellen. Wenn Sie das tun, werden Sie sehr sehr wenige und sehr, sehr seltene Macken finden:)

    
Andreas Bonini 24.12.2009 21:49
quelle
1

Nehmen Sie einige Kurse im Grafikdesign. Keine Programmiersprache wird Sie zu einem Künstler machen, und für gutes Design der Benutzerschnittstelle wird Kunstfertigkeit benötigt.

[oder Sie könnten bessere Grafikdesigner finden, mit denen Sie arbeiten können]

    
Steven A. Lowe 25.12.2009 01:06
quelle
1

Abonnieren Sie css-discuss , spielen Sie mit den üblichen Problemen und sprechen Sie mit anderen über Ihre Fortschritte. Das Wiki ist ebenfalls eine sehr nützliche Ressource.

    
fuxia 25.03.2010 23:00
quelle

Tags und Links