Virtual Reality Modeling Language (VRML)

VRML (Virtual Reality Modeling Language) - în limba română, Limbaj de modelare a realității virtuale - este un format standard de fișier pentru reprezentarea graficelor vectoriale interactive tridimensionale, proiectate în mod particular cu gândul la World Wide Web. Ca și limbaj a fost înlocuit de X3D.

Lume virtuală creată în VRML

Format

VRML este un format de fișier text în care sunt specificate vârfuri și muchii pentru un poligon 3D alături de culoarea de suprafață, texturi, strălucire, transparență și alte proprietăți ale obiectului. Adrese URL pot fi asociate componentelor grafice astfel încât browser-ul să fie capabil să preia conținutul unei alte pagini web sau al unui alt fișier VRML atunci când utilizatorul dă click pe o componentă. Animații, sunete, lumini și alte aspecte ale lumii virtuale pot interacționa cu utilizatorul sau pot fi acționate de evenimente externe cum ar fi cronometrele (timers). Un nod special de script (Script Node) permite adăugarea de cod program (scris în Java sau JavaScript) în fișierul VRML.

Fișierele VRML sunt deseori numite "worlds" (lumi) și au extensia *.wrl. Aceste lumi VRML folosesc un format text și pot fi astfel compresate folosind gzip, permițând transmiterea rapidă a lor prin intermediul Internet-ului.

Fişier VRML

Standardizare

Acest tip de fișier a fost definit de către Web3D Consortium și la fel ca și succesorul său, X3D, a fost acceptat de ISO (International Organization for Standardization) ca și standard internațional.

Prima versiune de VRML a fost specificată în Noiembrie 1994. Această versiune a fost specificată din formatul de fișier și API-ul componentei software Open Inventor, dezvoltată inițial de către SGI. Versiunea completă și funcțională este VRML97 (ISO/IEC 14772-1:1997), dar a fost înlocuită de X3D (ISO/IEC 19775-1).

Apariție. Popularitate. 

Termenul VRML a fost introdus de Dave Raggett într-un document propus la prima conferință World Wide Web din 1994 și a fost pentru prima dată discutat la WWW94 VRML BOF înființată de Tim Berners-Lee, unde Mark Pesce a prezentat un model de labirint, dezvoltat împreună cu Tony Parisi și Peter Kennard. În octombrie 1995, la Internet Worlds, TGS (Template Graphics Software) a dezvoltat un plug-in 3D/VRML pentru versiunea beta a browser-ului Netscape 2.0.

În 1997, o nouă versiune de format a fost finalizată și publicată sub numele de VRML97 (VRML 2.0) și a devenit standard ISO. VRML97 a fost folosit pe Internet pentru pagini personale și site-uri precum CyberTown, care oferea chat 3D folosind un software numit Blaxxun. Capacitățile VRML au rămas în mare la fel, în timp ce graficele 3D în timp real  s-au tot îmbunătățit. VRML Consortium și-a schimbat numele în Web3D Consortium și a început să lucreze la succesorul lui VRML : X3D.

♦ ♦ ♦

Yahoo! Axis - un nou browser

Cum cei de la Yahoo! nu se puteau lăsa mai prejos decât cei de la Google, şi-au propus să lanseze propriul browser web pe care l-au intitulat Axis.

Yahoo! Axis - Search Browser

În primă fază, Axis este disponibil pentru sistemele de operare iOS, şi anume pentru dispozitivele Desktop, IPad şi IPhone. Această decizie este destul de inspirată, deoarece singura concurenţă reală la acest nivel este navigatorul Safari. Pentru a nu fi penalizat la capitolul performanţă, Axis este bazat pe motorul Webkit.

În realitate el nu este un browser web în adevăratul sens al cuvântului, ci funcţia sa de bază este căutarea. Folosind motorul de căutare Yahoo! aplicaţia afişează rezultate şi previzualizări ale acestora pe măsură ce tastăm. Acest lucru se întâmplă şi în Google Chrome, interfaţa grafică fiind diferită.

Rămâne de văzut cât de mult se va impune Axis pe piaţa browser-elor web şi ce profit va aduce companiei Yahoo! Între timp vă invit să vedeţi un filmuleţ de prezentare al acestui browser:

Vizitaţi pagina oficială pentru mai multe detalii.

Microsoft Access în proiectarea bazelor de date

Microsoft Access reprezintă industria standard pentru proiectarea bazelor de date (database design). Este de fapt un instrument pentru baze de date portabile sau bazate pe arhitectura client-server. Utilizarea programului  Access necesită câteva cunoştințe de bază despre principiile de proiectare a bazelor de date, înainte de implementarea propriu zisă.
În cele ce urmează sunt prezentate câteva din aceste principii care sunt suportate și de Access:

Tabelele de date sunt fundamentale.

Creearea unei tabele în Design View

Un tabel într-o baza de date este asemănător cu o foaie de calcul (spreadsheet), cu linii (înregistrări / records) și coloane (câmpuri / fields). Proiectarea câmpurilor în Microsoft Access reprezintă cel mai important element în controlarea intrării, integrării, manipulării şi accesării datelor.

Vizualizarea datelor dintr-o tabelă

Formularele bazelor de date oferă acces uşor la resurse prin interfața prietenoasă.

Formularele din Microsoft Access preiau liniile (înregistrările) unei tabele și prezintă datele într-un singur ecran. Prezentarea poate avea diverse forme: afișarea unei singure înregistrări, afişarea tuturor înregistrărilor sau doar a câtorva.

Formular pentru tabela Clienti

Interogările câştigă comanda datelor.

Interogările (queries) în MS Access oferă ordine în datele tabelelor. Proiectarea interogărilor în mod vizualizare (query design) reprezintă o "maşinărie" care rulează baza de date şi afişează, calculează, sortează și manipulează datele. Interogările afişează înregistrări după anumite criterii definite de utilizator.

MS Access Query Builder

Sortare în ordine alfabetică a datelor din tabela Clienti după criteriul nume şi prenume, cu ajutorul unui Query

Rapoartele afişează înregistrările.

Rapoartele în Access reprezintă metoda cea mai practică de a utiliza o bază de date. Ele afişează datele prin formatare, grupare, efectuând calcule necesare şi prezentând informațiile într-o manieră uşor de înţeles pentru client.

Lista clienţilor afişată sub formă de raport

Modelul bazelor de date relaţionale.

Microsoft Access accelerează puterea proiectării unei baze de date prin utilizarea modelului relațional. O bază de date relațională permite utilizarea mai multor tabele, fiecare dintre acestea conectate între ele printr-un câmp comun. Această conectivitate împreună cu alte lucruri previn duplicarea datelor și fac înregistrările mai eficiente.

Totul într-un singur pachet.

Cheia proiectării bazelor de date în Microsoft Access este că o bază de date poate fi realizată uşor prin interfața cu utilizatorul, fără cunoştinţe suplimentare de programare. Orice utilizator, chiar şi începător, poate proiecta uşor şi rapid o bază de date cu acest instrument oferit de Microsoft.

Diferența dintre GIF și JPEG

.gif-urile și .jpeg-urile sunt legiune pe Internet. Sunt peste tot. Cu siguranță sunt pe toate paginile de Internet, chiar și pe post de logo; sunt reprezentările vizuale care fac un site atractiv.

Dar care este diferența între ele totuși? Majoritatea utilizatorilor de Internet vor fi incapabili să dea un răspuns corect. Care este diferența dintre ele și când trebuie folosite și în ce circumstanțe?

.gif-urile

Sunt fișiere grafice mici, de obicei mai mici decât jpeg-urile, care servesc ca și conduită pentru grafice simple online. Ele suportă doar 256 de culori și prin urmare ocupă mai puțin spaţiu decât jpeg. Se vor încărca mai rapid și sunt perfecte pentru titluri, bannere, logo-uri. O proprietate importantă a acestor fișiere este că suportă fundalul transparent (background transparency), util pentru suprapunerea peste alte elemente grafice. Fișierele gif pot conține de asemenea animații, simple sau complexe, care ocupă mai puțină memorie decât clasicul fișier Flash .swf. 

.jpeg-urile

Deoarece aceste fișiere suportă milioane de culori, ocupă mai mult decât formatul gif și sunt folosite pentru a menține condițiile foto-realistice ale imaginii. Formatul jpeg poate fi folosit pentru grafice dacă încercăm să păstrăm calitatea culorii și nu putem realiza acest lucru cu gif. O problemă a fişierelor JPEG se observă atunci când are loc compresia imaginii, şi anume, se pierd din informații. Elementele mici din poze pot dispărea definitiv după compresie sau pot deveni încețoșate.

Soluția?

Când folosim fiecare format în parte? Este simplu: utilizăm GIF când avem de a face cu grafice și JPEG când avem de a face cu fotografii. Ambele formate pot fi compresate și aduse la dimensiuni reduse, perfecte pentru utilizarea în mediul online.

Mesaj de notificare CSS3/JQuery

Pentru astazi mi-am propus sa folosim functionalitatea CSS3 si jQuery pentru a afisa un mesaj de notificare pe o pagina web.

Acesta este mesajul care se afiseaza, fara folosirea 
unor imagini suplimentare pentru background. Doar CSS3.

 

Mesajul dvs. a fost postat!

x

Nota! Dintr-un motiv necunoscut Blogger nu accepta toate instructiunile CSS3 si prin urmare mesajul nu este afisat corect. Dar exemplul arata mecanismul de functionare al mesajului de notificare.

Primul şi cel mai important lucru care trebuie să-l facem atunci când încercăm să afişăm un mesaj de notificare atractiv, este sa alegem culorile şi pictogramele.
Astfel avem:

Galben-verzui = Succes
Roşu deschis = Eroare
Galben pal = Alertă
Sky Blue = Altă informaţie

Pasul 1 : HTML
Să începem prin introducerea unui simplu cod HTML în pagină:

<pre>

<div class="green">Mesajul dvs. a fost postat!

<div class="cross">x</div>

</div>

</pre>

Aceasta este structura de bază a unui mesaj de notificare, fără CSS şi Javascript. În acest cod este utilizată clasa green, pentru a seta fundalul notificarii pe galben-verzui. Cealaltă clasă, cross, este folosită pentru a închide caseta de notificare.


Pasul 2 : CSS

.green{

background:#e8f1c4 url(images/success.png) no-repeat left center;

background:url(images/success.png) no-repeat left center, -moz-linear-gradient(top, #eff7dc 5%, #e4efb6 6%, #e8f1c4 21%, #eaf7ca 50%, #e8f1c4 93%, #d6e0b8 100%); /* FF3.6+ */

background:url(images/success.png) no-repeat left center, -webkit-gradient(linear, left top, left bottom, color-stop(5%,#eff7dc), color-stop(6%,#e4efb6), color-stop(21%,#e8f1c4), color-stop(50%,#eaf7ca), color-stop(93%,#e8f1c4), color-stop(100%,#d6e0b8)); /* Chrome,Safari4+ */

background:url(images/success.png) no-repeat left center, -webkit-linear-gradient(top, #eff7dc 5%,#e4efb6 6%,#e8f1c4 21%,#eaf7ca 50%,#e8f1c4 93%,#d6e0b8 100%); /* Chrome10+,Safari5.1+ */

background:url(images/success.png) no-repeat left center, -o-linear-gradient(top, #eff7dc 5%,#e4efb6 6%,#e8f1c4 21%,#eaf7ca 50%,#e8f1c4 93%,#d6e0b8 100%); /* Opera11.10+ */

background:url(images/success.png) no-repeat left center, -ms-linear-gradient(top, #eff7dc 5%,#e4efb6 6%,#e8f1c4 21%,#eaf7ca 50%,#e8f1c4 93%,#d6e0b8 100%); /* IE10+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eff7dc', endColorstr='#d6e0b8',GradientType=0 ); /* IE6-9 */

background:url(images/success.png) no-repeat left center, linear-gradient(top, #eff7dc 5%,#e4efb6 6%,#e8f1c4 21%,#eaf7ca 50%,#e8f1c4 93%,#d6e0b8 100%); /* W3C */

border:1px solid #cad883;

padding:10px 0px 10px 30px;

margin:10px 0;

color:#4e871c;

font-weight:700;

font-family:Verdana, Geneva, sans-serif;

font-size:11px;

width:400px;

-moz-border-radius:5px;

-webkit-border-radius:5px;

border-radius:5px;

}

.cross{

float:right;

margin:5px 5px 0 0;

font-size:12px;

line-height:10px;

font-variant:small-caps;

font-weight:bolder;

cursor:pointer;

}

.cross:hover{

color:#000;

}

Acesta este codul care creeaza întregul stil pentru caseta de notificare. CCS3 este destul de puternic pentru a creea fundaluri gradient, borduri cu colturi rotunjite, umbre. Acestea sunt principalele "ingrediente" pentru o caseta care sa atraga atentia.


Sa întelegem codul
Începem cu clasa green. Alaturi de o imagine am inclus un gradient în CSS3. Datorita functionalitatii CSS3, nu avem nevoie de o imagine pentru a creea un astfel de tip de fundal (ca în versiunile precedente). În acest mod, am redus utilizarea nefolositoare a marcatorilor (tag-urilor) img si div.
Un alt lucru important de remarcat este folosirea mai multor gradiente în loc de unul singur, cu doua culori.
Acum ca am stilizat containerul în care va sta mesajul nostru, trebuie sa oferim si un buton pentru a închide notificarea. În acest scop am folosit caracterul "x" (ASCII 088).

Atentie! În functie de imaginea folosita ca si pictograma de afisat, poate fi necesara ajustarea acesteia în caseta. Acest lucru se modifica pe liniile de tipul:
background:url(images/success.png) no-repeat left center

În loc de valoarea left si center atribuim o valoare numerica potrivita pâna obtinem rezultatul dorit.

Pasul 3 : JQuery
Pentru a ascunde mesajele de notificare vom folosi JQuery, desi acest efect poate fi obtinut si prin tranzitiile CSS3. În primul rând trebuie sa declaram biblioteca JQuery.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

Este foarte important sa specificam acest lucru, altfel functiile noastre nu vor merge.

$(document).ready(function(){

    $(".cross").click(function(){

    $(this).parent("div").fadeOut('slow');

    })

});

O funcţie simplă care este apelată când utilizatorul dă click pe elementul ce are clasa cross şi ascunde caseta de notificare.

În mod similar, prin CSS putem schimba culorile casetelor de notificare.