TechEd Braindump: ASP.Net 2.0: Best Practices for Building Web Application UI

 Speaker: Jeff King

 

  • What is good UI? Not just visually appealing. It’s consistent, accessible, standards compliant. It has modular/interchangeable styles. It’s also time efficient.
  • Master Pages
    • Factor redundancies into reusable templates
    • Inheritance concept baked-in architecturally
    • Has unlimited nesting
  • The Content’s page Content control ContentPlaceHolderID property and the Master’s ContentPlaceHolderID ID property must match.
  • You can dynamically switch the master page dynamically in the PreInit event.
  • This guy is typing the server code in the markup page instead of in the code behind. I really don’t like that. I think the code-behind model is great! It offers a logical division between the markup and the code.
  • Working with a graphic designer
    • No need to deliver aspx, just html is fine
    • Avoid (slightly) incongruent page designs
    • Don’t cross the visual line between the master an contend
  • Themes and master pages overlap:
    • Change style sheet by changing Master Page.
    • Change layout by using CSS (Themes)
  • Make an exception for your front page
  • New Navigation controls: Menu, TreeView, SiteMapPath, SiteMapDataSource.
  • If you need a free tab control (there are plenty of tab controls out there) you can change the Menu control into one. Use images & CSS
  • Recommendation: Specify a CSS class for the control (i.e. Menu) and let CSS handle some of the UI.
  • Navigation: Recommended Usage:
    • Not all designs are possible without templates or custom controls. Understand the intrinsic markup structure of each control. Understand Where you can specify CSSClass
  • To enable themes you need to add a folder called app_themes/themename. You also need to add a skin file.
  • Themes Recommended Usage:
    • Do as much as you can inside the Style Sheet. When producing multiple themes, have your designer multiple CSS files but only one XHTML files. http://www.csszengarden.com. Modify layout without changing your Master Page
    • When to use Skins:
      • Foreground images can’t be controlled by CSS
      • Advanced controls and collections
    • What does not belong in themes
      • Global images
      • Shared, Print or other Style sheets

Disclaimer: These are my notes from my experience at TechEd 2005. I do not guarantee the validity or accuracy of these notes. They are my thoughts and what information I felt was important at the time.