Kann jemand gute Richtlinien für ASP.NET UI Design vorschlagen?

Question

Ich bin ein C# -Entwickler.

Kürzlich musste ich eine Web-Benutzeroberfläche in asp.net 2.0 entwerfen. Ich hatte seltsame Probleme mit der Ausrichtung von Steuerelementen in Visual Studio UI. Ich habe Div, Tabellen-Tags verwendet, um asp.net-Steuerelemente (Beschriftungen, Textfeld, Raster usw.) auszurichten.

Aber das Problem war, was ich sah in Design-Oberfläche von Visual Studio war völlig anders (die meiste Zeit), wenn ich die Seite im Browser anzeigen.

Die Lücke zwischen Kontrollen und Ausrichtungen war nie perfekt. Ich habe andere Entwickler gesehen, die auch Versuchs- und Irrtumsmethoden ohne geeignete Richtlinien machen.

C# -Codierung Ich bin ziemlich gut und ich habe viele Microsoft-Artikel und Hilfematerialien, um mich zu führen.

Aber ich habe nicht die richtigen Artikel und Richtlinien für die UI-Design von asp .net Seiten. Gefunden (kann seine dort sein und ich habe noch nicht gefunden?)

Kann jemand durch mehr Licht auf diesem Thema. Irgendwelche guten Bücher, Vorschläge usw.?

Vielen Dank im Voraus

SNC

Answer 1

Es ist nicht das UI-Design per se. Was Sie brauchen, ist ein solides Verständnis davon, wie CSS und allgemein Stile im Web funktionieren (kurz: sie sind schlecht). Was Sie brauchen, ist ein gutes CSS-Buch. Außerdem müssen Sie den WYSIWYG ASP.NET-Seiteneditor löschen.

Answer 2

Wenn Sie granulare Kontrolle über Ihre HTML/XHTML-Ausgabe wünschen, dann würde ich empfehlen, zu ASP.NET MVC zu wechseln. Bei den beschriebenen Problemen handelt es sich um typische Probleme bei der Verwendung von ASP.NET-WebForms. Wie Anton erwähnt, müssen Sie auch XHTML und CSS verstehen.

Answer 3

Ich bin neugierig, wenn Sie glauben, dass Ihre HTML-Kenntnisse auf Augenhöhe sind. Könnten Sie diese Seite in HTML ohne Visual Studio erstellen und die erwarteten Ergebnisse erhalten (mit Notepad)?

Unabhängig davon, verbringen Sie mehr Zeit im HTML-Markup und weniger Zeit mit der Designer-Oberfläche in Visual Studio. Je besser Sie die Ausgabe verstehen, die ASP.NET erstellt, desto besser wird ein Webentwickler.

Ein Trick, den ich häufig verwende, ist zu wissen, dass Sie nicht neu kompilieren müssen, um aspx-Code zu ändern. Nehmen Sie Ihre Änderungen an der aspx-Datei vor, speichern Sie sie und aktualisieren Sie anschließend Ihren Browser. Benutze auch Firefox und erhalte das Webentwickler-Plugin. Ich benutze die Gliederung Block-Elemente ziemlich oft, um zu verstehen, wo einige meiner HTML-Flow-Probleme auftreten.

Lesen Sie im Web Design. Ich bin ein bisschen zurück, aber ich habe immer geliebt zengarden und zeldman .. Ich bin mir sicher, dass es da draußen besser ist.

Answer 4

Während ich definitiv jedem sage, dass CSS und Positionierung im Allgemeinen besser zu verstehen sind und die Drag-and-Drop-Methode zum Erstellen der Steuerelemente auslässt, denke ich, dass Sie eher etwas früher als später brauchen.

Dafür gebe ich Ihnen Yahoo!'s CSS Grids (JQuery, MooTools und andere Bibliotheken haben auch Raster-Layout-Tools), die Ihnen helfen, Ihre UI schnell fertig zu bekommen. In der Zwischenzeit lesen Sie auf CSS.

(X) HTML ist kompositorisch - nicht anders als XAML (das tatsächlich HTML/CSS nachempfunden ist).Wenn Sie WinForms erstellen, können Sie Ihre Steuerelemente ganz einfach auf das Fenster ziehen, aber nicht mit dem Web. Eine Sache, die der Drag & Drop-Designer vermisst, ist, dass (X) HTML-Komponenten eine Hierarchie zu ihnen haben. Der Designer versucht dies zu überwinden, indem er position: absolute; verwendet, was eine prekäre Krücke ist.

Ihre Steuerelemente müssen mit ihren mehr oder weniger intakten Positionsbeziehungen bereits zusammengesetzt sein, und das bedeutet, dass Sie den Code manuell bearbeiten müssen, um die Dinge in die richtige Reihenfolge zu bringen.