Oracle9iAS Portal Developer Kit
A Primer on Rendering Portlets

Oracle9iAS Portal pages are made up of one or more portlets. Oracle Portal creates these pages using nested HTML tables, with the output of each portlet placed in a cell. Browsers can then display this combined output as a single page with multiple portlets.

This article describes portlet rendering conventions used in Oracle Portal and how they will allow your portlets to be displayed optimally in a variety of customized environments.

BASIC PORTLET RENDERING

Portlets generate text, such as HTML or XML, which browsers use to draw what the portlet looks like. The act of generating this text for display in a browser is called portlet rendering.

Using HTML

Plain HTML is the most basic way to render portlets and provides a great deal of flexibility to portlet developers. You can use almost all standard HTML paradigms such as links, forms, images, tables, and any construct that can be displayed within an HTML table cell.

Some constructs cannot be used simply because they do not display correctly in a table cell. Frames, for example, do not appear when inserted in a table.

Tips for using HTML

Use standard HTML. Improperly written HTML may appear inconsistently across different browsers and, in the worst case, could cause parts of your page not to appear.

- The official HTML specification is available from the W3C.
- Watch out for unterminated and extraneous tags. Tools like weblint and HTML Tidy can help.

The HTML you use also directly affects the perceived performance of your site. Users judge performance based on how long it takes for them to see the page they requested. Browsers need time to interpret and display HTML.

- Deeply nested tables slow performance dramatically on Netscape browsers.
- Avoid lengthy, complex HTML. Portlets share a page with others and the more each portlet generates, the more the browser has to do before it can show anything.

Using Cascading Style Sheets (CSS)

The fonts and colors of every portlet on a page should match the style settings chosen by the user. To accomplish this, these style selections are embedded automatically using a CSS stylesheet on each Oracle Portal page. The portlets can then access these settings for their fonts and colors, either directly or using the API.

If you hardcode the fonts and colors, your portlet may look out of place when the user changes the page style settings. It is also possible that your hardcoded portlet may also print text using the same color as the background.

Tips for using CSS

While different browsers have implemented varying levels of the full CSS specification, Oracle Portal uses a very basic subset of this specification to allow for consistent fonts and colors.

- CSS implementation levels should not affect the consistency of your pages across browsers.
- Avoid using CSS for absolute positioning. Since users can customize their portal pages, there is no guarantee your portlet will appear in a particular spot.

The stylesheet definition is available at the top of Oracle Portal pages. An excerpt looks similar to this:

> `<STYLE TYPE="text/css">
> .PortletBodyColor
> {
> background-color: #FFFFFF;
> }
> .PortletText1
> {
> font-family: Arial, Helvetica;
> font-size: 10pt;
> color: #000000;
> }
> </STYLE>`

In general, you access stylesheet definitions in HTML tags using the class property.

> `<font class="PortletText1">Formatted Portlet Text</font>`

OTHER POSSIBILITIES

Because they are displayed in browsers, portlets can use most technologies that browsers support. Some possibilities include JavaScript, Java applets, and plug-ins. When designing your portlets to use dynamic technologies, you should ask yourself the following questions:

- Can using server-side logic or creative linking substitute for this technology?
- Will this technology affect other portlets on the same page?
- How will this technology react when the page is refreshed?
- What happens when the user clicks on another link and returns to this page using the back button?
- How will the navigation model work?

Revision History:

- September 24, 2000. Version 1.0.5.