Optimizing HTMLCaptcha

HTMLCaptcha provides the programming convenience of embedded HTML-based images. There is a cost for this convenience, and that is that HTML-based images are not as size efficient as their binary-based counterparts. HTMLCaptcha provides a way to reduce the size of the HTML image output, using a CSS stylesheet.

Note: You should first have read "Using HTMLCaptcha" and understand how to program against the HTMLCaptcha object before reading this. The examples are shown in C#.

After you have instantiated the HTMLCaptcha object, and called Init(), set the HTMLCaptcha object property CompressHtmlOutput to true:

hc.CompressHtmlOutput = true;

Then, retrieve the CSS style information by calling

string myCaptchaStyles = hc.CssStyles;

and save the return value to a string variable. The output of CssStyles() is a string of two CSS classes:

.htcap-row { float:block;height:1px;overflow:hidden; }
.htcap-col { float:left;height:1px;width:1px;overflow:hidden;margin:0;padding:0; }

Print your string variable myCaptchaStyles to the <style></style> part of your web page output.

Optionally, you may set the class names to whatever you like -- for instance, as a measure of additional security. Simply set the HTMLCaptcha properties CssRowClass and CssColClass to your preferred class names before retrieving the CssStyles property:

hc.CssRowClass = "my-row-class";
hc.CssColClass = "my-col-class";

Now you may use HTMLCaptcha as you would ordinarily. When you call OutputCaptcha(), HTMLCaptcha will automatically include the class attributes in the HTML output.