Site-ul este pe pagina 3

Pentru ca inca am ramas cu reflexul de a cauta site-ul dupa interfete web pe Google am facut si astazi o cautare. Am fost placut surprinsa ca dupa 1 saptamana de la terminarea proiectului site-ul nostru a avansat de pe pagina 5 pe pagina 3 (chiar a 3a intrare).

Eu imi propun sa contribui in continuare la continutul de pe site asa ca va invit sa reveniti din cand in cand sa vedeti ce mai e nou

Interfete Web pentru site-uri de bijuterii

O alta pasiune a mea sunt pietrele pretioase, precum si formele pe care acestea le iau in bijuterii.
Voi analiza mai jos cateva interfete web de site-uri dedicate bijuteriilor.

1. Site-ul acesta este creat in mod evident de un pasionat de pietre pretioase, fara intentia de a vinde acele pietre prezentate. Este o pagina plina de informatii interesante atat despre pietrele pretioase celebre, cat si despre metalele din care se confectioneaza in general bijuteriile. Este cred cea mai usor de parcurs pagina pe care o cunosc, si frumusetea sta in faptul ca este scrisa in cel mai pur cod html in spate, fara folosirea de editoare "super-specializate" si "moderne". Este de asemenea o lectura deosebit de placuta, cred ca asa ar trebui sa arate orice pagina de informatii pe o anumita tema.
2. Unul din site-urile de bijuterii romanesti arata de asemenea impecabil. Este un site organizat frumos, cu meniu pe lateral. Textul nu e prea lat (e usor si rapid de citit din acest motiv) si furnizeaza multe informatii utile. Este afisat si pretul la bijuterii, iar cumpararea se face la magazinul fizic (e si nerecomandat de altfel sa se cumpere bijuterii de pe internet).
3. Tiffany este probabil cel mai cunoscut magazin de bijuterii american. Site-ul se ridica la nivelul asteptat, are meniu orizontal, si este in principal orientat pe furnizarea exact a detaliilor necesare cumpararii unei bijuterii. Nu se gasesc prea multe informatii pe langa, daca esti interesat sa stii detalii despre pietre mai mult decat doar numele lor, este bine sa apelezi la cele 2 site-uri de mai sus.

Cam atat despre bijuterii, recomand admirarea bijuteriilor de peste 500000$ de pe Tiffany's precum si a diamantelor celebre din primul site.

Interfete web pentru shopping

Acum cateva zile lira sterlina a ajuns sub euro (acum e 4,1) si m-am gandit ca acum ar fi un moment bun de shopping online in lire. Cum haine e mai complicat sa cumperi de pe net :P macar electronice, jocuri sau carti care nu se gasesc pe la noi tot se pot cumpara. Pentru inceput cine a luat salariul poate intra pe aceste interfete web de shopping:

www.amazon.co.uk
www.thehut.com

Javascript - tabIndex pentru butoane

Download exemplu

Miercuri la laborator s-a vorbit putin despre ultima tema la IE. Studentii vor avea de facut interfete web care sa indeplineasca anumit cerinte. Printre cerinte se numara si problema navigarii cu ajutorul tastei tab. De multe ori se intampla ca ordinea de navigare prin tab-uri sa nu corespunda cu ordinea logica in care au fost puse butoanele / campurile in pagina. De aceea ar trebui sa setam proprietatea de tabIndex pentru fiecare buton.

Mai jos am creat un mic exemplu in care m-am jucat cu ordinea de navigare:

Box 1: Box 2: Box 3:

Declararea unui buton cu proprietatea de tabIndex setata ar arata cam asa:

< button id="b1" tabIndex="1"> Button 1</button>

Pentru a obtine valoarea tabIndex putem scrie:

var b1=document.getElementById('b1').tabIndex;
document.write("Tab index of Button 1: " + b1);

In cazul in care vrem sa navigam intre campurile unei forme vom seta tot proprietatea tabIndex:

< form name=yourform>
Box 1:
< input type=text name=box1 tabIndex="5" onFocus="nextfield ='box3';">
</form>

Un exemplu complet puteti vedea aici iar codul poate fi descrcat din sectiunea download al site-ului nostru

Cum sa folosesti facilitatile beta ale Blogger.com

Intre toate platformele de blogging, blogger ofera cea mai limitata dintre interfetele web. De aceea, accesul la facilitatile beta (sau "draft" cum le spun cei de la Blogger) este esential pentru a aduce cat mai multi vizitatori pe blogul tau.

Pentru a activa facilitatile beta, vizitam siteul draft.blogger.com unde intalnim panoul de control alternativ al blogger beta. Va trebui sa faceti toate activitatile dina cest panou de control de acum ininte , si nu din cel standard. O prima schimbare de remarcat este nou editor pentru posturi care ofera o flexibilitate mai mare si facilitati noi.

La noi pe blog am folosit ratingurile cu stelute oferite ina ceasta versiune a blogger. Optiunea se gaseste dand clikc pe panoul "Aspect" , apoi alegand "Editati" pentru widgetul "Postari de blog". Bifati optiunea "Afisati evaluarile" si gata, stelutele ar trebui sa apara pe blog. Daca acest lucru nu se intampla , selectati "Editati HTML" si dati click pe "Întoarce şabloanele componentelor grafice la forma prestabilită".

Majoritatea acestor facilitati functioneaza perfect, dar, nefiind testate cum se cuvine, e posibil sa fie si momente de nefunctionare sau sa aiba o instalare mai grea. Noi pana acum suntem multumiti de aceste noi facilitati. Ratingurile cel putin sunt alternativa cea mai rapida dintre cele existente acum pentru blogger(asa cum va spuneam la postul despre optimizarea interfetei blogului nostru).

Daca aveti un blog colectiv (posteaza mai multi bloggeri) este dificil sa obligati fiecare blogger sa intre la noual panou de control in loc de cel vechi, de aceea este bine sa bifati casuta "Doresc ca Blogger în schiţă să fie tabloul meu de bord prestabilit." de pe prima pagina a noului vostru tablou de bord .

Mult succes!

Gadget-uri pentru interfete web

Intr-un articol anterior vorbeam despre cat de usor se poate face o pagina web cu ajutorul CMS. Exista de asemena si template-uri de pagini web care pot fi descarcate gratuit si adaptate pentru a obtine rapid un site care arata bine.

Dar cum putem face un site/blog sa fie mai cool fara sa pierdem prea mult timp?
Foarte simplu...adaugam niste gadeget-uri, adica dam copy/paste la bucati de cod deja scrise pe care le includem in paginile noastre. Ca sa fiu mai explicita voi da cateva exemple de gadget-uri foarte utilizate si o sa povestesc pe scurt si cum facem rost de ele:

1. Pe Google Gadgets gasiti tot felul de gadget-uri: ceasuri, mp3playere, calendare, tool-uri financiare, harti, countere etc. Mie mi-a placut un paianjen care se plimba asa ca am selectat gadget-ul am dat click pe Get the Code si apoi am dat copy/paste in articol.



Si acum avem si un mic pet al blog-ului nostru care urmareste mouse-ul:)


2. Pentru a avea o pagina web foarte animata putem adauga si animatii in flash. Se descarca un fisier swf si se scrie in sursa paginii web ceva de genu: "<"embed width="" height="" src="numefisier.swf"> "<"/embed>. Cele mai des utilizate sunt bannerele si paginile de start animate in flash. Eu am adaugat un joculet recomandat de frate-miu...Atentie e violent deci nerecomandat copiilor:)



3. Alt gadget foarte popular este mini-playerul youtube. Foarte multa lume vrea sa-si puna pe blog o melodie, un filmulet funny sau o secventa din emisiunea lui mircea badea. Cel mai simplu e sa intri pe youtube, sa cauti filmuletul si sa dai copy/paste la codul scris in casuta "Embed". Eu am gasit o melodie foarte draguta tot pe un blog in timp ce imi faceam prima tema la IE:)



4. In general pentru a face o pagina mai dinamica si mai interactiva se utilizeaza javascript si ajax. Cel mai funny exemplu de cat de departe se poate merge cu javascript este DHTML lemmings

e107: simplu si rapid

Pentru a putea vorbi de SEO, Google Page Rank, directoare etc. trebuie mai intai sa avem pe ce sa le aplicam.

Cel mai simplu si mai rapid mod de a obtine interfete web pentru siteului vostru este sa utilizati un sitem de management al continutului (CMS) free pe care il puteti descarca de pe internet. Un CMS este o aplicatie web care faciliteaza crearea, editarea si managementul continutului unui site de catre utilizatori care nu au neaparat cunostiinte de programare, scripting sau limbaje de markup. Ceea ce diferentiaza intre ele siteurile realizate cu e107 sunt temele (care pot fi descarcate gratuit de pe net), meniurile si pluginurile.

Noi am utilizat e107 pentru a realiza un site profesionist si usor de navigat. Alt site foarte reusit este acesta interfete-web-club

Pentru inceput trebuie instalat e107. Mai multe detalii aici. Pe scurt: aveti nevoie de un server web cu PHP si MySql, trebuie facut upload la fisierele e107 pe server si setate permisiuni pentru anumite fisiere, apoi se ruleaza scriptul de instalare. Administrarea continutului siteului se face din zona Admin. Categoriile de optiuni sunt: Settings, Users, Content, Tools, Plugins. Dintre cele mai importante optinuni de adiminstrare amintesc: Administrators/Admin password, Users, File Manager, Site Links, Menus, Front Page, Theme Manager, Custom Pages/Menus

Dupa ce setati administratorul si userii initiali puteti seta una din temele deja existente sau sa incarcati una noua cu ajutourl Theme Manager. Tema va da aspectul si functionalitatile initiale ale siteului. Din Front Page puteti seta pagina ce va aparea la incarcarea siteului (puteti alege din paginile create implicit si din cele create de administrator din Custom Pages).

In Custom Pages puteti crea noi pagini de navigare. Editorul permite adaugare de text (inclusiv scripturi), imagini, linkuri, liste etc. Numele paginilor create pot fi folosite in cadrul linkurilor: [link=page.php?3]. Site Links va perimite sa adaugati tab-urile principale de navigare pe site cum ar fi Home, News, Download, Members asociate cu paginile siteului (Custom Pages) sau cu pagini externe (se specifica URL-ul).

Optiunea Menu permite adaugarea meniurilor in anumite zone ale siteului (se pot alege menuri deja existene sau menuri create din Custom Menus)
In File Manager -> Files Directory puteti vizualiza toate fisierele utilizate.

In Meta Tags specificati tag-urile dupa care va fi gasit siteul la o cautare pe un motor de cautare si descrierea asociata siteului. De exemplu pentru siteul nostru interfete 4 web se afiseaza o scurta descriere.

Ce sunt Interfetele Web de fapt?

Noi tot vorbim aici despre interfete web. S-ar putea totusi ca subiecte cum este de ce nu e Mircea Badea programator sa atraga un interes mai mare din partea persoanelor care navigheaza in mod uzual pe internet. Astfel, la aproape 2 saptamani de la crearea acestui blog, m-am gandit sa dau o definitie a acestor interfete web pe care sa o inteleaga si orice persoana fara studii de specialitate in IT. O sa explic in ce fel acestea sunt responsabile de atragerea si pastrarea utilizatorilor unui site.
O interfata web inseamna aspectul unui site, functionalitatea acelui site si modul cum aceste 2 caracteristici interactioneaza intre ele.
Cu alte cuvinte, atunci cand intri pe un site web, in principal stii cu ce se ocupa acel site si cam ce ai vrea sa gasesti in el. Tot ceea ce vrei acum este sa gasesti cat mai repede lucrul pe care il cauti. Totodata, ai vrea sa nu iti oboseasca ochii cat timp stai pe site-ul respectiv.
Probabil ca cele mai vizitate site-uri web, dat fiind faptul ca ele sunt setate implicit ca pagini "Home" de browserele web, sunt Yahoo, MSN si Google .
Se pot lesne observa culorile predominante in aceste site-uri: albastru si alb. Este un lucru stiut ca aceste 2 culori sunt cele mai relaxante pentru ochiul uman. Astfel, nu obosesti daca petreci mai mult timp pe oricare din aceste site-uri. Functionalitatea acestor site-uri este insa diferita.

• Google isi atinge cel mai bine scopul propus, anume acela de motor exclusiv de cautare. Intri pe site, vezi un unic loc unde poti scrie cuvinte, propozitii si dupa ce dai Enter iti apar rezultatele cautarii tale - 10 pe pagina, ca sa nu te plictisesti de cautat si in principal cam gasesti ce te intereseaza in primele 10.
• Yahoo iar se achita de angajamente suficient de bine. Fiind numele cel mai legat de casute de email, pe prima pagina vezi rapid un buton pe care scrie mare Mail si care te duce in pagina de logare la contul tau. Un alt serviciu des folosit de cei care stau pe Yahoo este Weather (Vremea), cu un buton din nou foarte vizibil in dreapta si nu foarte sus. Functionalitatea de motor de cautare nu prea mai e folosita deloc, dar e vizibila nu prea sus si in centru - usor de gasit.
• MSN insa nu prea se achita de sarcini. Unii oameni au emailul pe Hotmail (emailul Microsoft), insa link-ul catre acesta e pozitionat super prost, in stanga sus. Vremea are insa un acces mult mai facil, se vede un soare frumos (sau nor, dupa caz) in dreapta sus, si la click de mouse te duce in pagina unde poti afla detaliile vremii din orasul tau. Se stie ca si Microsoft a dus o munca asidua pentru a deveni un motor bun de cautare, se vede bara de Search pe pagina MSN, dar cu toate acestea lumea s-a cam obisnuit cu google, care da de fapt si rezultate mai relevante la cautari.
  

In ceea ce ma priveste, prima data ma uit dupa link-uri catre weather/mail cand intru pe Yahoo/MSN, de asta le-am si descris. Altfel, au mereu pe prima pagina "articole de actualitate" care nu ma atrag deloc si o gramada de linkuri care pot cauza dureri de ochi numai daca stai sa vezi unde duce fiecare.
O sa mai continui discutia relativ la usurinta in utilizare a site-urilor in post-urile mele viitoare, dar acum e momentul sa ma opresc, fiindca o caracteristica a post-urilor de pe blog-uri este ca ele trebuie sa fie scurte si la obiect.