WRTKit design considerations

User interface design

The WRTKit uses views and controls as the basis for all user interfaces, and those views and controls have a look and feel that is more similar to mobile device applications than to web pages, despite the fact that the underlying technology is HTML, CSS and JavaScript. The WRTKit supports both the tab and pointer based navigations modes but staying true with the application-like look and feel, it's often a good idea to use the tab navigation mode as that will probably be more familiar to users.

Consistency and clarity help guiding the user through the widget user interface. As the saying goes, less is more. Instead of having a huge user interface that users must scroll through to get to what they want, consider dividing the user interface into multiple views that only contain controls and functionality that logically fits together. Use NavigationButton controls or the Options menu for navigation between the views.

Keep in mind that the right softkey can be programmatically changed. You can take advantage of this, for example so that you use it to allow users to return back to the previous or parent view.

Consider placing all configurable options in a view that the user can access from the Options menu. If there are more configurable options than what fits within one or two screenfuls then it's probably a good idea to split them into multiple views.

Errors happen so keep those in mind when designing the widget. The WRTKit offers easy to use notification popup dialogs that can be used to show error messages in a way that will be familiar to the user.

Security

Most of methods in the WRTKit that accept strings as parameters use XHTML in their values. This allows the use of custom styles and other rich content in control and view captions, label values, content in content panels, and more. But like always when dealing with untrusted data from the Internet, you have to be careful with the data that you display in the user interface so that you don't end up placing malicious HTML (e.g. with script tags containing hostile code) into your user interface.

Always filter the content that you fetch using AJAX to make sure that no HTML tags have been injected into that content. This is a good idea in any case even if there are no malicious intents, since arbitrary HTML mixed into content can easily cause your user interface to behave in unpredictable ways.