A.E.Veltstra
05/03/2002
Een doorsnee webpagina bestaat uit een of twee indexen, en de rest van de pagina bevat een boodschap. De pagina die nu voor u ligt is op dezelfde wijze opgebouwd. Bovenaan de pagina vindt u een groepsindex, aan de rechter zijkant staat een artikelindex. De groepen zijn redelijk statisch, dat wil zeggen dat de index niet vaak veranderd zal worden. De artikelindex daarentegen verandert steeds; er zullen artikelen wegvallen en andere toegevoegd worden.
Omdat de pagina's in de Omega Junior Websuite geen gebruik maken van frames, worden de indexen in de pagina's zelf opgenomen. Dat betekent, dat als een artikelindex wijzigt, dat alle webpagina's aangepast moeten worden. Dit is een tijdrovende bezigheid, die voorkomen kan worden. Sommige mensen geven er daarom de voorkeur aan hun websuite te onderhouden met een speciaal daarvoor gemaakt programma, zoals Macromedia Dreamweaver, Adobe Go!Live, Claris Clickworks, Microsoft Frontpage of zelfs Microsoft Interdev. Deze programma's hebben alle hun eigen voor- en nadelen, waar dit artikel niet op in zal gaan.
Als u op dezelfde wijze denkt als ik, dan gebruikt u BareBones BB-Edit, Microsoft Notepad of een andere simpele tekstverwerker om uw pagina's te onderhouden. Dan wilt u niet telkens alle artikelen aanpassen als er een artikel bijkomt, enkel om de artikelindexwijziging door te voeren. U wilt de indexen eenmaal aanmaken, en als u één index aanpast, wilt u dat gelijk voor alle pagina's hebben aangepast. En u wilt geen enkel artikel aanpassen enkel omdat u de index wijzigt.
Het best kunt u dan gebruik maken van een zogeheten include, een bestand dat ingevoegd wordt in een ander bestand. Nu zijn er voor webpagina's twee soorten includes. Er zijn zogeheten server-side includes, en er zijn client-side includes.
Server-side includes worden door de webserver gelezen. De bezoeker van de pagina hoort er niets van te merken. Dergelijke includes worden bijvoorbeeld gebruikt om telkens dezelfde functies aan een e-commerce-pagina toe te voegen. Er wordt een html-tag voor gebruikt:
<!-- #include file="mijninclude" -->
Het bestand kan verschillende formaten hebben, afhankelijk van de bestandstypen dat door de webserver gelezen kan worden. Op een Microsoft Internet Information Server bijvoorbeeld, zullen includes voornamelijk het ASP-formaat hebben.
Het nadeel van server-side includes is, dat zij alleen door een webserver uitgevoerd kunnen worden. Als u de pagina van een lokale harde schijf zou oproepen, zou de include niet ingevoegd worden. Ook moet de provider zijn server zodanig hebben ingesteld dat u van server-side includes gebruik kunt maken. Op zo'n moment kunt u beter kiezen voor een client-side include.
Client-side includes worden door de browser (oftwel de client) omgezet en ingevoegd in de webpagina. Ze worden meestal opgebouwd in een scripttaal, liefst een die door zoveelmogelijk browsers ondersteund wordt. Als u een intranetsuite bouwt, kunt u zelf bepalen welke scripttaal gebruikt wordt. Voor het www raad ik het gebruik van ecmascript aan. Dit wordt door vele browsers ondersteund, hoewel Netscape en Microsoft het nodig vinden er zelf een draai aan te geven in de vorm van JavaScript en JScript.
Een voorbeeld van client-side includes vindt u in de Omega Junior Websuite. De indexbalken boven en rechts zijn door middel van includes ingevoegd. Als u de bron opvraagt van deze pagina, ziet u geen html-code om de indexen op te bouwen. Wel ziet u tweemaal een brokje scriptverwijzing. (Ik moet opmerken, dat deze pagina's op Tripod worden gehost. Tripod heeft de vervelende eigenschap alle pagina's te voorzien van een server-side include, waarin een hoop JavaScript staat, dat verantwoordelijk is voor het verschijnen van reclamevenstertjes. Die scripts van Tripod zorgen regelmatig voor conflicten met onze eigen scripts. We hebben nu een betaald abonnement: geen reclame, geen storende Tripod-scripts.).
Onderstaande scriptverwijzing is de include-code:
<script type="text/javascript" src="mijninclude.js"></script>
Deze scripttag conformeert aan de html4.0 standaard van het world wide web standaardenconsortium. U begrijpt dat de src-eigenschap van de scripttag aangeeft welk bestand gelezen moet worden. De inhoud van dat bestand wordt gelezen en in de webpagina ingevoegd. Het pad naar de include wordt op dezelfde wijze opgebouwd als elke andere url, bijvoorbeeld zoals de verwijzing in een ankertag (<a href="pad" title="omschrijving">).
Hoe ziet nu de inhoud in zo'n include eruit? Voor het grootste deel is dat afhankelijk van het resultaat dat u wilt bereiken. Als u net als deze websuite artikelindexen wilt opnemen, zult u html op moeten nemen. Hier een simpel voorbeeld:
document.writeln("<h1>Hallo, wereld!</h1>");
U herkent in dit ene regeltje maar liefst drie talen. In het centrum staat gewone taal, de boodschap die overgebracht moet worden: "Hallo, wereld!" Daaromheen staat html-code, die aan de boodschap een stukje opmaak toekennen: <h1> en </h1>. Als derde taal treft u javascript aan: de functie die gegevens naar een document schrijft: document.writeln(). Achter de opdracht staat een puntkomma. Deze vertelt aan de javascript-motor dat de regel is afgelopen, en dat er aan de uitvoering van een volgende regel kan worden begonnen.
In de opdracht document.write() verwijst het woord "document" naar het object waarin geschreven gaat worden. Dit is meestal een webpagina. Op deze manier komt het in te voegen bestand precies op die plaats terecht, waar de include-code staat. Zo kun je includes opnemen in elk segment van een webpagina: de head, de body of ergens in een tabelcel.
Codeer ze!
Hoensbroek, 05/03/2002