YOUR FEEDBACK
shirley wrote: SharePoint 2007 can support Web 2.0. I think Microsoft Office SharePoint Server...
Cloud Computing Conference
March 30 - April 1, New York
Register Today and SAVE !..


2008 East
DIAMOND SPONSOR:
Data Direct
Frontiers in Data Access: The Coming Wave in Data Services
PLATINUM SPONSORS:
Red Hat
The Opening of Virtualization
Intel
Virtualization – Path to Predictive Enterprise
Green Hills
IT Security in a Hostile World
JBoss / freedom oss
Practical SOA Approach
GOLD SPONSORS:
Software AG
The Art & Science of SOA: How Governance Enables Adoption
PlateSpin
Effective Planning for Virtual Infrastructure Growth
Fujitsu
Automated Business Process Discovery & Virtualization Service
Ceedo
Workspace Virtualization
Click For 2007 West
Event Webcasts

2008 East
PLATINUM SPONSORS:
Appcelerator
Think Fast: Accelerate AJAX Development with Appcelerator
GOLD SPONSORS:
DreamFace Interactive
The Ultimate Framework for Creating Personalized Web 2.0 Mashups
ICEsoft
AJAX and Social Computing for the Enterprise
Kaazing
Enterprise Comet: Real–Time, Real–Time, or Real–Time Web 2.0?
Nexaweb
Now Playing: Desktop Apps in the Browser!
Sun
jMaki as an AJAX Mashup Framework
POWER PANELS:
The Business Value
of RIAs
What Lies Beyond AJAX?
KEYNOTES:
Douglas Crockford
Can We Fix the Web?
Anthony Franco
2008: The Year of the RIA
Click For 2007 Event Webcasts
SYS-CON.TV
TOP LINKS YOU MUST CLICK ON


"Skinning" – When Design and Development First Met
Love the skin you're in

Did you know that the terminology known as skinning has been around for quite some time, but never in the hands of mainstream designers and Web developers in the content management space? Simple skinning or skin themes, which are more familiar, started back in the days of Windows when you could change the color/background of your desktop.

From there we have seen an almost cult-like audience of avid designers who wanted to totally transform their desktops, programs, icons, you name it - if it could be changed, someone wants to do it. These are the things that make us push design to the boundaries of being different.

Since then we've seen applications (such as WinAmp, ICQ, and others that have a global-reaching user base) create the start of changing the look and feel of your application. WinAmp began its life in May 1997 (http://en.wikipedia.org/wiki/Winamp) with their Web site's existence (based on a WhoIs check showing that back in December 1999) helping drive its popularity by providing skinning capabilities to let all users choose their own look and feel of the interface while listening to mp3s.

We almost accepted that it was purely for desktop-based applications, until the evolution of DIY Portals in the early years of the new millennium provided a range of preconfigured themes you could choose to display on a Web site. However, most of these were preconfigured, rather crude, and rigid representations of templates that were designed in-house by a team of developers probably working with designers.

In the past there were also limitations bound by technology and that were most likely the lack of involvement with graphic designers. It seems that the designer's perceived value in the eye of the developer has been one of very little importance, even of nuisance until recent times. Until just a few short years ago we had seen elements of themes and skinning, but only in piecemeal and small segments, and never as a holistic approach to a solution being offered to the public as we have today.

Visual Appeal Helps Sell a Great Developer's Code
In a short period of time, with the emergence in abundance of very sophisticated Content Management Systems (CMS), the actual site behavior and programming functionality has improved. The downside has been that a total separation of the process and the visual design has fallen well short. So many tremendously powerful applications simply get bypassed because they don't appeal to the end user.

Whether we like it or not, sizzle-and-wow factor helps sell an idea or product to the decision makers, and something that looks great helps acceptance and adoption of a product. This causes frustration among developers who may be purists, and who are often left behind with less sophisticated but visually appealing applications getting the first look from the end user. This has changed in the last few years. So focused are we on reaching our audience that many companies are investing as much time in overhauling the look and feel UI as they are in developing their application to gain acceptance from a broad audience of often inexperienced but visually spoiled users. This trend is simply part of the cycle of technology development, where cutting edge becomes mainstream and the bar of expectations of Web-savvy users is raised another notch.

With the success of DotNetNuke, a Web Application Framework, the genuine effort to involve designers has seen a powerful portal solution that a development company can encompass in their mix of business solutions. A company's provision of both development and design work can marry their skills and produce a Web site that is visually fantastic and that can perform to their expectations - but we now have another dimension: the excited end user who feels empowered by his or her ability to manage the Web site, which in turn brings about more business opportunities.

Smart Developers Setting the New Standards
This trend has engendered an evolvement of smart developers - who understand that pitching their solution to their prospective clients, employers and existing clients is not just about telling them how good a solution is, but how good it will look. Therefore, part of the process can involve a designer to complete the cycle.

The skinning engine architecture of the DotNetNuke Web Application Framework has been helping to push DotNetNuke to areas most other CM Systems would only dream of. With its unique open source but tightly knit community of thousands of contributors, over the last two years it has evolved to be one of the most advanced online solutions available.

When looking for total flexibility and ease of management, DotNetNuke provides a taste of success for all parties involved. That's not saying that you can simply pick up and understand it in one day. Sure there's a learning curve, but overall, once you understand the methodology, it's almost intuitive as to how things are done.

Why the Excitement About the Word Skinning, Themes, and Designing?
The free-form mind of a designer has very few limitations when designing a DotNetNuke Web site, once a designer understands how it works. The wow factor starts immediately, so a developer who initially appreciated the value of working with DotNetNuke as a solution no longer needs to be apologetic about how it looks.

Developers who work with designers during a project can often pick up simple techniques, usually using CSS, which can be adapted to the next project. A designer who spends some time learning this DotNetNuke will certainly appreciate the flexibility provided, and wil be able to contribute valuable information to a developer to produce a seamlessly integrated Web site.

Having said that, it is important for designers to stretch themselves somewhat and learn a few basic principles. Although DotNetNuke provides free-form designing, it is in fact a rigid framework that must be adhered to when looking at providing a complete workable solution. If a designer can truly embrace a few developer concepts, he or she can master the depth of skinning possibilities that DotNetNuke provides.

DotNetNuke Skinning: Simply Powerful
Skinning in its basic interpretation allows you to customize and change the look and feel of the Web site without disturbing the code that runs it. This completely changes the dynamics of how it will look next time it needs to be updated, and in fact has changed how the business of selling Web sites to customers will be carried out in years to come. One of the key elements of DotNetNuke is the power of the skinobjects/tokens.

Designers can work in either HTML or ASCX (control) mode to create their skins. Skins are packaged together using the images, CSS file, and XML file, and they are zipped ready for installation. When logged in with appropriate permissions, the administrator can then map to their local skin folder, add the skin zip file to the window, and upload the skin.

The skinning engine takes over and parses the information, and if the HTML method of skinning is in use, it integrates information in the XML file and creates the ASCX control file, which is then responsible for outputting the data to the ASPX page. That's the simple explanation, and the skinning engine is truly one of the most remarkable aspects of DotNetNuke.

Some designers who understand the programming side of DotNetNuke may prefer to use the ASCX method of skinning, which eliminates the use of the XML file and allows you to define all functions of the skin within the ASCX file itself.

Some of the key words a DotNetNuke designer/developer will hear are skinobjects, tokens, containers, panes, CSS, Solpart Menu, XML, ASCX, HTML, and third-party controls, just to name a few. These make up the everyday language of the world of skinning.

Skinobjects are programmed elements of code that interact with skin in the form of code-behind controls that allow a designer to provide further enhancements/customizations without the requirement of coding it into the HTML. Two examples are the [CURRENTDATE] and [SEARCH] tokens.

An example using the [CURRENTDATE] skinobject/token allows us to put the current date into the page and from the server, will display the date in a standard format. However as a designer, I can choose to modify several elements of it. I can change the font type using classes, or I can change the text displayed to show different date formats such as dd/mm/yyyy, mm/yyyy, etc.

An example using the [SEARCH] skinobject/token allows me to display text, which is customizable and overrides the default formats, so that I can use words that work within the requirements from the client. Furthermore, I can use an image instead of a word when displaying the search function. All is controlled and managed by the designer, without interruptions to the functionality of the code.

Skinobjects and tokens are still very new in understanding and adoption, and as more designers and developers work together, more complex skinobjects will play an important role in managing the look and feel of site.

Containers are the elements that hold the module function. For example, Print, Syndicate, and Minimize options are held with another element called a container, and when logged in to edit the site, module functions known as actions are then selected from a drop-down menu. Containers are both functional and decorative if required, and while always visible when logged in as administrator, they can be completely hidden when logged out.

Panes must be included in every skin. They are the locations that the modules are applied to when you are adding content to your site. They sit as either <div> tags or as part of the <td> tag. At the very least you need one element called the ContentPane to make any skin work.

Solpart Menu is the default menu that is packaged with every DotNetNuke installation, and much time is spent customizing the menu. It is perhaps the most challenging aspect of DotNetNuke to learn when integrating Web sites with a design.

CSS is used thoroughly throughout the DotNetNuke Web Application Framework, and when developers and designers collaborate, particularly with custom modules, it's perhaps one of the most important elements to work with when designing your DotNetNuke Web site.

XML is the conduit that the skinning engine reads when uploading an HTML skin, and information in the XML file is then parsed to the ASCX file.

ASCX skinning requires some programming knowledge to implement successfully, and it is often the preferred choice of experienced designers. You don't need the HTML or XML files to skin using the ASCX method.

HTML skinning is where all newcomers to DotNetNuke should start until they are familiar with how it works. The skinning engine is more forgiving of errors within the HTML file, and for those who require more backward compatibility, HTML is the way to go.

About Nina Meiers
Nina Meiers is a DotNetNuke core team member who works closely with developers and has been in the UI, skinning, and graphics space for more than eight years. With close to 16,000 registered users on her site, along with nearly 80,000 downloads of her free skins, Nina has worked with many companies, corporations, and indviduals to help them change the look and feel of their Web sites. She is currently writing a book on DotNetNuke skinning and design and details of its release will be publicized shortly. You can visit one of Nina's Web sites at www.xd.com.au.

ENTERPRISE OPEN SOURCE MAGAZINE LATEST STORIES . . .
Minerva Infotech has launched a custom Content Management System (CMS). Minerva Infotech CMS 1.0 is used to create, edit, manage, and publish content in a consistently organized fashion. The content management may include computer files, image media, audio files, video files, electroni...
Following 5 years of research and development, Cfengine AS has released an upgrade of the Open Source, self-repairing software cfengine based on its Promise Theory technology. Cfengine is a self-repairing maintenance engine capable of fixing errors and misalignments in the Data Center ...
JumpBox has announced the release of 38 Open Source applications to the Amazon Elastic Compute Cloud (EC2) service. The release enables server application deployment, configuration, and management almost completely independent of any user hardware. JumpBox offers small to mid-sized org...
With a global recession potentially looming, software development managers are being asked to slash resource budgets in 2009 while maintaining schedules. When you need to deliver more features with fewer coding resources, there is only one answer: hybrid development. Hybrid software de...
It's no secret that open source has turned into a market force, which is giving enterprise software some tough competition. The same can be said for SaaS businesses, which are steadily eating into the market share of the established on-premise players. While it could easily be assumed ...
Wikis are a great software tool for collaboratively creating and editing content. They seem to be an obvious choice for building a community Web infrastructure. Yet they have serious drawbacks that made JBoss.org choose a Content Management System (CMS) instead of a Wiki to build its n...
SUBSCRIBE TO THE WORLD'S MOST POWERFUL NEWSLETTERS
SUBSCRIBE TO OUR RSS FEEDS & GET YOUR SYS-CON NEWS LIVE!
Click to Add our RSS Feeds to the Service of Your Choice:
Google Reader or Homepage Add to My Yahoo! Subscribe with Bloglines Subscribe in NewsGator Online
myFeedster Add to My AOL Subscribe in Rojo Add 'Hugg' to Newsburst from CNET News.com Kinja Digest View Additional SYS-CON Feeds
Publish Your Article! Please send it to editorial(at)sys-con.com!

Advertise on this site! Contact advertising(at)sys-con.com! 201 802-3021

Click Here

SYS-CON FEATURED WHITEPAPERS

ADS BY GOOGLE