DotNetNuke® Websites: Problem — Design — Solution

Chapter 3. Designing for DotNetNuke — Skins and Skin Components

The first step in creating a new DNN website is to develop the overall look and feel, or specifically, the skin. The skin typically consists of the site's overall layout, use of graphics, and cascading style sheets (CSS) to define the global styles throughout. This visual architecture defines how the site is presented from the user's perspective. First, you establish the user experience you want visitors to have, and then you use the DNN framework to facilitate that user experience. The basic considerations that affect the user's experience are the menu/navigation, use of images, and page structure in terms of content. The menu must be intuitive and should be augmented by navigation hints such as a site map or breadcrumbs on the interior pages that remind users where they are at any given time, relative to the site as a whole. Breadcrumbs refer to a set of small links on the page whose location is defined at the skin level. These links form a trail that enables users to navigate to pages by clicking the link for a page displayed by the breadcrumb.

The good news is that DNN skins can be built using simple HTML and CSS that most developers are familiar with. However, before you write any code, you should consider all the options made possible by DNN's skinning engine, so you can understand and take advantage of the many attributes that can be implemented as part of a skin. This chapter examines the overall visual layout ...