La început a fost cuvîntul. Apoi au venit imaginile senzitive, imaginile inserate aleator, instrumentele plutitoare pentru navigare si instructiunile pentru robotii Web.

Rezolvări si comentarii

Inserarea aleatorie a imaginilor

La început a fost cuvîntul. Apoi au venit imaginile inserate în text. Apoi acestea au devenit senzitive. Ultima modă este inserarea lor aleatorie în document fie din motive de atractivitate, deoarece schimbă aspectul documentului la fiecare nouă încărcare, fie din motive de economie a lărgimii de bandă, cînd nu doresti să arunci toate reclamele pe ecran în acelasi timp, fie dintr-o multime de alte motive.

Ideea de la care am pornit era inserarea aleatorie în pagina de primire a unui nou punct de start pentru explorarea Agorei. Implementarea s-a făcut cu server-side includes si un script Perl.

Server-side includes sînt directive speciale pe care le inserăm în sursa HTML si pe care serverul le interpretează. Rezultatul este includerea în pagina HTML afisată de navigator a rezultatului executiei, fără nici o cerere specială din partea clientului.

Am hotărît să inserăm aleatoriu în pagina de primire siglele revistelor editate de Computer Press Agora ca imagini active care fac legătura cu sectiunile respective din biblioteca virtuală a sitului.

Pentru aceasta, serverul trebuia să includă aleatoriu în pagina cerută de un client oarecare ceva de forma:

<A HREF="calea/spre/documentul.html"><IMG SRC="imaginea_unei_sigle.gif"></A>

Inserarea urma să se facă în urma includerii în sursă a unei comenzi de forma:

<!--#exec cmd="cgi-bin/rand.pl"-->

(Nu uitati să schimbati extensia documentului HTML în .SHTML si să aranjati cu administratorul să seteze ON optiunea server-side includes pe serverul WWW.)

rand.pl (uite că putem începe o propozitie cu literă mică!) este o mică secventă de program scrisă în Perl care generează codul HTML ce urmează să insereze aleatoriu imaginile alese.

Primele linii reprezintă partea de configurare în care se defineste numărul total de imagini aleatorii, se dă calea spre ele si textul alternativ ce va fi afisat de navigatoarele care lucrează în mod text.

Ce urmează este generarea unui număr aleatoriu si inserarea în document a liniilor de cod dorite în care numărul aleatoriu reprezintă una din cele trei imagini cu referinta hipertext asociată si textul alternativ corespunzător.

Asta-i tot.

Instrumente de navigare plutitoare

Al doilea lucru pe care am dorit să-l rezolvăm era legat de un sistem de navigare unic, pentru întregul sit. Ne-am imaginat o bara cu instrumente de navigare aflate într-o fereastră separată, care poate fi minimizată, redimensionată, folosită si pentru afisarea noutătilor.

Generarea în sine a ferestrei nu era o problemă iar corectitudinea legăturilor spre documente putea fi rezolvată prin referinte absolute. Problema care ne-a dat oarecare bătaie de cap a fost găsirea mecanismului de directarea a documentului apelat spre fereastra navigatorului si nu spre cea a instrumentelor de navigare.

Fereastra este definită cu cu următoarea secventă de cod inserată în pagina din care este apelată bara de instrumente:

<SCRIPT LANGUAGE="JavaScript">
var remote = null;
function openMenu() {
remote = window.open('menu.html', 'AGORA', 'width=100, height=450, resizable=1');
}
</SCRIPT>

Secventa defineste o variabilă remote pe care o initializează iar apoi defineste functia openMenu(). Functia deschide o fereastră cu numele Agora, al cărei continut este documentul menu.html. Restul atributelor (width=100, height=450, resizable=1) au semnificatia cunoscută din HTML.

Deschiderea ferestrei cu instrumente de navigare se poate face fie automat la (re)încărcarea paginii fie prin clic pe o legătură activă. Automatizarea se poate face de pildă inserînd un manipulator de evenimente ca atribut al tagului BODY. De pildă:

<BODY onLoad="openMenu()">

Legătura activă se poate genera de forma:

<A HREF="Javascript:openMenu()"> Textul activ </A>

Documentul menu.html încărcat de fereastra generată, si care document contine referintele absolute spre anumite sectiuni ale sitului este codat asemănător. În headerul documentului este definită functia openM () care atribuie documentului care a generat fereastra un anumit URL.

Restul este simplu; se apelează functia de cîte ori este nevoie si i se dă ca valoare URL-ul documentului dorit (vezi caseta).

Tagurile META

Ne-am obisnuit atît de mult cu automatizarea conversiei diverselor documente în HTML si cu editoarele grafice care permit finisarea documentului fără a scrie o linie de cod HTML încît nu prea mai dăm importantă tagurilor inserate automat în headerul documentului si deseori nici nu-l mai verificăm. Vine apoi o vreme cînd ne mirăm ca paginile noastre nu sînt indexate cum trebuie de robotii care cutreieră siturile si pagina unui absolvent al Universitătii Babes-Bolyai este vizitată de clientii unor situri ca babes.com (babes = tipe) sau Playboy.

O statistică estima numărul paginilor Web la aproximativ 50 de milioane. Nici cel mai înrăit navigator pe Web n-ar avea vreme să citească decît o fractiune din aceste pagini. Problema este, cum le găseste? Probabil că se conectează la un supercăutător (de pildă Altavista) si interoghează baza de date care indexează paginile Web după cuvintele cheie si după descriere. Pentru ca paginile Dvs să fie bine indexate, este important să verificati dacă headerele documentelor pe care le publicati sînt construite corect cu taguri META. Acestea îmbogătesc documentul cu informatii care nu sînt în mod normal afisate de navigatoare dar care sînt folosite pentru a controla felul în care documentele sînt indexate de căutători, pentru a furniza informatie robotilor Web sau altor programe. De pildă unele pot să descrie documentul (textul care apare alături de URL în documentul returnat de un căutător ca urmare a unei interogări), iar altele pot furniza cuvintele cheie folosite de căutător pentru indexare. În absenta acestora, unii căutători vă vor indexa paginile după toate cuvintele din text (mai putin comentariile) si vor utiliza primele cuvinte din text (aproximativ 250 de caractere) ca un scurt rezumat. Întîmplarea cu Babes nu mai miră atunci pe nimeni. Nu-i mai putin adevărat însă că unele servere indexează paginile după cuvintele din text în plus fată de cuvintele cheie. De pildă Infoseek. Dar chiar si acest caz, la o interogare va fi trimis textul inserat de Dvs cu META.

Puteti însă controla felul în care paginile Dvs sînt indexate cu ajutorul tagurilor META.

La modul minimal, headerele documentelor ar trebui să fie de forma:

<HEAD>
<TITLE>Titlul paginii<TITLE>
<META Name="description" Content="Continutul descrierii; text care apare alături de URL în documentul returnat de căutător">
<META Name="keywords" Content="Cuvinte, cheie, separate, de virgulă.">
<HEAD>

Headerul însă poate contine si alte informatii care, desi nu sînt afisate de navigator, pot fi folosite de servere si clienti. De pildă, pentru identificare se poate folosi un tag pentru autor,

<META NAME="Author" content=" Nume autor">

Tagurile META pot fi folosite si pentru a genera headere HTTPD speciale care sînt trimise de server si care pot activa anumite functiuni ale clientului. De pildă, atributul HTTP-EQUIV indică numele headerului iar CONTENT îi indică evident continutul. De pildă:

<META HTTP-EQUIV="Expires" CONTENT="15.10.1996">

va genera headerul:

Expires: 15.10.1996

Nu vă osteniti însă să modificati tagurile META generate de server (cum ar fi CONTENT-TYPE si DATE) deoarece majoritatea serverelor le ignoră oricum.

Formatarea corectă a documentelor vă va permite să implementati o bază de date interogabilă pentru căutări pe situl Dvs.

Dar despre asta, în numărul viitor.


(C) Copyright Computer Press Agora