O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
9. Dr.SabinBuragawww.purl.org/net/busaco
Tipuri de căutări – maniera tradițională:
pe bază de indecși
explorare a Web-ului (crawling) +
prelucrarea conținutului textual (indexing)
Lycos – 1994 (Carnegie Mellon University)
AltaVista – 1995 (Digital Equipment Corporation)
10. Dr.SabinBuragawww.purl.org/net/busaco
Tipuri de căutări – maniera tradițională:
pe baza ierarhiilor de termeni
(servicii de tip catalog – topic directory, taxonomii)
Yahoo! – Yet Another Hierarchical Officious Oracle
1994 (Stanford)
Jerry and David’s guide to the World Wide Web
12. Dr.SabinBuragawww.purl.org/net/busaco
Tipuri de căutări – maniera tradițională:
pe baza legăturilor hipertext
(hyperlink analysis)
Google – 1996 (inițial BackRub – Stanford)
vezi și S. Buraga, „Căutarea resurselor Web” (2016)
https://www.slideshare.net/busaco/sabin-buraga-cutarea-resurselor-web
24. Dr.SabinBuragawww.purl.org/net/busaco
Preluarea și indexarea resurselor
strategii:
natura datelor/relațiilor (data/relation mining)
detectarea subiectului conținutului (topic distillation)
meta-date – date descriind date
(e.g., doar însemnări ca replici la alte mesaje)
căutare socială (tag-uri, anturaj, aplicații Web sociale)
context (e.g., localizare geografică, timp, dispozitiv)
profil al utilizatorului
(e.g., istoric al căutărilor, preferințe lingvistice)
27. Dr.SabinBuragawww.purl.org/net/busaco
Roboți
pornind de la un URL, realizează o conexiune HTTP
la un server Web, pentru a întreprinde anumite
acțiuni privitoare la reprezentarea unei resurse
– uzual, HTML – și, recursiv, din toate resursele
(documentele) desemnate de legăturile existente
în cadrul reprezentării
28. Dr.SabinBuragawww.purl.org/net/busaco
Roboți
pornind de la un URL, realizează o conexiune HTTP
la un server Web, pentru a întreprinde anumite
acțiuni privitoare la reprezentarea unei resurse
– uzual, HTML – și, recursiv, din toate resursele
(documentele) desemnate de legăturile existente
în cadrul reprezentării
acțiuni: extrage de date, copiere, agregare de conținut,
monitorizare, realizare a unui rezumat etc.
43. Dr.SabinBuragawww.purl.org/net/busaco
Orice robot trebuie să respecte
standardul de excludere
„inhibă” vizitarea anumitor zone (secțiuni)
ale unui sit Web
în rădăcina unui domeniu Web
se poate plasa fișierul robots.txt
www.robotstxt.org/robotstxt.html
46. Dr.SabinBuragawww.purl.org/net/busaco
Orice robot trebuie să respecte
standardul de excludere
evitarea indexării conținutului:
<meta name="robots" content="noindex, nofollow" />
a se experimenta și instrumentul Can I Crawl?
http://canicrawl.com/
47. Dr.SabinBuragawww.purl.org/net/busaco
motoare: căutarea
Activitatea generală a unui robot (crawler) simplu:
F = mulțimea de URL-uri de start (frontiera)
cât-timp F este nevidă
extrage un URL u din F
preia pagina (resursa Web) p cu adresa u
dacă p este relevantă
stochează p în index
pentru-fiecare legătură v din p
dacă v nu este în index și v nu aparține lui F
și v ar putea fi vizitată
adaugă v la F
59. Dr.SabinBuragawww.purl.org/net/busaco
motoare: indexarea
Necesitatea folosirii sistemelor de baze de date
depozit distribuit de stocare (eventual, în cloud)
optimizarea regăsirii
modele non-relaționale de stocare – „mișcarea” NoSQL
printre primele abordări: BigTable (Chang et al., 2006)
https://research.google.com/archive/bigtable.html
65. Dr.SabinBuragawww.purl.org/net/busaco
exemplificare: o parte dintre operatorii Google
"expresie" ~termen –termen
related: URL cache: URL link: URL
intitle: termen(i) allintitle: termen(i)
intext: termen(i) allintext: termen(i)
inurl: termen(i) allinurl: termen(i)
site: domeniu info: domeniu
define: termen filetype: extensie
unit1 in unit2 număr1 .. număr2
detalii la www.googleguide.com/advanced_operators_reference.html
66. Dr.SabinBuragawww.purl.org/net/busaco
motoare: interogarea
digital camera $700 .. 1400
~book
intitle:design –intitle:web
"burse de merit"
site:uaic.ro
inurl: art nouveau
allinurl: ES6 library
16 cm in inch
related:www.w3.org
js mvc inanchor:slideshare
define:design
cache:http://devdocs.io/
map:iasi,romania
firefox filetype:svg OR filetype:png
unii operatori sunt permiși doar pentru anumite
tipuri de căutări – e.g., știri, imagini, hărți
74. Dr.SabinBuragawww.purl.org/net/busaco
interacțiunea cu motorul de interogare poate fi facilitată
și de un agent software conversațional
Apple Siri, Google Now, Microsoft Cortana
Dragon Go, Sherpa, SpeakToIt Assistant
thereisabotforthat.com botpress.io
82. Dr.SabinBuragawww.purl.org/net/busaco
motoare: relevanță
Criterii vizând calculul relevanței:
ranking bazat pe conectivitate
analiza relațiilor (legăturilor hipertext) cu alte pagini
eventual, în funcție de reputație
e.g., importanța domeniului Internet
(sunt luați în calcul factori ca vechimea, localizarea,…)
84. Dr.SabinBuragawww.purl.org/net/busaco
motoare: relevanță
Page Rank (Google)
Larry Page & Sergey Brin, 1998
evaluarea relevanței pe baza contextului de apariție
exploatarea relațiilor dintre diferite pagini Web
o legătură de la resursa A la B reprezintă
un vot dat resursei B de către A
http://infolab.stanford.edu/~backrub/google.html
88. Dr.SabinBuragawww.purl.org/net/busaco
timp strategie
înainte de
2000
conținut – indexarea textului
(titlu, anteturi, URL, descriere via <meta>)
2000—2010
conținut
autoritate (via legături desemnate de URL-uri)
2010—
prezent
conținut
autoritate
personalizare (social media + profil utilizator)
2012—
prezent
conținut
autoritate
personalizare
concepte (date structurate + Web of data)
context (localizare geo, limbă, timp, dispozitiv,…)
adaptare după (K. Bodnar & J. Hopkins, 2011)
de studiat și www.slideshare.net/randfish/presentations
92. Dr.SabinBuragawww.purl.org/net/busaco
SERP (Search Engine Result Page)
se includ recomandări pe baza:
preferințelor utilizatorului
istoricului căutărilor
URL-urilor partajate via rețele sociale
meta-datelor (rich snippets)
adnotărilor realizate de utilizatori
localizării geografice (local search)
motoare: afișarea rezultatelor
93. Dr.SabinBuragawww.purl.org/net/busaco
a se considera și DuckDuckGo Instant Answers: https://duck.co/ia
motorul de căutare
DuckDuckGo este axat
asupra asigurării intimității
utilizatorului în ceea ce privește
căutările acestuia pe Web
99. Dr.SabinBuragawww.purl.org/net/busaco
Motor de căutare internă (la nivel de sit)
îmbunătățirea interacțiunii – utilizabilitatea
integrarea în designul general al sitului
tactici: oferirea unui următor pas de realizat
(mai ales când nu există rezultate),
sugestii privind căutarea, exemple, rafinarea cererii etc.
100. Dr.SabinBuragawww.purl.org/net/busaco
Motor de căutare internă (la nivel de sit)
în pagina de redare a rezultatelor, va fi afișată și
interogarea inițială, cu posibilitatea modificării ei
oferirea a cel puțin N rezultate/pagină +
indicarea numărului total de pagini de rezultate
sau
încărcarea progresivă a următoarelor rezultate
101. Dr.SabinBuragawww.purl.org/net/busaco
Motor de căutare internă (la nivel de sit)
calitatea rezultatelor oferite e dependentă
și de modul de structurare a datelor
fiecare rezultat să includă informații utile
folosirea unui vocabular înțeles de către vizitator,
utilizarea unor tehnici de vizualizare intuitivă,
facilitarea filtrării și sortării datelor etc.
106. Dr.SabinBuragawww.purl.org/net/busaco
SEO – Search Engine Optimization
suită de strategii de redactare a codului HTML
în vederea obținerii unei relevanțe ridicate
a conținutului, astfel încât pagina/situl să fie
regăsite în urma unei căutări specifice efectuate
cu un instrument de căutare
108. Dr.SabinBuragawww.purl.org/net/busaco
Se recurge la semnificația logică a marcatorilor HTML
POSH (Plain Old Semantic HTML)
titluri plasate ierarhic via elementele <h1>, <h2>,…
conținut tabelar cu <table>
aranjament vizual (layout)
via stiluri CSS și nu tabele (<table> <tr>…)
109. Dr.SabinBuragawww.purl.org/net/busaco
Se recurge la semnificația logică a marcatorilor HTML
POSH (Plain Old Semantic HTML)
divizarea conținutului:
<section> <article> <header> <footer> <aside> etc.
marcajarea elementelor vizând navigabilitatea cu <nav>
liste specificate cu <ul> <ol> <li>
…
111. Dr.SabinBuragawww.purl.org/net/busaco
Se recurge la semnificația logică a marcatorilor HTML
POSH (Plain Old Semantic HTML)
conținut textual alternativ pentru imagini (<img alt="..." />),
legături (<a title="...">), tabele (<table summary="...">),
multimedia,…
atașarea de meta-date externe în antetul paginii Web
via <head>, <meta /> și <link />
A free guide to <head> elements – http://gethead.info/
112. Dr.SabinBuragawww.purl.org/net/busaco
Se recurge la semnificația logică a marcatorilor HTML
POSH (Plain Old Semantic HTML)
de evitat elementele învechite – e.g., cadre (frame-uri) –
sau proprietare (<blink> ori <marquee>)
documentul trebuie să fie bine-formatat
verificarea corectitudinii codului HTML cu instrumentul
oferit de Consorțiul Web – validator.w3.org
a se considera și html5boilerplate.com
113. Dr.SabinBuragawww.purl.org/net/busaco
Conținutul primează – content is king
o importanță majoră o are titlul paginii
Untitled Document – aproape 22 de milioane de rezultate
situl trebuie actualizat periodic, frecvent
numele fișierelor (imagini, stiluri,…) contează
tehnică utilă:
„transformarea” URL-urilor – e.g., mod_rewrite la Apache
anumite date pot fi „ascunse” de roboți via robots.txt
114. Dr.SabinBuragawww.purl.org/net/busaco
Realizarea legăturilor între pagini (hipermedia)
obligatoriu, de inclus legături spre alte resurse
(ale sitului propriu ori ale altor situri)
dorim legături spre/de la situri importante
având conținut similar cu situl nostru
de verificat și menținut structura hipertextului
instrumentul LinkChecker – validator.w3.org/checklink
115. Dr.SabinBuragawww.purl.org/net/busaco
Realizarea legăturilor între pagini (hipermedia)
de citit cap. 2 din S. Buraga, Proiectarea siturilor Web, Polirom, 2005
www.slideshare.net/busaco/sabin-buraga-proiectarea-siturilor-web
tehnici clasice
așa-zis „demodate”:
interschimb de adrese
(link-uri) – banner-e, blogroll-uri
marketing bazat pe context
e.g., produse/servicii înrudite
116. Dr.SabinBuragawww.purl.org/net/busaco
Realizarea legăturilor între pagini (hipermedia)
recurgerea la aplicații Web sociale
SMO – Social Media Optimization
partajare în rețeaua de „prieteni”,
apreciere, comentarii, opinii,…
S. Buraga, Design Patterns for Social (Web/mobile) Interactions, 2017
profs.info.uaic.ro/~busaco/teach/courses/hci/hci-film.html#week7
118. Dr.SabinBuragawww.purl.org/net/busaco
Realizarea legăturilor între pagini (hipermedia)
de evitat paginile de eroare – 404 Not Found
orice pagină de eroare poate fi „convertită”
într-o resursă folositoare omului/robotului
uzual, se oferă harta sitului (site map),
legături relevante, motor intern de căutare,…
http://alistapart.com/article/perfect404
http://alistapart.com/article/amoreuseful404
121. Dr.SabinBuragawww.purl.org/net/busaco
Specificarea structurii unui sit Web
crearea documentului sitemap.xml
pentru a fi ulterior procesat de motorul de căutare
www.sitemaps.org/protocol.html
complementar fișierului robots.txt
furnizează structura hipertext a unui sit Web
datele pot fi furnizate
și în formatele Atom, RSS și text obișnuit
122. Dr.SabinBuragawww.purl.org/net/busaco
Specificarea structurii unui sit Web
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://developer.mozilla.org/en-US/docs/AJAX</loc>
<lastmod>2017-08-01</lastmod>
</url>
<!-- alte elemente url -->
</urlset>
cazuri concrete:
developer.mozilla.org/sitemap.xml
techcrunch.com/sitemap.xml
instrument Web de generare: www.xml-sitemaps.com
125. Dr.SabinBuragawww.purl.org/net/busaco
Paginile de „acoperire” (page cloaking)
scop: oferirea de conținut diferit,
în funcție de un anumit criteriu
(aici, conținut special pentru roboții de căutare)
black-hat page cloaking
tehnică penalizată: support.google.com/webmasters/answer/66355
126. Dr.SabinBuragawww.purl.org/net/busaco
Oferirea de conținut via documente
adoptând formate de date nestandardizate
Titluri identice pentru toate paginile unui sit
Pagini de eroare oferite de server
via codul de stare HTTP 200 Ok
Redirecționări incorecte/malițioase
Abuzul de transferuri asincrone (Ajax)
de evitat
131. Dr.SabinBuragawww.purl.org/net/busaco
Dark Web
acea parte a spațiului informațional reprezentat
de Deep Web care în mod intenționat e ascunsă
și inaccesibilă via navigatoare Web comune
exemplu notoriu:
rețele anonime (VPN – Virtual Private Network)
accesate cu TOR Browser
144. Dr.SabinBuragawww.purl.org/net/busaco
schema.org
colecție de vocabulare (scheme de date)
– e.g., Book, Event, LocalBusiness, Movie, Offer, Person,
Place, Recipe, Review, TVSeries,… – recunoscute și
indexate de roboții principalelor motoare de căutare
istoric și viziune:
R. Wallis, “Schema.org: Where did that come from?”,
LODLAM Summit 2017
www.slideshare.net/rjw/schemaorg-where-did-that-come-from-77955231
145. Dr.SabinBuragawww.purl.org/net/busaco
schema.org
colecție de vocabulare (scheme de date)
– e.g., Book, Event, LocalBusiness, Movie, Offer, Person,
Place, Recipe, Review, TVSeries,… – recunoscute și
indexate de roboții principalelor motoare de căutare
Bing, Google, Yahoo!, Yandex
amănunte la https://schema.org/docs/gs.html
modele
conceptuale
149. Dr.SabinBuragawww.purl.org/net/busaco
Thing – schema cea mai generală, incluzând conceptualizări
(clasificări realizate riguros)
Action
BroadcastService
CreativeWork
Event
Intangible
MedicalEntity
Organization
Person
Place
Product
Class
Property
modelare de cunoștințe
(via o ontologie)
153. Dr.SabinBuragawww.purl.org/net/busaco
<p itemid="#busaco" itemscope="" itemtype="http://schema.org/Person">
This discipline is taught by
<span itemprop="honorificPrefix">Dr.</span>
<a href="https://profs.info.uaic.ro/~busaco/"
title="Visit the Website of Sabin-Corneliu Buraga" itemprop="url">
<span itemprop="name">
<span itemprop="givenName">Sabin</span>-
<span itemprop="additionalName">Corneliu</span>
<span itemprop="familyName">Buraga</span>
</span>
</a>.
</span>
</p>
specificarea (adnotarea explicită a) faptului:
„entitatea având numele Sabin-Corneliu Buraga este
o persoană, posedă titlul Dr. și are situl Web propriu
disponibil la adresa https://profs.info.uaic.ro/~busaco/”
157. Dr.SabinBuragawww.purl.org/net/busaco
<article itemscope="" itemtype="http://schema.org/Event">
<section id="contest">
<h2>Tema</h2>
<p itemprop="description">Concursul este destinat studenților
<span itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<a href="http://www.info.uaic.ro/" itemprop="url" title="Spre situl FII>
<span itemprop="name">FII</span></a>
(UAIC <span itemprop="address">Iași, România</span>)</span>
și constă în optimizarea conținutului și structurii unui sit Web.</p>
…
<p>Perioadă de desfășurare:
<span itemprop="startDate" content="2017-10-14T00:00">14 octombrie 2017
</span>—<strong><span itemprop="endDate" content="2018-01-07T17:00">
7 ianuarie 2018, ora 17:00</span></strong>.</p>
</section>
…
</articol>
pe baza schema.org, se pot modela în HTML date vizând un
eveniment (Event) și locul de desfășurare a acestuia (Place)
159. Dr.SabinBuragawww.purl.org/net/busaco
inspectarea datelor structurate cu OpenLink Structured Data Sniffer
– extensie de browser Web: http://osds.openlinksw.com/
exemple reale: pinterest.com/kidehen/structured-metadata-related/
specificarea meta-datelor privitoare
la instanța de Articol
construcții RDFa utilizând
Open Graph Protocol (Facebook) – ogp.me
160. Dr.SabinBuragawww.purl.org/net/busaco
acțiuni asociate vizualizării unui produs (instanță a Product)
detalii la http://schema.org/docs/actions.html
vezi și Increase user engagement with actions in emails
developers.google.com/gmail/markup/
caz concret: eBay
acțiuni ce pot fi efectuate de utilizator
(ViewAction e sub-concept al Action)
context: dispozitive mobile, e-mail,…
161. Dr.SabinBuragawww.purl.org/net/busaco
Microdatele HTML5 sunt indexate de motoarele de căutare
Bing Webmaster
tinyurl.com/b9mx2f2
Google Structured Data
developers.google.com/structured-data/
research.googleblog.com/search/label/schema.org
Yahoo! BOSS (Build your Own Search Service)
developer.yahoo.com/search/boss/
Yandex Webmaster
yandex.com/support/webmaster/schema-org/