Скачать презентацию LIS 900 C lecture 3 Information Architecture 2002 Скачать презентацию LIS 900 C lecture 3 Information Architecture 2002

09f2e42902168068b1df110676d5238a.ppt

  • Количество слайдов: 44

LIS 900 C lecture 3: Information Architecture 2002 -05 -15 LIS 900 C lecture 3: Information Architecture 2002 -05 -15

Reading • ``Information Architecture'' by Louis Rosenfeld and Peter Morville, O'Reilly 1998 • There Reading • ``Information Architecture'' by Louis Rosenfeld and Peter Morville, O'Reilly 1998 • There is now a second edition, hopefully it is better • Contents is very thin, I summarize the whole book here.

Sensitivity exercise • What do you hate about a web site? • What do Sensitivity exercise • What do you hate about a web site? • What do you like about a web site? • All issues to do with that fall into three categories – Technical – Look and Feel – Architecture

Reasons to hate a web site • • Can't find it. Page crowded Loud Reasons to hate a web site • • Can't find it. Page crowded Loud colours Gratuitous use of technology Inappropriate tone Designer centered Lack of attention to detail

Reasons to like a web site • • • useful attractive to look at Reasons to like a web site • • • useful attractive to look at thought provoking findabilty personalisation

Why is it so difficult • technical expertise • graphical design expertise • overall Why is it so difficult • technical expertise • graphical design expertise • overall structure

IA determines • organization • content • functionality – navigation – labeling – searching IA determines • organization • content • functionality – navigation – labeling – searching

Good IA is important for the producer • web site an important point of Good IA is important for the producer • web site an important point of first contact • needs to determine overall design before the site is built • reorganizing a site is – costly – difficult

Topics covered • • Classification navigation labelling making a site searchable Topics covered • • Classification navigation labelling making a site searchable

The challenge of classification • ambiguity: ``a tomato is a red or yellowish fruit The challenge of classification • ambiguity: ``a tomato is a red or yellowish fruit with a juicy pulp, used as a vegetable, botanically it is a berry. '' • heterogeneity – in a library – on a web site • granularity • format • difference in perspective • internal politics

Organizational schemes • Exact schemes – alphabetical – chronological – geographical • ambiguous schemes Organizational schemes • Exact schemes – alphabetical – chronological – geographical • ambiguous schemes – topical: should be there, but not the only scheme – task-oriented – audience-specific: open or closed • metaphor-driven: not as overall organization • Hybrid schemes are not good

The mixed-up library • • adult arts and humanities community center get a library The mixed-up library • • adult arts and humanities community center get a library card learn about our library science teen youth

Organizational form: hierarchies • keep balance between breadth and depth • obey 7 +-2 Organizational form: hierarchies • keep balance between breadth and depth • obey 7 +-2 rule horizontally, • no more than 5 levels vertically • cross-link ambiguous items if really necessary • keep new sites shallow

organizational forms: hypertext • great flexibility • great potential for confusion • not good organizational forms: hypertext • great flexibility • great potential for confusion • not good as a prime organizational structure

organizational forms: database • • powerful for searching useful if there is controlled vocabulary organizational forms: database • • powerful for searching useful if there is controlled vocabulary easy reorganization on the fly or static generation of pages – but ensure robot indexing • not good for heterogenous data

Navigation aids • • provide context allow for flexibility of movement support associative learning Navigation aids • • provide context allow for flexibility of movement support associative learning danger of overwhelming the user

browser navigation aids • They include – open – back – forward – history browser navigation aids • They include – open – back – forward – history – bookmarks – prospective view – visited url color • sites should not corrupt the browser.

navigation • the ``you are here'' mark – pages should indicate site name – navigation • the ``you are here'' mark – pages should indicate site name – navigation should be consistent – navigation not to refer to current pages – highlight current page in a different way • allow for lateral navigation

Types of navigational systems • global hierarchical navigation systems – text – icon • Types of navigational systems • global hierarchical navigation systems – text – icon • local navigation systems: integration with global system can be challenging • ad hoc navigation: clear label are required

Frames are problematic • • potential waste of pages real estate speed of display Frames are problematic • • potential waste of pages real estate speed of display disrupt the page model complex design

remote navigation system I • table of contents – – good in a hierarchical remote navigation system I • table of contents – – good in a hierarchical web site reinforce the hierarchy facilitate known-item access resist temptation to overwhelm user • indexes – – presents key term without hierarchy key terms found from search behavior links terms to final destination pages use term rotation

remote navigation systems II • site maps – – – is a graphical representationof remote navigation systems II • site maps – – – is a graphical representationof the site's contents new because no equivalent in print there automated tools to generate site maps seldomly well-done to be kept simple • guided tours – important for sites with restricted access – should feature linear navigation

labelling • a label is short expression that represents a larger set of information. labelling • a label is short expression that represents a larger set of information. • example: ``contact us'' • labelling is an outgrowth of site organization, that we have discussed previously. • labelling communicates the organization of the site

Why bother • we need to guess at how users respond to a label Why bother • we need to guess at how users respond to a label • users will not spend much time interpreting the label • appropriate tone, no ``hot'', cool'', `stuff'' • should reflect thinking of the user, not of the owner • it is easy to have unplanned labelling

Good labelling • Sticking with the familiar – – – main, main page, home Good labelling • Sticking with the familiar – – – main, main page, home page search, find browse contact, contact us, feedback Help, FAQ, Frequently Asked Questions About, About Us • Labels may be augmented with scope notes

Grammatical consistency • contact us, search our site, browse our content • contact, search, Grammatical consistency • contact us, search our site, browse our content • contact, search, browse • contact information, search page, table of contents • (also good in student essays)

Labels as indexing terms • use in <meta>tags, or in <title> tag • use Labels as indexing terms • use in tags, or in tag • use as controlled vocabulary in the database • but some search, in fact almost all, engines do not use metadata </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Textual labels born in Vöklingen, (Saarland) in 1965, I studied Economics and Social Sciences" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-28.jpg" alt="Textual labels born in Vöklingen, (Saarland) in 1965, I studied Economics and Social Sciences" /> Textual labels born in Vöklingen, (Saarland) in 1965, I studied Economics and Social Sciences at the universities of Toulouse, Paris, Exeter and Leicester. Between Febrary 1993 and April 2001 I lectured in the Department of Economics at the University of Surrey. In 1993 I founded Net. Ec, a consortium of Internet projects for academic economists. In 1997, I founded the Re. PEc dataset to document Economics. Between October and December 2000, I held a visiting professorship at Hitotsubashi University. </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="labels as headings • good practice: – consistency in terminology: wording on labels is" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-29.jpg" alt="labels as headings • good practice: – consistency in terminology: wording on labels is" /> labels as headings • good practice: – consistency in terminology: wording on labels is uniform and cohesive – consistency in granularity • chunks covered by labels at the same level is roughly equal • chunks covered do not vary by their depth </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Iconic labels • There is only a limited ``vocabulary'' of commonly understood labels •" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-30.jpg" alt="Iconic labels • There is only a limited ``vocabulary'' of commonly understood labels •" /> Iconic labels • There is only a limited ``vocabulary'' of commonly understood labels • it is fine for some key concepts • labels need to be very consistently placed • they can communicate a graphic identity for the page • they are easy to find on a page, provided that page is not long </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Designing labelling systems I • start from existing one – put in table or" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-31.jpg" alt="Designing labelling systems I • start from existing one – put in table or" /> Designing labelling systems I • start from existing one – put in table or tree (on paper) – make small changes towards consistency • ``benevolent plagiarism'' from competitors and academic sites • use controlled vocabularies, example yellow pages </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Designing labeling systems II • use a thesaurus, example legislative indexing vocabulary – –" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-32.jpg" alt="Designing labeling systems II • use a thesaurus, example legislative indexing vocabulary – –" /> Designing labeling systems II • use a thesaurus, example legislative indexing vocabulary – – ``see'' link ``see also'' links broader terms narrower terms • labels from contents: best judged by an outsider • labels from query logs • labels from user interviews • labels from modeling user needs </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="fine tuning a labelling system • remove duplicates • sort alphabetically • homogenize case" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-33.jpg" alt="fine tuning a labelling system • remove duplicates • sort alphabetically • homogenize case" /> fine tuning a labelling system • remove duplicates • sort alphabetically • homogenize case and punctuation and grammar • remove synonyms according to audience • make labels as different from one another as possible • search for gaps • look into the future • keep scope focussed • consider granularity </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="why not make a site searchable • • not a tool to satisfy all" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-34.jpg" alt="why not make a site searchable • • not a tool to satisfy all" /> why not make a site searchable • • not a tool to satisfy all user's needs not good on poor contents not a cure for bad browsing! needs good planning </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="why make a site searchable • cope with bad organization (Foyle's) • dynamic contents" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-35.jpg" alt="why make a site searchable • cope with bad organization (Foyle's) • dynamic contents" /> why make a site searchable • cope with bad organization (Foyle's) • dynamic contents • large contents </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="user needs • some want overview, others want detail • some need accuracy, others" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-36.jpg" alt="user needs • some want overview, others want detail • some need accuracy, others" /> user needs • some want overview, others want detail • some need accuracy, others don‘t care much • some can wait, others need it now • some need some info, others need a comprehensive answer </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="user's searching expectation • • known-item searching existence searching exploratory searching comprehensive searching " src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-37.jpg" alt="user's searching expectation • • known-item searching existence searching exploratory searching comprehensive searching " /> user's searching expectation • • known-item searching existence searching exploratory searching comprehensive searching </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="integrated searching and browsing • literature deals with separate browsing and searching systems •" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-38.jpg" alt="integrated searching and browsing • literature deals with separate browsing and searching systems •" /> integrated searching and browsing • literature deals with separate browsing and searching systems • browsing and searching in a single system • with multiple iteration • and associative learning takes place </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="designing search interfaces I • level of expertise – boolean? – concept search? •" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-39.jpg" alt="designing search interfaces I • level of expertise – boolean? – concept search? •" /> designing search interfaces I • level of expertise – boolean? – concept search? • amount returned – comprehensive? – verbose? • how much to make searchable </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="designing search interfaces II • search target – navigation pages? – HTML only? •" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-40.jpg" alt="designing search interfaces II • search target – navigation pages? – HTML only? •" /> designing search interfaces II • search target – navigation pages? – HTML only? • are there specific types of data that users will want multi-lingual? • audience difference </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="features of sophisticated search engines • • fielded searches sophisticated query languages reusable results" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-41.jpg" alt="features of sophisticated search engines • • fielded searches sophisticated query languages reusable results" /> features of sophisticated search engines • • fielded searches sophisticated query languages reusable results set customizable relevance </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Deal with problems • getting too much: suggest boolean AND • getting nothing: suggest" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-42.jpg" alt="Deal with problems • getting too much: suggest boolean AND • getting nothing: suggest" /> Deal with problems • getting too much: suggest boolean AND • getting nothing: suggest boolean OR or truncation • bad answers: suggest to contact an expert, may be not. . . </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Engines that are available • • • swish-e swish++ ht/dig roads custmized engine with" src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-43.jpg" alt="Engines that are available • • • swish-e swish++ ht/dig roads custmized engine with" /> Engines that are available • • • swish-e swish++ ht/dig roads custmized engine with my. SQL and PHP, the so-called AMP web site </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="Thank you for your attention http//openlib. org/home/krichel " src="https://present5.com/presentation/09f2e42902168068b1df110676d5238a/image-44.jpg" alt="Thank you for your attention http//openlib. org/home/krichel " /> Thank you for your attention http//openlib. org/home/krichel </p> </div> <div style="width: auto;" class="description columns twelve"><p><img class="imgdescription" title="" src="" alt="" /> </p> </div> </div> <div id="inputform"> <script>$("#inputform").load("https://present5.com/wp-content/plugins/report-content/inc/report-form-aj.php"); </script> </div> </p> <!--end entry-content--> </div> </article><!-- .post --> </section><!-- #content --> <div class="three columns"> <div class="widget-entry"> </div> </div> </div> </div> <!-- #content-wrapper --> <footer id="footer" style="padding: 5px 0 5px;"> <div class="container"> <div class="columns twelve"> <!--noindex--> <!--LiveInternet counter--><script type="text/javascript"><!-- document.write("<img src='//counter.yadro.ru/hit?t26.10;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";"+Math.random()+ "' alt='' title='"+" ' "+ "border='0' width='1' height='1'><\/a>") //--></script><!--/LiveInternet--> <a href="https://slidetodoc.com/" alt="Наш международный проект SlideToDoc.com!" target="_blank"><img src="https://present5.com/SlideToDoc.png"></a> <script> $(window).load(function() { var owl = document.getElementsByClassName('owl-carousel owl-theme owl-loaded owl-drag')[0]; document.getElementById("owlheader").insertBefore(owl, null); $('#owlheader').css('display', 'inline-block'); }); </script> <script type="text/javascript"> var yaParams = {'typepage': '1000_top_300k', 'author': '1000_top_300k' }; </script> <!-- Yandex.Metrika counter --> <script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(32395810, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true, webvisor:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/32395810" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> <!--/noindex--> <nav id="top-nav"> <ul id="menu-top" class="top-menu clearfix"> </ul> </nav> </div> </div><!--.container--> </footer> <script type='text/javascript'> /* <![CDATA[ */ var wpcf7 = {"apiSettings":{"root":"https:\/\/present5.com\/wp-json\/contact-form-7\/v1","namespace":"contact-form-7\/v1"}}; /* ]]> */ </script> <script type='text/javascript' src='https://present5.com/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=5.1.4'></script> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/jquery.shuffle.js?ver=4.9.26'></script> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/scripts.js?ver=1.13'></script> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/shuffle.js?ver=4.9.26'></script> <!--[if lt IE 9]> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/selectivizr.js?ver=1.0.2'></script> <![endif]--> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/notify.js?ver=1734124045'></script> <script type='text/javascript'> /* <![CDATA[ */ var my_ajax_object = {"ajax_url":"https:\/\/present5.com\/wp-admin\/admin-ajax.php","nonce":"9b3dcdc9b1"}; /* ]]> */ </script> <script type='text/javascript' src='https://present5.com/wp-content/themes/sampression-lite/lib/js/filer.js?ver=1734124045'></script> </body> </html>