Integracija web sajtova u Windows 7 taskbar
Jedna od novih funkcionalnosti koje donosi Internet Explorer 9 je mogućnost integracije web sajtova sa Windows 7 op. sistemom.
Jedna od novih funkcionalnosti koje donosi Internet Explorer 9 je mogućnost integracije web sajtova sa Windows 7 operativnim sistemom.
U suštini, ona omogućava programerima web sajtova da korisnicima omoguće dodavanje - pinovanje web sajtova u Windows 7 taskbar ili dodavanje sajtova u All Programs grupu menija Start.
Zašto pinovati web sajt?
Kada se Windows 7 pojavio na tržištu, omogućio je da aplikacije instalirane na klijentskom računaru imaju nove načine interakcije sa korisnikom, na primjer da korisnik zakači (engl. pin) aplikaciju na Windows Taskbar, te da aplikacije zakačene na Taskbar ili meni Start imaju tzv. jump liste sa najčešćim operacijama ili nedavno korištenim dokumentima.
Ove liste se aktiviraju desnim klikom na ikonicu zakačene aplikacije u taskbaru. Korisnici uglavnom na taskbar dodaju aplikacije koje najčešće koriste, a korištenjem takvih listi se interakcija korisnika sa aplikacijom još više ubrzava.
Prema statistikama, web browser je aplikacija koja se na računarima najviše koristi. Preko 50% vremena koje korisnici provedu za računarom, provedu upravo u web browseru. Sa druge strane, svi mi imamo sajtove koje najčešće posjećujemo: webmail, web pretraživač, portali sa vijestima. Upravo zbog toga je u Internet Exploreru 9 omogućeno da korisnici svoje omiljene sajtove zakače na meni Start ili Windows Taskbar, te da budu na dohvat ruke - jedan klik miša udaljeni od njih.
Kako pinovati web sajt?
Korisnik može da pinuje sajt u taskbar na dva načina:
- Prevlačenjem taba na taskbar
- Prevlačenjem ikonice iz polja adrese na taskbar
Kod sajtova prikačenih na taskbar prozor Internet Explorera se suptilno mijenja kako bi se naznačilo da se radi o specifičnoj "aplikaciji". Ulogu Home ikonice preuzima favicon ikonica pinovanog sajta. Branding uključuje i promjenu kombinacije boja na tasterima Forward i Back koja se mijenja u skladu sa bojama na favicon ikonici.
Kako pretvoriti sajt u Windows 7 "aplikaciju"?
Pinovani sajtovi se ponašaju kao zasebne instance Internet Explorera, a omogućavaju programerima da implementiraju funkcionalnosti karakteristične za Windows 7 aplikacije: jump liste, dodavanje tastera na thumbnail preview, kao i kreiranje notifikacija na ikonici pinovanog sajta. Sama implementacija ovih funkcionalnosti je dosta jednostavna i brza – u roku od najduže sat vremena moguće je na bilo koji sajt dodati podršku za Windows 7 integraciju sa jump listama, a sve modifikacije HTML-a se nalaze u HEAD tagu i ne mijenja se HTML markup koji služi za prikaz strane u browseru.
U ovom članku ćemo, umjesto demo koda, kao primjer koristiti sajt ITpro.ba, odnosno analizirati implementaciju koja sadrži:
- Ime i ikonicu aplikacije
- Jump liste sa zadacima i custom grupom zadataka definisanog naziva
Kompletna implementacija se može vidjeti na sajtu www.itpro.ba u HTML-u početne strane, za šta možete koristiti opciju View Source iz kontekstualnog menija ili alat Internet Explorer Developer Tools koji je ugrađen u Internet Explorer te se aktivira pritiskom F12 na tastaturi.
Ime i ikonica
Poput "običnih" aplikacija, i za sajtove je moguće definisati ime, ikonicu i tooltip - obično u zaglavlju početne strane sajta, odnosno unutar HEAD taga.
Ikonica je definisana kao standardni favicon, uz određene modifikacije.ico fajla. Naime, pored standardne 16x16 ikonice, preporučljivo je da .ico fajl sadrži još i ikonice formata 24x24, 32x32 i 64x64. Format 32x32 se koristi za ikonicu aplikacije u Windows Taskbaru i na samom browseru, dok je format 64x64 neophodan za prečicu (shortcut) na desktopu. Za kreiranje kompatibilne ikonice možete koristiti online editor X-Icon Editor kojeg možete pronaći ovdje.
Ova aplikacija omogućava crtanje ikonica piksel-po-piksel, kao i mogućnost kreiranja ikonice uvozom postojeće fotografije ili ikonice. Naziv, adresa početne strane i tooltip aplikacije definisani su meta tagovima application-name, msapplication-starturl i msapplication-tooltip. Adresa početne strane aplikacije predstavlja adresu strane koja će se otvoriti kada posjetilac klikne na ikonicu sajta u Taskbaru, te je preporučljivo navesti početnu stranu web sajta kao vrijednost ovog parametra. Ukoliko se ovaj parametar ne definiše, klikom na ikonicu aplikacije u Taskbaru otvorit će se ona strana na sajta sa koje je korisnik pinovao aplikaciju, a korisnik može sajt da pinuje sa bilo koje njegove strane.
Naredna tabela ilustrira ovaj scenarij:
Pored ikonice, naziva, početne adrese i tooltipa, programer web sajta može da definiše i ove META tagove:
<meta name="msapplication-window" content="width=1024;height=768" /><meta name="msapplication-navbutton-color" content="#FFFFFF" />Liste sa zadacima
Jump liste na pinovanim web sajtovima mogu da sadrže dvije grupe zadataka:
- Statične zadatke, definisane pomoću meta-tagova
- Dinamične zadatke u custom kategoriji, definisane pomoću JavaScripta
Statični zadaci smješteni su u grupi Tasks na jump listi, i ovi zadaci su zajednički za sve korisnike. Zadaci u ovoj grupi definišu se pomoću meta-taga msapplication-task smještenom u HEAD tagu.
Zadatke je moguće kreirati i korištenjem JavaScripta. To su tzv. dinamični zadaci koji se mogu kreirati prilikom učitavanja strane, ili u bilo kom trenutku nakon što se strana učita u browser. Na taj način dinamički zadaci omogućavaju realizaciju scenarija obavještavanja korisnika. Na primjer, moguće je kreirati obavještenja za korisnika webmaila kada mu pristigne nova poruka, ili obavijestiti korisnika online kalendara o narednim sastancima. Za razliku od statičnih zadataka, prilikom kreiranja dinamičnih zadataka neophodno je:
1. Kreirati kategoriju jump liste u JavaScriptu komandom msSiteModeCreateJumplist
2. Dodati zadatke na listu pomoću msSiteModeAddJumpListItem
3. Konačno, učiniti kreiranu listu vidljivom pozivanjem komande msSiteModeShowJumplist
Pored ovih komandi, postoji i komanda za uklanjanje custom kategorije sa jump liste, a to je msSiteModeClearJumpList.
Često postoji potreba da se provjeri da li je sajt pinovan u taskbar ili meni Start, pa u zavisnosti od toga korisnika obavijestiti o mogućnosti pinovanja sajta i njegovog dodavanja na spisak instaliranih aplikacija. U te svrhe se provjerava flag window.external.msIsSiteMode() . Ukoliko se kao rezultat provjere dobije FALSE, znači da sajt nije pinovan. U suprotnom, ako je rezultat TRUE, sajt je pinovan u taskbar ili u Start meni.
Umjesto zaključka...
U ovom tekstu obrađen je osnovni scenarij korištenja novih mogućnosti za integraciju web sajtova sa Windows 7 operativnim sistemom, koje se mogu implementirati korištenjem meta tagova i JavaScripta, a "rade" na Internet Exploreru 9. Na primjeru sajta ITpro.ba pokazano je kreiranje parametara browser "aplikacije", kao i dva načina kreiranja jump listi.
Ostale mogućnosti za integraciju su kreiranje notifikacija na ikonici aplikacije u taskbaru, te kreiranje tastera na thumbnail preview sličicama (npr. povezanih sa multimedijalnim sadržajima na strani), ali o tome ćemo nekom drugom prilikom. Više o pinovanju sajtova možete saznati na MSDN-u.
Komentari (0)