Prototype JS

... sau cum sa-ti faci un "mic" motor de cautare.

Se iau niste scripturi js, se foloseste AJAX, se adauga o forma cu 2 labeluri si un buton si gata pagina.

Dar totusi, daca vrem sa scriem si mai putin cod pentru asta?
Tot cautand pe gugal despre AJAX, am gasit un framework JS foarte util. Are functii pentru stringuri si variabile si clase pentru cereri AJAX.
Vreti sa aflati mai multe?
M-am gandit ca e mai bun un articol pe site-ul nostru, decat putine explicatii aici.

Enjoy!

P.S. Din motive de timp, articolul o sa fie urcat pe site abia in seara asta (sorry).

Cum sa folosesti metoda http GET cu Ajax

Problema: Vrei ca in pagina ta HTML sa apara continut dintr-o alta pagina HTML aflata pe site-ul tau.

Aplicatie concreta: vizitatorul face o cautare in site-ul tau si tu afisezi in pagina de rezultate continutul dorit de el.

Rezolvare: un foarte mic script Javascript care foloseste Ajax.

Citeste intregul articol ca sa afli cum se face si sa testezi rezultatul.

Cum sa-ti faci harta ta cu Google Maps

Pentru oricine care isi mediatizeaza afacerea pe internet, este vital sa dea indicii cum poate fi gasit. Un magazin de orice fel, pentru a fi frecventat de clienti, trebuie sa ofere posibilitatea de a fi localizata usor si rapid si.

Un webmaster istet va include pe pagina de contact, nu doar si un numar de telefon, cat si o harta cu locatia firmei. Noi va vom invata cum sa faceti chiar voi asta, cu Google Maps API.

Vizitati-ne, si va vom arata cum :)

Speram ca v-a placut, si va asteptam comentariile.

Problema! Idei, solutii, careva?

Ieri seara, in decurs de 30 min(intre doua cautari consecutive), site-ul nostru a cazut de pe locul 10 la cautarea dupa stringul "interfete web" ... undeva pe nicaieri( azi am cautat mai adanc si suntem undeva de pe la 130 si mai departe).

Aveti idee de ce s-a intamplat asta?
Solutii?


P.S. Nu ma intereseaza asa mult ca a cazut la cautare, cat "fenomenul" in sine. Si as vrea sa stiu de ce.

Interfete web colaborative... sau cum intregul e mai mult decat suma partilor

Uitandu-ma cu mirare peste umarul unei prietene care se plimba pe net, am gasit un fel de Google Earth, dar care nu mai era doar o harta.

Prietena se uita la:



www.wikimapia.org

Aici nu doar vezi orice loc din lume, ci si numele lui...

Vroiai sa stii ce era in cladirea de langa casa pe langa care treci zilnic? Esti curios sa stii ce se gaseste intr-un parc, sa cunosti ce e in aproape fiecare casa ce-o intalnesti cand te plimbi pe bulevardul X?

Te invitam sa citesti articolul integral pe site-ul nostru.

Ce va fi?

In curand va aparea pe site un articol despre flex si legatura cu interfetele web.
Si cum a trecut aproape o luna de cand proiectul a capatat forma, o sa facem publice informatiile de pe google analytics de pana acum.

O sa vorbim un pic si de tema a doua la iom, si o sa venim cu o propunere de proiect (sa nu mai fie chinuiti si copiii de anul viitor cu tema asta :P).

Daca v-am starnit cat de cat curiozitatea, va asteptam pe site-ul nostru.

Sinziana

P.S. Asteptam idei. Ce v-ar interesa sa mai aflati?

Cat valoreaza site-ul tau?

Avem site... si nu-l vindem ieftin. Dar ne mandrim ca l-am crescut, si ca deja, in nici 30 de zile de existenta, a ajuns sa valoreze, zic unii, $5000. Veti intreba, cine? Uitati aici:

My Site is worth
$5,060

How much is
your site worth?

Din cate zic ei, avem 270 de linkuri care trimit catre noi, iar linkul vostru pe pagina noastra v-ar costa 5$/luna.

Iata aici rezultatele analizei de la dnScoop.com:





Vreti sa stiti si voi cat valoreaza site-ul vostru? Incercati aici:

www.dnScoop.com

Sau pentru o lista mai larga de site-uri ce realizeaza astfel de evaluari de website-uri, cititi un post foarte interesant aici:

BlogsThatFollow - How much is your site worth?

Ce puteti gasi pe site-ul nostru

... gratis (ca tot suntem o firma de IT).

1. Link-uri pe alese - o suita de resurse utile in dezvoltarea interfetelor web, programe, tool-uri de validare, si multe alte lucruri http://interfete-web-online.com/linkuri.html

2. Articole - In cadrul sectiunii articole veti gasi informatii detaliate despre diferite tehnologii folosite in designul interfetelor web si despre modul optim de intrebuintare al acestora http://interfete-web-online.com/articole/articole.html

3. Teme ... da, teme la IOM - numai bune de invatat din ele. Nu sustinem copierea, insa sustinem o buna documentare, si implementarea unor exemple minime ajuta la asta http://interfete-web-online.com/surse_gratuite.html

4. Blog-ul echipei - adica aceasta :). daca vreti sa aflati parerile membrilor echipei, ultimele stiri sau ce s-a mai intamplat nou pe site(http://interfete-web-online.com), atunci ati nimerit unde trebuie.

P.S. Cat de curand o sa apara si tema mea pe acolo. Colegii mei le-au pus deja.

Flickr API

... și de ce mi-a plăcut sa fac un crawler.


Cum spuneam câteva posturi mai jos, yahoo pune la dispozitia dezvoltatorilor API-uri pentru site-urile sale.
Tot cautând pentru tema, am avut de ales intre doua care mi-au plăcut: del.icio.us si flickr. L-am ales pe al doilea, ca e mai complex și avea funcții care ma ajutau direct în cerința temei: http://www.flickr.com/services/api/.

Ce mi-a plăcut e ca mai pentru toate serviciile oferite, găsești doua tipuri de metode: una pentru userul autentificat, și una pentru vizitatori. De exemplu, pentru a afla lista de contacte a unui user, avem flickr.contacts.getList (e necesara logarea) și flickr.contacts.getPublicList ( e necesara doar o cheie de autentificare). Evident, exista o privare de informații aici, in xml-ul rezultat de la prima având mai multe date disponibile despre lista de contacte a utilizatorului (prieteni, contacte sau familie - doar atât permite flickr). Evident, la a doua rezultatul este un XML mai simplu, doar cu numele și adresa contactului, și ... câteva câmpuri auxiliare, care nu precizează însa relația cu userul de la care se pornește.

Ce nu mi-a plăcut? Ca nu ofera servicii directe pentru tot ce as fi vrut eu (sa-mi ia de exemplu comentariile fotografiilor unui user). Trebuie autentificare - flickr.activity.userPhotos.

Ma plâng acum de ceva ce acum câteva săptămâni mi se părea a fi normal. Securitatea are și ea un preț. Problema e ca cei de la yahoo nu securizează ceea ce trebuie.

Pana una alta, daca vreti sa faceti tema repede, va sfatuiesc sa alegeti flickr sau del.icio.us API, combinat cu python.

Raspund aici unui comment de la alt post: ca sa fac scrisul mai lat, trebuie sa schimb layout-ul. Ori blogger ofera layouturi de bloguri personale. Nu am timp deocamdata sa pun un altul (done by me).

Let's talk about semantic web

API de la Yahoo

Cautand pentru tema de la IOM, am aflat ca Yahoo pune la dispozitie niste api-uri "ca lumea": http://developer.yahoo.com/
Asta e si cu doua taisuri ;). Citisem intr-un blog al unuia de la Yahoo ca lumea nu prea e de acord ... pana la urma, de exemplu, daca au un api mai "social", cum ar fi cel pentru 360, toate informatiile userilor ar fi disponibile. Inca sunt discutii pe tema asta la ei acolo.

Pana una alta, mie mi s-a parut interesant api-ul de la flickr si del.icio.us.

A, si pentru fanii de hi5, si ei au asa ceva ... dar nu m-am interesat cat e de bun.

Vindem teme? De "interfete web"

... adică NU. Vindem cunoștințe. Si le vindem ... gratuit.
De fapt, nu chiar gratuit. Noi va arătăm, și voi petreceți un pic de timp pe site-ul nostru. Cam asta e prețul.

Cam în asta consta proiectul nostru de interfețe-web. Sa încercam sa vindem, sa ne facem reclama, sa ne facem cunoscuți și sa aparem în "history"-ul google.

Btw, ceva super legat de interfețe-web. Am observat ca google ofera pe blogger.com suport pentru corectarea greșelilor(pe mine ma ajuta foarte mult asta la diacritice). Partea buna e ca dicționarul e dinamic, adică eu ca user pot adăuga noi reguli. Partea proasta ca e pot adăugă lucruri proaste. Si asta nu știu dacă are efect doar asupra dicționarului meu, sau e peste tot. Partea și mai proasta e ca nu recunoaște diacriticele majuscule.
Si ce nu îmi place e ca se aseamănă cu dicționarul ala super vechi de corectare de la MS Word. La el ma=ma, chiar dacă de fapt e "mă". Deci e doar un fel de lexer.

Nah, cam atât.

Tehnologia XPath

XPath 1.0 vs XPath 2.0

XPath este un limbaj folosit pentru interogarea fisierelor XML, sau, mai corect spus, XPath 1.0 este asa. Varianta 2.0 este mult mai complexa, si poate lucra pe mult mai multe tipuri de date. O definitie mai buna pentru 2.0 ar fi: un limbaj pentru procesarea secventelor, care ofera si un suport pentru interogarea fisierelor XML.

(expression language for processing sequences).

XPath 2.0 a aparut din combinarea XSLT 2.0 si XQuery 1.0.

De ce a fost nevoie de un upgrade?

- era nevoie de mai multe functii pentru a se usura anumite task-uri

- se dorea compatibilitatea cu XML Schema

- era nevoie de performante mai ridicate

Astfel, XPath 2.0 este un supraset al XPath 1.0, dar un subset al XQuery.

Ce aduce nou?

• Mai multe tipuri de date care pot fi procesate: pe langa multimi de noduri, string-uri, valori booleene si numere, au fost introduse tipuri ca date calendaristice (year, month etc), URI-uri, tipuri derivate, precum si conversii intre ele. Bineinteles, odata cu ele, au fost introduse functii, constructori si operatori asociati.

De exemplu, in versiunea 1.0 aveam tipurile:

String, boolean, number, nodeset

iar in 2.0:

· toate tipurile (simple si complexe) din W3C XML Schema

· tipuri derivate din XML Schema

· valori atomice

• Avem in continuare diferite tipuri de noduri organizate intr-o structura de arbore:

- elemente

- atribute

- noduri document (un element nou introdus – pana acum era cel radacina)

- avem tipuri de date specifice XML Schema pentru aceste noduri

De asemenea, testarea nodurilor se face dupa felul sau numele lor, precum si dupa tipul lor.

• Expresiile XPath intorc intotdeauna secvente, si s-au definit o serie de reguli legate de acestea:

R1. Totul este o secventa.

Chiar daca, aparent, expresiile intorc un nod, sau un string, ele de fapt intorc o secventa care contine un nod, respectiv un string.

R2. Nu existe secvente imbricate.

De exemplu, expresiile (2, 4, (1,2,3), 6) si (2, 4, 1, 2, 3, 6) se evalueaza la aceeasi secventa. (virgula este un operator de concatenare a secventelor)

R3. Secventele sunt ordonate (conteaza ordinea elementelor secventei)

In XPath 1.0 aveam notiunea de “multime de noduri”. Aici, aceasta notiune devine “secventa de elemente” (“sequence of items”). Secventele, spre deosebire de multimi, pot contine duplicate si sunt ordonate (sunt un fel de multiset-uri).

• In XPath 2.0 se pot aplica operatori asupra secventelor.

Exemple:

     for $x in /order/item return $x/price * $x/quantity

     (10, 1 to 3)   se evalueaza la (10, 1, 2, 3)

     1 to count($alta_secventa)

     reverse(5 to 10)

• In versiunea 2.0 exista cuantificatori – some , every

        some $x in /students/student/name satisfies $x = "Fred"

(every)

In XPath 1.0, daca scriam /students/student/name = “Fred”, se returna “true”

Daca exista cel putin un student cu numele Fred. Cuantificatorii din versiunea 2.0 rafineaza expresia.

• Exista expresii conditionale (if)

if (test-expression)

    then expression 

    else expression

• Mai multe noduri pot fi testate in acelasi timp

//persoana/student/text() | //persoana/profesor/text() din versiunea 1.0 devine:

//persoana( student | profesor)/text()

• Sunt introduse mult mai multe functii: http://www.w3.org/TR/xpath-functions

Un tool free pentru testarea expresiilor XPath 2.0 poate fi gasit la http://saxon.sourceforge.net/

De asemenea, informatii despre operatori, functii etc:

http://www.w3.org/TR/2001/WD-xquery-operators-20011220/

Bibliografie:

http://www.xml.com/pub/a/2002/03/20/xpath2.html

http://www.mulberrytech.com/papers/XPath-2-0-User-Grp-HTML/contents.html

Google dupa "Interfete Web"

Nu sunt de acord cu stringul de cautare.
(Vorbind cu cineva care se pricepe la astea) am ajuns la concluzia ca este un string comun.
Sunt curioasa, ce rezultat dadea google pentru "interfete web", inainte ca toti sa ne facem site-uri si blog-uri unde sa tag-uim sintagma asta.
Eu am cautat abia acum doua zile si surpriza: din alea primele 10 pozitii, 8 nu aveau nicio legatura cu proiectul nostru. Acum sunt curioasa cum o sa se puncteze pe baza asta.

Am aflat ca in cazuri din astea, cautarea se face practic dupa stringul dupa care vrem scris invers:
"interfete web" -> "etefretni bew" sau "bew etefretni"
Asa s-ar fi asigurat o competitie "eleganta" numai intre participanti. Ei, bine, probabil ca site-urile ar fi avut niste denumiri foarte ciudate :) ... la fel si articolele noastre, cand vroiam sa spunem de "interfete web".

Gata ?

Trebuie sa anuntam si oficial ...

Alex, Maria, Ruxi si Sinziana au (cel putin) un site, in care vor incerca sa va explice, asa cum stiu ei mai bine, ce inteleg prin "interfete web" ( acum e doar un string de cautare ).

Asta e: http://interfete-web-online.com

Enjoy

[Interfete-web] Avem echipa ...

... si o sa avem si site, cat de curand.
Asa ca URL-ul acestui blog va fi schimbat.

Go, go, go Gadget! [un inspector pe care il vom face sa aiba si css-uri la discretie].

P.S. In curand o sa apara si temele la IOM.

XML?

A fost odata ...

"XML – (eXtensible Markup Language) este un limbaj de adnotare/structurare a datelor. Istoria aparitiei sale porneste de la SGML (Standard Generalized Markup Language) aparut in anii 80. Acest limbaj isi propunea la aparitie sa creeze documente ce pot fi analizate de catre masini prin introducerea de marcaje (sau taguri). SGML nu a fost un succes deoarece era foarte complex si astfel crearea de programe care sa-l analizeze.
In anii 90 la CERN a aparut HTML-ul (HyperText Markup Language). La baza acestui limbaj a fost SGML-ul si scopul sau a fost marcarea documentelor astfel incat sa poata fi transmise prin retea. Unul din primele documente care au stat la baza WWW-ului si respectiv HTML-ului le puteti gasi la [1]. Una din ideile acestui document este ca browserele trebuie sa ignore marcajele si atributele pe care nu le inteleg. Aceasta idee a avut ca efect din cate cred eu aparitia unui limbaj mai simplu care sa poata fi parsat rapid de catre browsere. Si astfel s-a dezvoltat HTML-ul.

XML-ul este un limbaj cu o sintaxa simpla si care permite doar structurarea datelor intr-o maniera proprie prin definirea propriilor taguri. Aceasta facilitate de structurare a datelor a permis folosirea sa pentru a dezvolta limbaje noi precum si pentru a fi folosit in noi standarde de stocare a datelor. Nu in ultimul rand XML-ul poate fi folosit pentru a schimba date intre aplicatiile care au nevoie de a comunica intr-un limbaj comun.
Chiar si in ciuda dezavantajelor pe care le are (overhead) calitatile XML mai sus mentionate ii permit sa fie folosit cu succes in multe domenii si sa fie piatra de temelie pentru si mai multe domenii.

P.S. Probabil o sa fie singurul post clasic. Dupa, cred ca aplicam altceva. :)

Helllo world!

Un "Hello world!" nu printat la consola, ci editat cu HTML.

Enjoy our posts!