DotNetNuke Skins – ASCX vs HTML mode
I got a question yesterday from a designer who is unfamiliar with ASP.NET asking what the difference is between ASCX mode and HTML mode when developing skins and containers for DotNetNuke.
I thought it might be useful to the community if I answered this for everyone.
ASCX files are user controls (an ASP.NET thing). With DNN you can create skins using HTML, and when the file is uploaded on the server tokens are parsed and it is converted to an ASCX file. Or you can just create it as an ASCX file to start with.
The advantage of doing it as an ASCX file is that you have a lot more control and end up with a skin that is not as messed up as the ones that are translated. For example, many skins that are created with HTML end up having a reference to the CSS file in both the skin (or container) and the main page when DotNetNuke sucks the file in. You also tend to end up with a lot more HTML than you really need, even if the translation works right. The final issue is that it is difficult to make a skin that has collapsible sections that are hidden if content is not available for that pane.
The advantage of doing it as an HTML file is that it is a BIT more familiar to a designer and he can use the HTML editor he is familiar with to create the skin or container. This is the main reason the HTML skinning method was designed. At the time, allowing designers to use their tools to skin was a reasonable decision since admittedly the design tools that were available in Visual Studio were a lot weaker than what most designers were used to. Allowing HTML mode also helped increase the adoption rate of DotNetNuke. I doubt that there would be nearly as many skins available for DotNetNuke as there are and, therefore, as many people willing to use it as the first choice solution for so many web sites, if it were not for the fact that designers need to learn very little about DotNetNuke skinning to make it look good.
However, that doesn’t mean using HTML has ever been the best way to create a skin. In my opinion, you are better off doing it as an ASCX file because of the crap that gets placed in the file when you translate. As a designer, you have to learn something anyhow… either how to put ASP.NET user controls in the file (with ASCX) or how to put tokens in the file (HTML). Why not spend a little extra time learning how to use ASCX files and get the control most designers really want anyhow?
It is true that you won’t be able to use Dream Weaver to do your editing. But now that Visual Studio Web Developer Express is out (free tool) you could do your initial design work in Dream Weaver and copy/paste/modify into an ASCX file in Web Developer Express. Or you could do all of your work in Web Developer Express. You might just like it.
Other places talking about DotNetNuke Skinning:
My Thoughts on the new [PACKT] book on DotNetNuke Skinning … – However, as soon as a web site owner takes the time to learn the ropes of constructing a custom DotNetNuke skin, they likely jump the gun and create a skin that ends up looking no better than a $20 skin off Snowcovered, …
Book Review: DotNetNuke Skinning Tutorial – In this review, Shaun discusses Darren Neese’s book, DotNetNuke Skinning Tutorial. Shaun looks at the book from the eyes of a developer whose area of expertise is not design. He offers his insight into the book here.
Other post in DotNetNuke - Skinning
- DotNetNuke - Skinning - June 5th, 2008
- DotNetNuke Skinning - Getting Set Up - June 10th, 2008
- DotNetNuke Skins - Handling CSS Files - June 12th, 2008
- DotNetNuke Skins - Hello, World - June 17th, 2008
- DotNetNuke Skins - Skin Objects - June 19th, 2008
- DotNetNuke Skinning - Containers - June 24th, 2008
- DotNetNuke Skinning - Standard CSS Classes - June 26th, 2008
- DotNetNuke - Avoiding Container Collision - July 1st, 2008
- DotNetNuke Skinning - Dealing with Images - July 3rd, 2008
- DotNetNuke Skinning - SolPartMenu - July 8th, 2008
- DotNetNuke Skinning - Collapsible Containers - July 10th, 2008
- DotNetNuke Skins - ASCX vs HTML mode - August 27th, 2008
If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!
August 29th, 2008 at 4:10 am
Dave – I am not sure what differences you refer to in the parsing engine that converts HTML to ASCX skins. The two should be exactly the same. In DNN 5.0, it will be much easier since you won’t have any XML file to deal with. If you are seeing mangling or problems in the conversion process then please post a bug at support.dotnetnuke.com.
As for designers, I learned a long time ago that you will not get them to give up their tool of choice. It is an “artist” thing. We should accept it and make DotNetNuke better so that it does not matter which tool you choose to use.
August 29th, 2008 at 5:38 am
The two main problems I’ve seen are that the tag for adding a pane adds a DIV. But since you can’t see that DIV in HTML, the designer inserts another DIV, or table, around that DIV, making collapsilbe panes practically impossible.
The second issue I’ve seen, and maybe this is just designers not understanding how to do skins, is that links to the CSS get embedded in the skin.
Maybe that’s been fixed recently? I don’t know. I’m a developer writing from a developers perspective and who has had to fix too many skins I’ve purchased that have had these two issues.
As for converting designers. First, I’ve successfully converted several to using the most recent versions of Visual Studio or Express once they realize that the tool does a better job of producing a presentation layer for ASP.NET than their tool of choice. When I’ve let my designer use their tool, I’ve had to rip out any controls they’ve put in and replace them with .NET controls. Double the work for nothing. This is ASP.NET specific, but, most of my designers are going to be doing work on my modules as well.
Second, this series is written primarily for .NET people. Programmers who have to do design work. If a person who is strictly a designer benefits from what I’ve written, GREAT! But, that’s not the target, and like it or not, more often than not, the bulk of the programmers out there double as designers.
Finally, my experience has been that the designers I have the most respect for are willing to at least give some other tool a try if they are given enough of a reason to. If you have a designer who isn’t willing to at least try making a skin using Visual Studio Express, you probably need a new designer.
I’m glad to hear we won’t need the XML file anymore. That never made any sense to me. I really hope the embedded CSS thing is fixed, or that it gets fixed. But, I really don’t think it is possible to fix the DIV issue, or for the designer to get the control is will want even with those two fixes unless he uses the ASCX method of developing a skin. He might do the initial creation using HTML and run it through the parser, but I think he’ll need to do “clean up” on the final output at the very least. And, he’ll learn while he’s doing that clean up that he might as well do it as an ASCX file to begin with.
September 11th, 2008 at 2:30 pm
Hi! I’m Lisa. I am a designer and I skin in DNN. I thought I’d chime in here.
I prefer to work directly in ascx. Maybe its because I have been using HTML for about 12 years and have worked in php that I’m comfortable with it. I don’t use WYSIWYG like Dreamweaver and like a good designer, I work on a Mac
Whether its an “artist” thing are not, I don’t know. Being a designer, I use things like pencils and photoshop to do the design side of my work and pull out Textmate and my favorite FTP program to do the development side. I try to implement the cleanest code possible and leave the creativity for the design side of things (well, you have to be creative when you are trying to get CSS structure to work in IE 6).
I do look forward to DNN 5.0. I really hope the 3rd party module creators follow suit and make their modules more xhtml compliant.
Thanks!
Lisa
October 8th, 2008 at 10:05 am
Lisa: What do you use then to create the ascx if you are on a mac?