Session 11: Resources and references

INM348 - Digital Information Technologies and Architectures
 
This section contains all the links and references used in this set of blogposts.

A note on hyperlinks: All the hyperlinks in this blog were tested and retrieved on 22 December 2009. Where I have referenced hyperlinks in a blog entry, I have put the full URL in square brackets to enable my PDF creator to make these links live. This extra text isn't included in any of the word counts.

If you are reading the PDF and, for any reason, the link does not work, please refer to the blog itself for the working link.

Resources
This blog URL, available at:
http://theabandonedbrain.blogspot.com/
 Personal webspace, available at:
http://www.student.city.ac.uk/~abhd820/index.html
Simple CSS, available at:
http://www.student.city.ac.uk/~abhd820/paulspage.css
XML example, available at:
http://www.student.city.ac.uk/~abhd820/H&S-library.xml
XML example DTD, available at:
http://www.student.city.ac.uk/~abhd820/H&S-library-dtd.txt
Javascript exercise for session 9, available at:
http://www.student.city.ac.uk/~abhd820/javascript-example.html

References
BBC Technology News, Blogger marks 10-year milestone, available at:
http://news.bbc.co.uk/1/hi/technology/8286174.stm
Berners-Lee, T and Fischetti, M (1999) Weaving the Web: the origins and future of the World Wide Web, London: Orion Business
Bing home page, available at: http://www.bing.com/
Blogger dashboard, available at: http://www.blogger.com/home
British Library online integrated catalogue, available at:
http://catalogue.bl.uk/F/?func=file&file_name=login-bl-list
Castro, E. (2001) XML for the World Wide Web, Berkeley, Calif.: Peachpit Press
City University London, web library catalogue, available at: http://www.city.ac.uk/library/
DITA lecture notes. CitySpace (City University Virtual Learning Environment). Available at:
https://cityspace0.city.ac.uk/webct/urw/lc20804.tp0/cobaltMainFrame.dowebct?JSESSIONID=BB01LyQJyLY11pW3lL1xGdRprG0wZRKjYvwXJj14m2n284fDpSZt!1034102646!csp0ndg.city.ac.uk!80!-1!815643302!csp0ndh.city.ac.uk!80!-1
DITA lecture notes, Session 9 (Applications Development). CitySpace (City University Virtual Learning Environment). Available at:
https://cityspace0.city.ac.uk/webct/urw/lc20804.tp0/cobaltMainFrame.dowebct?JSESSIONID=BB01LyQJyLY11pW3lL1xGdRprG0wZRKjYvwXJj14m2n284fDpSZt!1034102646!csp0ndg.city.ac.uk!80!-1!815643302!csp0ndh.city.ac.uk!80!-1
Englander, I. (2000) The architecture of computer hardware and systems software : an information technology approach, New York: Chichester; Wiley
Flanagan, D (1998) JavaScript: the definitive guide, Sebastopol, CA: O'Reilly
Livejournal homepage, available at: http://www.livejournal.com/
Morville, P & Rosenfeld, L, (2006) Information Architecture for the World Wide Web (3rd ed), Sebastopol, CA: O'Reilly
Mouchel corporate website, services page. Available at:
http://www.mouchel.com/services_atoz/default.aspx
Google UK homepage, available at: http://www.google.co.uk/
Google help page, available at:
http://www.google.co.uk/support/websearch/bin/answer.py?answer=136861
Googleguide website, advanced search operators page. Available at:
http://www.googleguide.com/advanced_operators_reference.html
Tesco homepage, available at: http://www.tesco.com/
Tutorialised website, Javascript tutorials pages. Available at:
http://www.tutorialized.com/tutorials/Javascript/1
University of California Berkely web search comparison page, available at:
http://www.lib.berkeley.edu/TeachingLib/Guides/Internet/SearchEngines.html
W3Schools website, available at: http://www.w3schools.com/
Web Resources Depot - free vector maps page. Available at:
http://www.webresourcesdepot.com/free-vector-world-maps-collection/
Wikipedia - Cascading Style Sheets. Available at:
http://en.wikipedia.org/wiki/Cascading_Style_Sheets
Wikipedia - hyperlinks. Available at:
http://en.wikipedia.org/wiki/Hyperlink
Wikipedia - GIFs. Available at:
http://en.wikipedia.org/wiki/Graphics_Interchange_Format
Wikipedia - JPEGs. Available at:
http://en.wikipedia.org/wiki/JPEG
Wikipedia - PNG. Available at:
http://en.wikipedia.org/wiki/Portable_Network_Graphics
World Wide Web consortium, Tim Berners-Lee profile page,
available at: http://www.w3.org/People/Berners-Lee/
Wordpress homepage, available at: http://wordpress.org/
Zen Garden CSS design website, available at: http://www.csszengarden.com/

Session 10: information architecture

INM348 - Digital Information Technologies and Architectures
 
In this session we took a look at the idea of  'information architecture'. Morville and Rosenfeld (2007) use the term to encompass a variety of behaviours related to creating, structuring and organizing online environments to enable people to get to information in the most efficient and straightforward way, using (for example) website navigation, metadata and controlled vocabularies, and search technologies.

If you don’t organise and label your information properly, your intended users won’t be able to find it, which means that all of your effort and resources you’ve used to create your site, intranet or database will be wasted.

Tesco definitely seems to have considered key principles of information architecture on its website. For example, the Tesco homepage [http://www.tesco.com/] provides me with some easily-understandable topic categories, backed up with a search box in the top right-hand corner of the page. And, as well as making content very findable, it deploys some useful customization enabling me to, for example, store my favourites to make the weekly shop much easier.

How can I use Morville and Rosenfeld's (2007) principles of good information architecture to improve the work that I do supporting my company’s corporate intranet? We use standard HTML and Cascading Style Sheet (CSS) templates across the hundreds of pages on the intranet, which means we can present users with familiar pages. We use topic classification to organise our content – our next step would be to review the labeling we use to assess whether the language we use is consistent and appropriate for the audience. We could also deploy a controlled vocabulary, to improve findability.

Finally, we should consider customization so that users can store searches and key information. In this way, we can ensure that the intranet is a tool that they can use to aid – rather than inhibit – their everyday work.

Word count for this entry: 300 words.

Session 9: client-side programming

INM348 - Digital Information Technologies and Architectures
 
In this session we looked at our first 'direct' programming language, Javascript. It's a language that enables us to create 'client-side' applications, enabling us to carry out certain tasks  - like asking for a user's input - locally rather than having to keep sending information back and forth from a central server. Done in the right way, this client-side programming can make the user's experience of a website quicker and more satisfactory.

For our task this week we looked at using Javascript to take and process simple user inputs, which direct users to certain pages on the BBC website, according to the preferences they stated.

This activity was very challenging; as our lecture notes explain, programming languages can be very unforgiving. It only takes a small error of syntax, grammar or logic in one part of the programme for the whole thing to stop working - which can be frustrating! [URL: https://cityspace0.city.ac.uk/webct/urw/lc20804.tp0/cobaltMainFrame.dowebct?JSESSIONID=BB01LyQJyLY11pW3lL1xGdRprG0wZRKjYvwXJj14m2n284fDpSZt!1034102646!csp0ndg.city.ac.uk!80!-1!815643302!csp0ndh.city.ac.uk!80!-1]

My first impulse was to use the Javascript 'prompt' command to ask for user input, and use 'parseint' to process it. Then, I could use the 'if.. . then' commands to direct the user according to their choices.

So far so good. But was this really the most elegant way to carry out this task? To me, having a series of prompt boxes popping up seemed a bit clunky, so instead I investigated the use of radio buttons to take user input.

You can see my solution here: http://www.student.city.ac.uk/~abhd820/javascript-example.html. The user simply chooses 'News' or 'Sport', which then causes a different set of radio buttons to appear, depending on which initial choice they've made. Once they've made this second choice, they simply click on the 'Go' button to be taken to the page they need.

Word count for this entry: 285 words.

Session 8: information retrieval

INM348 - Digital Information Technologies and Architectures
 
This session deals with information retrieval (IR), which refers to the process of getting information from a wide range databases, sources and collections. It's different to the querying of relational databases which is concerned with getting data from structured and linked database tables.

Let's reflect on the way I have used IR to aid my learning from this module. First of all, I follow references from my lecture notes, either via hyperlinks or offline. I often need to augment these references with my own research, especially as I don't have an IT background. My first stop is usually Google [URL: http://www.google.co.uk/]; Google uses the Boolean 'AND' operator as default [URL: http://www.google.co.uk/support/websearch/bin/answer.py?answer=136861], so I can search for 'XML W3 Schools' to quickly home in on useful resources. Likewise I can use Google's simple search to return a wider set of results, or use other operators if I need to [URL: http://www.googleguide.com/advanced_operators_reference.html].

Google is so simple to use that it's easy to forget that there are other ways of finding information. The University of California has carried out a useful comparison of search engines [URL: http://www.lib.berkeley.edu/TeachingLib/Guides/Internet/SearchEngines.html]; it points out that using multiple search engines if often necessary.

Contents of some specialist catalogues and databases aren’t always crawled by search engines. It’s always worth finding out about electronic library catalogues, such as the City University London [URL: http://www.city.ac.uk/library/] or British Library catalogues [URL: http://catalogue.bl.uk/F/?func=file&file_name=login-bl-list], or specialist databases for the field you’re working in, to provide a deeper perspective on the areas you’re researching.

In conclusion, I’ve been able to augment my learning in this module by developing my own information retrieval skills, from a reliance on Google’s simple search to something more nuanced. I’ve realised that learning the IR skills necessary to harness the vast resources that the online world has to offer has been almost as important as the content of the module itself.

Word count for this entry: 300 words.

Session 7: relational databases

INM348 - Digital Information Technologies and Architectures
 
Databases are an efficient way for organisations to store data in a central repository so that it can be used by a variety of applications and users. The relational database stores this data in a set of tables, linked by 'keys', which can then be manipulated and interrogated by database management software (DBMS).

The database approach removes the need for different teams to store similar sets of data about the same things - client data, for example. Using a central database means the data can be managed and updated consistently, saving time and money.

Many relational databases use structured query language (SQL) to manage the DBMS. SQL uses standard commands to create database tables and we interrogate them using 'queries' to get the information we need.

An example: my company employs a team of account managers to manage long-term contracts with large public sector clients. We don't have a structured way to manage this information, so contact with our clients is often inconsistent. A simple relational database could help us match account managers to major clients, and record the services we provide to them.

So we could set up two tables. Our 'account_managers' table gives each Account Manager an ID number ('am_id'), which is the primary key for this table (Table 1 below).

Table 1. Account managers

am_id	name	job_title	email	location
01	Jim Boardman	Technical Director (Rail)	jb@mp.com	Manchester
02	Kate Robinson	Head of Business Development, (Energy)	kr@mp.com	London
03	Iqbal Shah	Commercial Director (Government Services)	iqs@mp.com	Woking
04	Jeena Keeth	Development Director (Education)	jk@mp.com	Woking
05	Bob Sabberton	Business Development Manager (Utilities)	bbs@mp.com	Liverpool

The primary key from the account_managers table is used as the 'foreign key' in the 'clients table' to identify which account manager handles each client (Table 2 below):

Table 2. Clients

client_id	client_name	account_manager
NWR	Network Rail	01
HWY	Highways Agency	02
HCC	Hertforshire County Council	03
OCC	Oxfordshire County Council	03
ISA	Islington Technical Academy	04
SCW	Scottish Water	05
THW	Thames Water	05

To get a list of which account managers handle which clients, we can use this query:

SELECT client.client_name, account_managers.am_id, account_managers.name, account_managers.job title, account_managers_location FROM clients, account managers WHERE account_manager = am_id;

Fig 5. Example query from database tables. 

The result can help us judge whether the right people in our company are managing the right clients, and we can adjust our business strategy accordingly.

Word count, excluding figures, tables and captions: 283 words.

Session 6: CSS

INM348 - Digital Information Technologies and Architectures
 
Cascading Style Sheets (CSS) are a means of communicating the visual and aesthetic elements of web pages in an effective way. The first CSS specifications were introduced by the World Wide Web Consortium (W3C) in December 1996. Previously, all presentational elements for web pages had to be included in the HTML, often repeatedly, making web code unwieldy and complex.

The combination of CSS and HTML is generally thought to be an elegant solution. You can specify all your layout rules for a group of web pages in a single place - a cascading style sheet - and simply link to them.

You can import different style sheets to the same page; the Zen Garden web site shows how you can use style sheets to give a different appearance to a website without disturbing the content [URL: http://www.csszengarden.com/]. You can import several different style sheets if necessary, for example to aid accessibility for visually-impaired users.

You can use the rules in your CSS to apply layout to the parts of the page you want, such as specifying a font or colour for a heading or paragraph text. You can use the 'class' command to add different styles to the same tag. And you can use 'positioning' to arrange your elements on the web page interesting way, without having to use tables.

As a demonstration, I have set up a simple style sheet for my public web page [URL: http://www.student.city.ac.uk/~abhd820/index.html]. You can see the CSS here: http://www.student.city.ac.uk/~abhd820/paulspage.css.

While most agree that the separation of content from presentation that CSS embodies is a good thing, there are some limitations. For example, different types of browsers tend to interpret CSS inconsistently; and some commentators feel that CSS specifications still lack flexibility - the wikipedia page for CSS summarises these concerns under 'Limitations of CSS'. [URL: http://en.wikipedia.org/wiki/Cascading_Style_Sheets]

Word count: 300 words.

Session 5: XML

INM348 - Digital Information Technologies and Architectures

Back in session 3 we looked at HTML as a way of presenting our text and images on a web page using tags. XML - eXtensible Markup Language - uses tags too. However, XML is designed to allow people to harness the power of the web to manage and interrogate data in efficient but sophisticated ways.

XML is a tool that enables people to create languages to manage and transport their data. For me, although XML has strict rules governing the syntax and grammar of the languages that are created, it can still help me, in my role as a corporate information manager, to manage the vast amounts of corporate information that my colleagues need to carry out their jobs more effectively.

One such example relates to the mountain of Health & Safety information my company is legally obliged to keep. I could use an XML language to order a library of documentation we now have, according to:

• what the document is (ie title and abstract of content)
• whether it is a policy, a process or a form
• which corporate entities it applies to (main company, joint ventures etc)
• who is ultimately responsible for it - our chief executive, our health and safety director or our business unit heads
• when it was last updated

The DTD is shown in Fig 1. You can see the DTD and examples of the XML code on my personal webspace: http://www.student.city.ac.uk/~abhd820/H&S-library.xml.

<!ELEMENT HSlibrary (HS-doc)*>

<!ELEMENT HS-doc (doctitle, doctype, applicableto, approvedby, lastupdated, link, abstract)*>

<!ELEMENT doctitle (#PCDATA)>

<!ELEMENT link (#PCDATA)>

<!ELEMENT lastupdated (#PCDATA)>

<!ELEMENT abstract (#PCDATA)>

<!ATTLIST HS-doc doctype (Policy|Process|Form) #REQUIRED>

<!ATTLIST HS-doc applicableto (all_Mouchel|Liverpool2020|EnterpriseMouchel|Impact_Partnership) #REQUIRED>

<!ATTLIST HS-doc approvedby (Mouchel_CEO|HS_Director|BU_Head) #REQUIRED>

Fig 4. Health and Safety library DTD

By writing it in XML, we could publish it on our corporate intranet, but also exchange it with joint venture companies who may need to combine it with other information and publish it on their intranets.

Word count, excluding figures and captions: 278 words.

Session 4: images

INM348 - Digital Information Technologies and Architectures
 
Most of the things we see on a computer screen – words, numbers and pictures - are presented to us by software as images. These are presented to us digitally using either a raster model – which divides space into a rectangular grid – or a vector model, which represents areas of space as co-ordinates on an axis.

Both techniques can represent pictures via a browser. I can use html tags such as  <img> to make my web page appealing [URL: http://www.student.city.ac.uk/~abhd820/index.html] or use the  <a href>  tags to link to an image held elsewhere, as below:

Fig 3. World map. Image source: Web Resources Depot (free vector maps page).
[URL: http://www.webresourcesdepot.com/free-vector-world-maps-collection/]

Most software formats used for images on web pages - Graphics Interchange Format (.gif), JPEG (.jpg) and Portable Network Graphics (.png) - use raster techniques, and employ some compression to reduce the size of images.

GIF [URL: http://en.wikipedia.org/wiki/Graphics_Interchange_Format] is an 8-bit format, enabling up to 256 colours to be used. Each image keeps colour information in a separate ‘lookup table’ which helps keep file size down.

JPEG [URL: http://en.wikipedia.org/wiki/JPEG] is a 24-bit format, which enables it to display many colours. JPEGs maximize compression which make them great for using on the web. However, the ‘lossy’ compression techniques used by the format often leave ‘artefacts’, which can be noticeable in images with large areas of a single colour (the GIF format is better for this type of image). The degradation is often less noticeable in photographs, which contain many different colours.

PNG [URL: http://en.wikipedia.org/wiki/Portable_Network_Graphics] is a 24-bit format that uses ‘lossless’ compression to avoid this degradation. The compression is not as great as with JPEG files, so file sizes are often bigger.

These image formats give me flexibility when working as a corporate information officer. I can use jpg files for our website [URL: http://www.mouchel.com/services_atoz/default.aspx]  taking advantage of the better compression ratios. In contrast, for technical charts, GIF or PNG files may be a better option.

Word count (excluding figures and captions): 299 words.

Session 3: the net and the web

INM348 - Digital Information Technologies and Architectures
 
In this session we looked at the Internet and the World Wide Web, and some of the protocols and processes that underpin them.

We have set up a series of student web pages as examples for this session - you can see mine here [URL: http://www.student.city.ac.uk/~abhd820/index.html]. My pages use HTML tags to mark up my information for presentation via browsers; they also hyperlink to pages held in different places across the Web. We created the pages on local computers; to make these pages accessible via the Web we had to publish them (via telnet or another file transfer programme) on an external web server hosted by City University.

The Internet was developed by the US military as a decentralised communications network that could continue operating if several nodes were destroyed. Although the Internet gives us the infrastructure it was  Berners-Lee's [URL: http://www.w3.org/People/Berners-Lee/] vision of  'an abstract document space [which] could contain every single item of information accessible over networks' (Berners-Lee, 1999) that made today's World Wide Web a reality. The Web is software that runs over the internet to enable connections between different computers, using common protocols to exchange data.

HTML is a structured approach to publishing web pages. You 'tag' pieces of text or data using standard markers - for headings, paragraphs and so on - and other computers can interpret the tags and thus present the text (or data, or whatever) consistently.

<h1>So this heading tag....</h1>

...shows up as a heading

Fig 2. Interpreted tags. 

And hyperlink tags enable users to jump to different pages [URL: http://en.wikipedia.org/wiki/Hyperlink] regardless of where the physical pages are held.

It's generally best to use HTML to structure your web content. Although there are tags to govern the design of the pages, this can make your pages unwieldly, using techology such as style sheets can be a more elegant solution. We'll look at style sheets on web pages in Session 6.

Word count for this entry, excluding figures and captions: 299 words.

Session 2: data and HTML

INM348 - Digital Information Technologies and Architectures

Binary - counting in base two - underpins all of computing. Data exchanged by computers is expressed in binary, which is expressed as a string of zeros and ones. So, for example, the number 56 is 0011010100110110.

We create formats to enable computers to present this data to us as words, numbers and pictures. For example, ASCII (the American Standard Codes for Information Interchange) is a format to translate 7 bit binary codes into words and numbers.

There are other ways to encode binary data to provide us to do more, such a structuring documents with headings and paragraphs, and so on. We can encode this data about the document and its content - the metadata - into the document, to make it more intelligible. And we can use a system of marking the document up, using tagging, to help our computer software present the document in the way we want it. HTML - the markup language used to structure and present documents on the world wide web - uses tags in angle brackets to denote headings and paragraphs, like this:

<h1>Here's an example of a heading tag</h1>

<p>Here's a paragraph tag.</p>

Fig 1. Examples of tags.

This is all pretty fundamental - after all, binary data is arguably essentially meaningless unless it is formatted and interpreted in some way so it can be converted into information and knowledge.

In this session, we also looked at the differences between a file-centred and document-centred view of managing data. Networked environments enable us to adopt a the latter view, in which a document can comprise of a disparate set of files – graphics, text, video and so on – which are stored in diverse locations, and linked with special tags. This enables us to make our web pages more interesting, but also manage them more efficiently; so rather than embedding large files, we simply link to them.

Word count for this entry, excluding figures and captions: 297 words.

Session 1: blogs and web 2.0

INM348 - Digital Information Technologies and Architectures
 
Our first session on the Digital Information Technologies and Architectures (DITA) module deals specifically with blogs, and touches on the concept of 'Web 2.0'. Blogs are arguably one of the most visible manifestations of this phenomena, even though it's been a full ten years since Blogger, one of the most popular blogging tools, was launched.
[URL: http://news.bbc.co.uk/1/hi/technology/8286174.stm]

This blog will be my coursework for this module. It’s organised as a series of blog posts, one per session; the posts will usually consist of a short review of the key points of our lecture, backed up with some examples. In addition I have tagged each session’s entry using the blogging tool’s labelling function; the tag I have used is ‘DITA’.

Before starting the blog, I also reviewed some of the leading blogging tools. I took a look at Blogger [URL: http://www.blogger.com/] , WordPress [URL: http://wordpress.org/] and Livejournal [URL: http://www.livejournal.com/], and, although there were some differences in ease of use and functionality offered, they all allowed me to start creating blogposts within minutes. I chose Blogger as it offered the service that, to me anyway, was the easiest to set up and manage. In addition, the functionality offered by most blogging services, that enables me to log in and edit or publish posts from any computer is extremely useful.

Blogging has proved a very flexible and useful tool for creating and managing my coursework on this module. It’s very well-suited to small digestible chunks of information like my session posts – it also allows me to hyperlink out to other information, such as my personal web space, and upload images and screenshots where necessary.

Finally, being able to rework entries after publishing them, has been very useful, as I’ve found it very useful to return to posts - sometimes several times - as I’ve learned more during this module.

Word count for this entry, : 297 words.