PIC-WEB Tutorial Preliminary version

Prepared by Ivan Sarmiento and Paul Aguayo.

Ingeniería MCI Ltda. / www.olimex.cl

Introduction

This tutorial will introduce us on how to use the OLIMEX’s PIC-WEB. PIC-WEB is a versatile development board made by Olimex Ltd. that uses the PIC18F452 microcontroller pre programmed with the AN833 TCP/IP stack from Microchip. This board supports the following protocols:

• SLIP • ARP • IP • ICMP • TCP • UDP • HTTP • DHCP • FTP

The Microchip stack is an open source library, which is possible to modify and compile at any time. But you will probably need to modify it to your own needs. The board comes with an implemented WEB server and a web page that let you controls some of the features of the board. In this tutorial we’ll learn about how to compile the TCP/IP stack to use it over

the platform, the needed software, how to use the pre loaded web page, and how to upload your own web pages in the board.

This tutorial requires Microsoft Windows© OS because several software used here is windows compatible only.

If you are experienced with PIC programming, you could jump to Chapter 3.

Materials

• PIC-WEB development Board • Serial DB9 cable • Crossover Ethernet cable • MPLAB (www.microchip.com) • TCP/IP stack (www.microchip.com) • C18 compiler Free Student Version (www.microchip.com)

Chapter 1, Connecting and testing the board

The PIC-WEB comes with a default code and web server that we can test in a couple of simple steps. First of all we have to configure the Ethernet port to be able to work on our local network. That is possible trough the MCHPStack Configuration Console.

Using the PIC-WEB configuration console

It’s possible to modify the network configuration using the configuration console on the serial port, allowing a successful operation on our local net. Using the configuration console we can change the PIC-WEB IP address for example.

To access to the console menu is necessary a serial DB9 cable, to connect the board serial port to one available COM port on your computer. Then you will need to connect the board using a software like windows HyperTerminal. We will use HyperTerminal because it is included on almost all windows machine you can find it on Start->All Programs->Accessories -> Communications. Double click on HyperTerminal and then choose the COM port where the board is connected.

Now is necessary to configure the serial connection to:

• Bits per second: 19200 • Data Bits: 8 • Parity: None • Stop Bits: 1 • Flow Control: Hardware

These are the basics step to configure the connection. If you want to see what you are typing you should set the checkbox “Echo typed characters locally” in File->Properties->Settings->ASCII Setup. Then save the connection for later use.

After this setup the connection with the PIC-WEB should be ready, but the console will not show anything!. That’s because the board is not running on configuration mode. To run on that mode you just need to push the “BUTTON” button on the board. Keep it pressed while you push the “RST” button.

A menu will immediately appear on HyperTerminal showing following options:

The second option allow you to change the board IP number, just type 2, then enter the new IP compatible with your local network configuration. After that push ENTER and return to the main menu again.

Now you must configure the other network parameters: gateway and subnet mask or if you prefer you can enable the DHCP to get the configuration from your router. The first option doesn’t have utility in this tutorial. The seventh will be explained later, but it allows uploading web pages over the serial port. At this moment we will only use the onboard default page.

The last option saves the configuration and restarts the PIC-WEB.

For testing purposes you can connect the board directly to your pc with a crossover ethernet cable1 , configure the board with 192.168.1.151 address, 192.168.1.1 gateway, disable DHCP (option 6) and configure the Ethernet adaptor on your pc with 192.168.1.152 and the same gateway. Here is an example of windows configuration:

This configuration will let you test the board directly from your PC but isn’t too useful. The fun stuff begins when you have the PIC-WEB connected to internet. Just imagine your sensor monitor project, but now you will be able to see the information anywhere just browsing the address of the board!

Test Web Page

As I told you before, the PIC-WEB board has an embedded web server and a demo page. The page shows some of the features of the board and it have a link to Olimex’s PIC-WEB information page.

To access the demonstration page, the server must be accessible from the computer. The default IP address of the board is 192.168.0.30, and 192.168.0.1 is the gateway. Those values must been set to work with your net. In this tutorial we have set IP address of the board to 192.168.1.151. Then we can get the page with any web browser writing the IP address of the board on the address bar.

1 http://www.makeitsimple.com/how‐to/dyi_crossover.htm

In the above figure, you can see the default page that you must get. It shows the temperature of the on board thermistor, the status of the button 1, the value of the potentiometer, and so on.

There are a couple of buttons that you can push:

• Toggle port PD6 • Toggle STAT led

The first one corresponds to PIN 14 of the EXT connector that is the PIC18F452 D6 pin (check out the figure of the PIC-WEB schematic). The second one corresponds to the green STAT led. When you press those buttons the state of the pins changes, you can check it out pressing the “Toggle STAT led” and see how the led switch on or switch off.

Also in the page you can see some values of the PIC-WEB sensors and buttons

• AN_TR • Temp (C°) • BUTTON • PORT D6 y D5

AN_TR shows a measurement from the PIC A/D connected to a 10KΩ potentiometer on the board, you can freely change that potentiometer position and check how the measurement changes.

Temp (C°), shows the value of the temperature sensed by the thermistor in the board connected to another A/D port of the PIC.

BUTTON shows the state of the on board button. It is 1 while the button is not pressed and 0 if it is pressed.

PORT D6 indicate if was pressed “Toggle port PD6” and PORT D5 indicate if was pressed “Toggle STAT led”. If they where pressed, its state changes from one to zero or vice versa.

Chapter 2, Uploading pages to the server

There are 3 ways to upload pages to the server, but you will always need to convert the files you want to upload in a MPFS file format. One of the ways is to include the web page on the source code and link it in a project, but if we did it in this way we won’t use the EEPROM included in the platform wasting program memory, that is reason this method will not be included in this tutorial.

The normal way is to upload the pages using the FTP Server implemented in the Microchip’s TCP/IP Stack or trough the serial port using the console. Both ways are very similar as they use of MPFS binary image file.

Microchip File System (MPFS)

The implemented HTTP server uses the MPFS simplified file system to store the pages on the microcontroller. Then is necessary to transform the files to that file system before upload them. This is done using a program included in PIC-WEB software called MPFS.exe.

Let’s create a simple “Hello Word” page and upload it in to the HTTP server.

First of all it’s necessary to create a directory on your PC where to put the files you want to upload to the web server. The “index.html” is a must have file because that is the default page read by the server. We will also upload a picture “olimex.gif”. The code of the page is the simplest possible:

Now you have to create the binary MPFS file that will hold the directory of our “Hello World” page. This step is done by just a simple command:

<HTML> <HEAD> <TITLE>Hello World</TITLE> </HEAD> <BODY> <p align="center"> <img border="0" src="olimex.gif"> </p> <font face="Arial" size="10"><p align="center"> <b>Hello World!!!</b> </p></font> </BODY> </HTML>

MPFS.exe <Web_page_directory> <Output_file.bin>

In our case the directory will be called “Olimex” and the output file “web.bin”:

Now we have a web.bin file that contains our web page in the MPFS format.

Uploading the page

There are two ways to upload the page to the board EEPROM. The first one is using the console, is faster but need direct access to the PIC-WEB. The second is using the FTP Server that the TCP/IP Stack.

To do the first method we must use the HyperTerminal again and the board must be connected to your PC serial port. Go to the configuration console and chose the seventh option “Download MPFS image”. Then it will appear a message “Ready to download MPFS image - Use Xmodem protocol”, this option will put the PIC-WEB in waiting state until we send the file using Transfer->Send File…

After you press Send file it will appear a dialog box that show the upload progress. When it’s finished the console will return to the main menu and our page will be uploaded in the PIC-WEB.

The other way is using the included FTP Server. In the same command prompt were you create de MPFS file, execute a ftp to the board address, in our case 192.168.1.151. Then it will ask for user and password. The user is ftp and the password is microchip, default values that can be changed in the code. After you get connected to the FTP Server with a simple “put web.bin” command you get the web page uploaded.

Now we need to check out if the web page is working. Open a browser and check it:

If you want to upload again the default page, the .bin file comes with the PIC-WEB distribution software, just find it and follow the same steps mentioned above.

Now that you know how to configure the board in your local network and upload pages, we can continue learning about the board features.

Chapter 3, Installing the development environment

The web page that we wrote in last chapter obviously doesn’t have any utility for any application at all. The idea of the PIC-WEB is to have control of the PIC18F452 features over the net using dynamics web pages or others TCP/IP protocols included in the Microchip Stack. In this tutorial we will explain how to create a dynamic web page, but this isn’t the limit of the PIC-WEB and the TCP/IP Stack, you can get further to reach the full capacity of this platform and manage other protocols of network communication between the PIC microcontroller and any client or server in the network.

The PIC-WEB comes with compiled and installed software that can also be downloaded from Olimex web page, this software is based on two basics components from Microchip plus a C compiler. These components are the Microchip AN833 TCP/IP Stack, Microchip MPLAB IDE the PIC microcontroller software development platform and a compatible compiler that can be Microchip C18 this last one isn`t free but Microchip have a free student version that we can use with limited support but it is absolutely functional to our purpose. There is other compatible compiler the Hi-Tech PICC-18. We’ll choose the Microchip compiler for this tutorial.

It will be also necessary to continue with this tutorial to have an ICSP programmer for the PIC18. Is advisable that this programmer be compatible with MPLAB IDE and would be better to have debugger too, but the last one isn’t necessary. You can upload programs to the PIC-WEB with any programmer and software compatible with PIC18 like Olimex’s PIC-PG2 programmer.

MPLAB Integrated Development Environment

MPLAB IDE is free software distributed by Microchip that includes a toolset for development of PIC microcontroller applications for windows OS. It basically integrate transparently other modules like C18 or PICC-18 compilers that strengthen the functionality of MAPLAB and let us program in C language by example. You can download it and get more information in the following link:

http://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&nodeId=1406&dDocName=en019469&part=SW007002

Installation: After you have downloaded MAPLAB IDE from Microchip page, you must decompress it in any directory and execute the installation file (something like “Install_MP760a.exe”) following the typical windows software installation. Complete installation is recommended to avoid compatibility troubles in the project.

MPLAB C18 Compiler

MPLAB C18 is a C compiler intended for the PIC18 family from Microchip. In our case is the needed compiler because the PIC-WEB platform uses the PIC18F452. This software converts C code into PIC18 machine code and link them together into a .HEX file with the proper memory mapping for the microcontroller just ready to be programmed on it. You can download the student version and get more information in the following link:

http://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&nodeId=1406&dDocName=en010014&part=SW006011

Installation: After downloading you must execute the installation file (something like “MPLAB-C18-StudentEdition-v3_12.exe”) and follow the usual steps, but now you need to take care on some stuff. First of all, is advisable to install it in the default directory (C:\MCC18) and add the path environment variables, large directories names can bring troubles with linker. Second is necessary to install MPLAB C18 after MPLAB IDE installation and check the boxes that associate C18 to MPLAB IDE.

After these steps you are able to develop C programs and compile it using MPLAB environment.

Microchip AN833 TCP/IP Stack

The Stack is an application developed by Microchip for been used in its PIC18 family and intended for both Microchip C18 and Hi-Tech PICC-18 compilers. Isn’t necessary to download it from microchip page because it comes with PIC-WEB software, but we encourage you to download its manual for reference purpose. You can download it from this link:

http://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&nodeId=1824&appnote=en011993

Programmer

There are several ways to program a PIC, but the easiest and proper way to program the PIC-WEB is using a compatible programmer with an ISCP connector and compatible with MPLAB IDE. For this purpose it will be used an USB programmer compatible with PICSTART+ sold by Olimex, the PIC-MCP-USB. Also it will be explained how to program using a RS232 JDM compatible programmer, the PIC-PG1 also sold by Olimex, and IC-Prog2 (free software).

PIC-MCP-USB: to use this programmer first of all you must have it connected to the PC trough an USB cable and connected to the PIC-WEB trough an ISCP cable. The PIC-WEB should be connected to the power supply. Also you’ll need to have the FT232 Serial USB bridge driver installed3. Then you must select in MPLAB IDE Programmer->Select Programmer->PICSTART Plus.

2 www.ic-prog.com

3 http://www.ftdichip.com/FTDrivers.htm

The next step is to enable it. The programmer menu will now have more choices available. Just select “Enable Programmer”.

MPLAB IDE will take some seconds to enable it, displaying a message with the Programmer firmware version in the output windows.

If you have something already compiled, you can open the .HEX file and then program it to the PIC-WEB. Just importing the .HEX file in File->Import menu.

For programming the PIC just push the program button on the tools or selecting the menu Programmer -> Program.

PIC-PG1: this programmer is not compatible with MPLAB IDE. It uses the RS232 serial port and it won’t work with Serial USB converters, but is a really economic and simple programmer that do it works.

For use it you need a software compatible with JDM programmer. There is a free one called IC-Prog that can be downloaded from: http://www.ic-prog.com/

For programming just connect PIC-PG1 to the Serial COM Port, run IC-Prog and select the correct device and the correct programmer. You could find a complete guide here to use the PG1:

http://www.olimex.cl/present.php?page=tutorial_PG2C (Spanish version)

http://www.sparkfun.com/commerce/present.php?p=PG1B (English version)

Open the .HEX file generated by the compiler or included in PIC-WEB software and just selects the button “Program All” for upload the code to the PIC-WEB.

Note: we have point out the configuration bits option because it’s an important step of this tutorial, keep in mind for later.

Chapter 4, PIC-WEB Software

It´s time to download the PIC-WEB software distributed by Olimex. The link where you can find it is:

http://www.olimex.com/dev/soft/PIC/PIC-WEB/PIC_WEB_ver3.zip

Unzip it and you will get a directory with a couple of files and another directory with the codes and projects on it. Those two files are:

• PIC_WEB_with_config_bits.hex: the compiled code that is programmed from factory on PIC-WEB. • Web.bin: the default web page (seen on Chapter 1).

There is a directory PIC_WEB that include the code ready to be compiled or modified for your own purpose. This code, that includes the Microchip TCP/IP Stack, is all you need to develop PIC-WEB applications.

Let´s try to compile it.

Start MPLAB and open the mpnicee project if you are using Microchip C18 compiler or htnicee if using Hi-Tech PICC-18.

Note: Remember from Chapter 3 that in this tutorial we´ll use C18 for the examples.

Why this project? The AN833 Stack comes with eight project files that have configuration options dependent of 3 factors.

• Which compiler is used, C18 or PICC-18. • If the Microcontroller net connection use an obsolete SLIP (Serial Line Internet Protocol) that was used in old

modems but is still used by microcontrollers systems or if it use a NIC (network interface card) connector, that is the case of our PIC-WEB.

• If the local net uses DHCP and IP Gleaning for automatic addressing of the board. Since PIC-WEB doesn’t use SLIP, these projects were removed from the Olimex´s software, check out that there are just 4 possible projects. We use C18 compiler and the examples are with a crossover Ethernet cable connection to a PC without automatic IP addressing, then mpnicee project is the proper choice. Also the DHCP option can be changed from the console.

Now, that we have open the project it´ll show several windows. Is time to check that all the configurations are corrects.

Check that the correct microcontroller is selected in Configure -> Select Device...

Check that the necessary include directories are well configured to use C18, those are:

• Include Search Path: MCC18\h • Library Search Path: MCC18\lib • Linker-Script Search Path: MCC18\lib

Now is time to compile! If there aren’t bad configuration the compilation must be successful, that means that you have to get the “BUILD SUCCEEDED” message on the output window.

Note: the version of the MPLAB IDE that you are using can change the last explanation, newer version will appear since this tutorial was written or you can have an old one, that’s means that the software configuration steps can change a little but the main idea is the same. Don’t hesitate if it’s doesn’t work on the first time, just keep trying isn’t complicate.

PIC Configuration Bits

Also called Fuse Bits, these ones can be set in code with compiler specific directives, #pragma config in C18 or _CONFIG for PICC-18. But there’s other way to set them; using the MPLAB IDE when you have a programmer compatible with it, or directly with IC-Prog if your programmer need it.

In the project that you must have successful compiled there is a MainDemo.c file which have in line 143 those configuration directives. There’s an important mistake there, it has the PIC “Power Up Timer” off, that directive generate a malfunction of the board. If you check the PIC_WEB_with_config_bits.hex file, that is part of the PIC-WEB distributed software, you’ll meet the correct Fuse configuration.

These are the correct configuration bits for IC-Prog and for MPLAB IDE (in the figure):

• config 1: 0x2600 • config 2: 0x0E0A • config 3: 0x0100 • config 4: 0x0080 • config 5: 0xC00F • config 6: 0xE00F • config 7: 0x400F

Now you have two choices to configure those Fuses in your project: using your compiler directives or setting them on the programmer software just before programming the PIC.

Your board won’t work well if you don’t adjust them. You’re under advice.

Chapter 5, Dynamic Web Pages Creation

Finally, this Chapter is the real goal of this tutorial. With dynamic web pages you can of this board. Is not simple, but we assure you that everyone can make it work with little patience.

From the AN833 Application Note:”The HTTP Server included with this application note is implemented as a cooperative task that co-exists with the Microchip TCP/IP Stack and the user’s main application. The Server itself is implemented in the source file “HTTP.c”, with a user application implementing two callback functions.” It’s the best description of the basic functionality of a PIC-WEB Dynamic Page, where the HTTP Server included in it work with the main application wrote by the user through a couple of functions, HTTPGetVar and HTTPExecCmd.

For a better understanding of it functionality, let’s start with an explanation of what does the onboard default web page, the same used on Chapter 1. You can find the HTML code of it in the \PIC_WEB\WebPagesOlimex directory, these are the files:

Commands.cgi : file where the form code is wrote, and that send messages to the Stack Commands.cgi.old : some old version absolutely useless, feel free to erase it Index.htm : Main page, without functionality by it own, but implement the frames olimex.gif : Olimex logo Status.cgi : file that shows information from the PIC

Feel free to check the Index.htm file, but the files you really have to care of are the .cgi ones, keep in mind also that index.html is necessary in any project since it’s the default page opened by the web browser and from them you can call the CGI ones. Let’s analyze them.

Status.cgi

When you open this file from a text editor, you’ll find the percentage symbol several times, exactly where the browser shows the important values. For example let’s see this code:

<td><font face="Arial" size="1">AN_TR:</font></td> <td><font face="Arial" size="1">%02</font></td>

Remember that this part of code shows in the browser this result:

A further study of the code reveal several “%” that are showed on the page like some values. Where does values come from? They come from the Stack HTTP Server and the HTTPGetVar callback function implemented in the MainDemo.c file. When the HTTP Server finds the %xx string, where xx is a decimal number between 00 and 99 it call HTTPGetVar function with xx argument, then the HTTP Server replaces the string by the result of the function. Now open the MainDemo.c file and look in the 884 line, where it’s the implementation of HTTPGetVar. You can check there how is implemented the Callback. This is the header of the function:

WORD HTTPGetVar(BYTE var, WORD ref, BYTE* val) The var argument corresponds to the xx value in the HTML code. ref is a reference associated to the variable that we are callbacking, that’s because HTTPGetVar just can return a byte on each call, then the HTTP Server will keep calling it until HTTP_END_OF_VAR WORD is returned. The *val is the pointer to the result byte, it means the value returned by the callback. At the end the function returns a WORD that commands the HTTP Server to keep calling the function recursively or end the procedure.

When the function is called it immediately switches the var value (899 line). The case values are defined upper in the code (line 613) and you must feel absolutely free to modify them. Now you can imagine that calling this function with a specific xx value is the same that just execute the part of the code with the correct case statement. For example let’s understand one of the statements, the one that does correspond to the potentiometer value (%02) in line 910:

case VAR_ANAIN_AN0: *val = AN0String[(BYTE)ref]; if ( AN0String[(BYTE)ref] == '\0' ) return HTTP_END_OF_VAR; (BYTE)ref++; return ref;

To understand this code, you must know that AN0String is an internal variable that have the result of the A/D conversion associated to the potentiometer converted to a string (line 521). It’s calculated in the infinite loop of the Main function, when is called ProcessIO(); in line 364. Look that in the loop where it’s this process there are the Stack resolvers too. Continuing with the part of the code that we are understanding, you can advice that this will return the ref byte of AN0String in each call, increasing its value in one until the callback function reach the end of the string. The first value for ref is HTTP_START_OF_VAR that is equal to 0x00.

This is the starting point to display anything from the PIC code in a Web Page. All that you need is ability with C code and read carefully the AN833 Application Note for reference.

Commands.cgi

When you open this file on a text editor, you’ll find three fundamental TAGs:

<FORM METHOD=GET action=0> <input type=submit name=1 value="Toggle port PD6 "> <input type=submit name=0 value="Toggle STAT led">

Anytime you execute a GET Method from a Form in the CGI page with more than one parameter, the HTTP Server call HTTPExecCmd function. This TAGs appears in the page as Form buttons that invoke the callback anytime it’s pressed. When this happens the HTTP Server parses the Form result and put these parameters in a proper argument for the callback function. Open again the MainDemo.c file and look in the 676 line, where it’s the implementation of HTTPExecCmd. You can check there how is implemented the Callback. This is the header of the function:

void HTTPExecCmd(BYTE** argv, BYTE argc) The first string argv[0] contains the form action, check that in line 690 this character is converted to a proper number for a switch statement. Then this couple of buttons always will call the CGI_CMD_DIGOUT case that is associated with the zero value (line 698). In line 708 the code converts the second argument, which corresponds to the value of “name” in the input TAG, in a proper variable to another switch statement.

Let’s understand what happens if you press the “Toggle STAT led” button. Is clearly that the HTTP Server will calls HTTPExecCmd with the following parameters: argv[0] = ‘0’, argv[1] = ‘0’, argc = 2. Then the part of the code called will be:

case VAR_LED_D5: // NAME=0 /* * This is "D5". * Toggle D5. */ LATD5 ^= 1; break;

This is pretty simple, just switch the value of the PIC port D5 latch with the XOR operator (^). And that changes the state of the state led.

There is an important consideration in this part of the code. The ports must been well configured as output in an initialization function. The one of this project is in line 1087.

Modifying the code

Now you must have understood the basic of functionality of PIC-WEB Dynamic Web Pages is time to trying to make a little change and test it. We’ll add another button that changes the state of one of the digital out pins available, you must check the result connecting a led to it in serial to a resistor and to ground, the Pin A2 corresponding to EXT 1 Pin is chosen. Also the actual state of that led will be displayed in the Results using a simple Javascript code that shows another potential of the board, that HTML permits that the client browser execute some action too.

Then, is time to modify the MainDemo.c MPLAB IDE, add the following lines to your code, is included last no modified line for help finding the place, also the number of the first line to modify before the inclusion:

In line 626: change an obsolete constant, one for using an LCD Display for one to identify our test PIN.

#define VAR_DIGIN_RB5 (0x04) #define VAR_EXT1 (0x0D)

In line 727: another case statement in the HTTPExecCmd callback function

break; case VAR_LED_D6: // NAME=5 LATA2 ^= 1; break;

In line 933: another case statement HTTPGetVar callback function

break; case VAR_EXT1: *val = LATA2 ? '1':'0'; break;

In line 1131: PIN A0 configuration on InitializeBoard function

SPBRG = SPBRG_VAL; TRISA_RA2 = 0; LATA2 = 0; // Initial state is off

The Next step is to compile again the code, and program the PIC-WEB with this new configuration like told in Chapter 3. By default the .HEX file created will be in the same directory with the name “mpnicee.hex”.

Be sure that the Fuse bits are well configured, and the Net parameters are well too.

Now is time to change the Web Page. Go to the \PIC_WEB\WebPagesOlimex directory and open Commands.cgi with any text editor to add these lines:

In line 19: Add the Toggle TEST led form

</tr> <tr> <td><input type=submit name=5 value="Toggle TEST led"></td> </tr> </table>

Go to the \PIC_WEB\WebPagesOlimex directory and open Status.cgi with any text editor to add the following lines:

In line 25: Add the Test Led state result

</tr> <tr> <td><font face="Arial" size="2"> Test Led: </font></td> <td> <SCRIPT LANGUAGE="JavaScript"> if(%05==1) document.write("On".fontsize(2).fontcolor("green")); else document.write("Off".fontsize(2).fontcolor("red")); </SCRIPT> </td> </tr> </table>

Checks out that this modifies include some JavaScript code, which is an example of what you can do. The script doesn’t interfere with HTTP Server response.

The Next step is to upload the page to the PIC-WEB like in Chapter 2. Immediately you must get this result:

When you press that “Toggle TEST led” you must get the led ON and that will appear in Results in words.

Chapter 6, potentials applications

In this last Chapter we just want to comment some application that you can develop with PIC-WEB.

This board is designed to have Web page of no more tan 64 kB, it seems too little, but you must consider that actually more than 90% of pages are images. If you want a lot’s of images in your application is recommended to host them on other server visible on the net where you have the PIC-WEB connected. The potential of it is to generate a fluid communication between some specific sensors or actuators across a TCP/IP net including the controls of it. For that purpose 64 kB of HTML code is enough.