We have shown that you can specify the visual aspect of your component using the Seaside brush API. These brushes will make it easy to produce valid XHTML code. We have also demonstrated that you can use all the power of Smalltalk to specify your content, and that all the visual aspects of your application can be specified using CSS.

The method renderContentOn: is automatically invoked by Seaside. It allows you to specify the output of the application. Brushes are used to paint XHTML tags onto a canvas object. Blocks are used to create a scope within tags. For example:

htmlparagraphwith:[htmlrender:'today']

renders the string ’today’ within <p>today</p>. A brush is an expression of the form:

htmlbrushattributes1;attributes2;with:anObject

Code can be made more compact in two ways.

When the nested expression is a single object you can avoid blocks. The expression html paragraph with: [ html render: 'today' ] is equivalent to html paragraph with: 'today'.

When you don’t need to configure the brush’s attributes, you don’t need to use with:. The expression html paragraph with: 'today' is equivalent to html paragraph: 'today'.

In conclusion the following three code snippets create exactly the same output. For readability and to avoid having to type unnecessary code, we usually choose the shortest version possible: