Front-paging online newspapers
First Monday

Front-paging online
newspapers by Ioannis Koutsaftikis, Nikolaos Nanas, and Manolis Vavalis



Abstract
Online newspapers and magazines still find it difficult to let readers discover and just read news. A plethora of stories on the front (home) page, overuse of complex grids, vast navigation lists and advertising immaturity still prevail. This paper deals with the general methodologies, the specific mechanisms and the enabling technologies associated with the design and the developing of personalized electronic front pages. Three approaches are presented and their particular implementations are discussed and evaluated.

Contents

1. Introduction
2. Background and basic concepts
3. The landscape of content presentation for the online news industry
4. Layout generation
5. Content filling mechanism
6. Synopsis and prospects

 


 

1. Introduction

Modern Internet technologies constantly change our reading habits. Already by the end of 2010 more people read the news on the Internet than from newspapers. The Internet has become a standard tool for information management and sharing as both its usage and its form have changed radically the last years. In the current Web, each terminal node (person, organization, machine) can transmit information as well, rather than just receive, in a model that has been well known as Web 2.0. It is therefore clear that the information management today has been gaining more and more importance as both the number of producers and the means of dissemination, have been increasing significantly compared to the recent past. As it is apparent, the number of information items received daily by each individual exceeds her necessity to be informed, marking the transition from the era of sub–information in that of information overload.

Although nowadays the presentation of information content is considered to be of great importance, only a few significant improvements have been undertaken in this area. For example, print media tend to place the most important article in the front page of the issue, selecting appropriate fonts, images, etc. The same model is used in presenting articles on their electronic publication which is now hosted on the Internet, and is also applied in the majority of news portals. As a result, the advantages of having the information in digital format are hardly taken into consideration.

Specifically, a story that the editor considers as important enough to be placed on the front page or home page of a Web site, does not necessarily have the same importance for each individual reader and in addition not all readers have the same informational needs. Accordingly, the presentation of information should be as personalized as possible to the specific requirements of each user.

Therefore a systematic and possibly automated method is needed capable of presenting the information content in a way that exploits the different weight of each news item for different news readers.

Today, several models of information filtering have been proposed, some of which have prototype implementations. These models are based on the creation of a user profile which is used for the evaluation of any new information so as to establish a ranked listing of news which reflects each user’s particular informational needs.

In the proposed work we attempt to design and propose a systematic methodology for developing a personalized electronic front page using some of the features of these models. A prototype of such a service has been implemented using Web 2.0 technologies and the overall performance has been evaluated in depth. Despite the fact that the rest of this paper focuses exclusively on newspapers we believe that our results can be easily adapted in other information related platforms like magazines and blogs.

The rest of this paper is organized as follows. In section 2 we present our motivation, the necessary background elements and the main associated concepts. In section 3 we concentrate on an exposition of the new and emerging, essential features of the modern newspaper industry. Our efforts towards a practical information system that handles several challenging issues involved in the editorial of a modern conventional or electronic newspaper, automating it to the proper extend are given in sections 4 and 5, with the former focusing on layout creation and the latter on content filling mechanisms used. We end up, in section 6 with a summary of our work and a discussion concerning future prospects.

 

++++++++++

2. Background and basic concepts

The rapid improvement in Internet technologies and applications in recent years have made online browsing a live enjoyable experience. Recent surveys show that most readers prefer the Internet from print media to read their news [1]. The main features of the modern Internet that have sculpted today’s electronic newspaper landscape are the following:

Collaboration. Collaboration is one of the major innovations of the so–called second edition of the World Wide Web (Web 2.0). Unlike the old, static Web pages that allowed visitors to only read the content that was created for them, a modern Web site allows users to interact and cooperate with each other both as creators and consumers of content. The most representative example of the effect of participation on the Internet is the emergence of social networks. This characteristic is very important for electronic newspapers because it has lead to much larger information volume production and plurality of opinions. Each end user is now able to generate content, to distribute it through new communicating channels with unconventional characteristics, to comment on and to search for information from many different sources. At the same time it is apparent that a reliability and importance evaluation mechanism for each source is needed. A mechanism for filtering news according to their relevance to each user’s characteristics is also required.

Real–time Web. The real–time Web is a set of technologies and practices that allow users to receive information as soon as this is published by the author rather than checking themselves or having some software that checks the source periodically for updates. Providing real–time content is a way to maintain visitors hooked, resulting in a stable readership. In large organizations it reveals transparency and reliability and is considered as a way of inspiring trust and confidence. An example of a real–time application is Twitter in which each user can monitor in real time other users’ posts. It is obvious that real–time Web has significantly influenced the current news industry where the freshness of any information object is of significant importance. In a world that is constantly changing and evolving, a daily update of print media does not seem to be enough anymore.

Interaction. One of the new technologies that gave further impetus to Web 2.0 is AJAX (Asynchronous Javascript and XML). AJAX allows Web applications to work just like desktop applications with immediate response. With AJAX the browsing experience becomes much simpler and more enjoyable. At the same time, it allows content producers to easily collect feedback from consumers having a measure of the impact of the information to the readers.

The above features of the Internet have changed the landscape of contemporary media, creating new trends in relation to traditional news. This new form of information on the Web is characterized by some new elements such as:

Citizen journalism. With the term citizen journalism, we mean the active involvement of individuals in the process of collecting, reporting, analyzing and disseminating news and events. Users who until recently were limited to the role of “reader” now have more complex roles in this new informational world. The impact of social networks in citizen journalism is surely very important. Anyone can now create and maintain his own blog, a place of discussion where news and articles are posted, reproduced and commented on. In addition members of large social networks (Facebook and especially Twitter) create a community that contributes, up to an extent, to information evaluation and promotion (retweet) and acts as a form of collaborative filtering [2]. It is therefore apparent that the vertical model of dissemination of content is currently evolving into a horizontal and a much more pluralistic model.

Statistics. The emergence of Web 2.0, with the features mentioned above, provided content producers with among other things, the ability to obtain statistics related to the impact on the final recipients. Numerous demographic data (such as age, origin, feedback, interests of readers, etc.) are now associated with each informational item. As a result, news industry companies are able to fine tune their publishing strategies. By analyzing these statistics it becomes easier to predict the importance of each publication item and to target specific promotions to particular groups.

Real–time news. The rapid spread and use of portable devices in recent years, in combination with the real–time Web, have created a new trend: the need for continuous information everywhere and always. An important piece of news can instantly reach million of receivers globally. Therefore the timeliness of information has a completely different meaning today. The daily publication of print media seems anachronistic today and big publishing houses have to adapt to these new trends in order to remain competitive.

Mobile devices. Another effect of the pervasiveness of mobile devices in everyday life is the change in the news media reading format. From the traditional paper newspapers and magazines, reading is now done in front of a computer screen, a laptop screen or a mobile device. In order to reach the widest possible audience, a publisher should be able to make sure that the news published could be read in all of these formats. There are of course many additional issues of organization, management and display of information that should nowadays be addressed.

New content types. Broadband Internet connections coupled with the ever increasing capacity of storage media and the introduction of Cloud Computing have enabled the exchange of new content types that previously would have been impossible. Almost every modern Web site utilizes the full range of available content types resulting in text content that, in many cases, is accompanied by images and embedded audio or video files. These new capabilities led the user interaction with any object to new levels and the news to become much more lively and realistic.

Personalization. Although there are many positive aspects in the new vast mechanism of rapid content production, there are also some “side effects”. Users are very soon overwhelmed by the amount of data reaching them. In the real–time Web this phenomenon is even more intense. The technology available today allows the personalization of both the content through filtering, and the presentation by visually separating important from unimportant news. It becomes apparent that future content providers should adapt to the use of techniques that will not only lead the relevant information to the appropriate reader instead of waiting for him to find it, but they will also present it in such a way that it would be easy to distinguish the important from the irrelevant information [3]. Furthermore one of the major advantages of personalization is the possible change in the pricing policy of services from the globally applied mode to a personalized one tailored to each user’s specific needs.

As it becomes clear from Table 1, despite the innovations introduced by new technologies, there is a notable feature of traditional news that is missing from electronic versions. This feature is the systematic use of typographic rules for the presentation of content.

 

Table 1: Electronic vs. traditional press. The third column contains the additional features offered by the online publishing.
 TraditionalElectronic
Publishing frequencyPeriodic (daily, weekly, ...)Real time
Dissemination modelVerticalHorizontal
StatisticsDemographic dataUsers’ feedback data
PersonalizationNoneContent & presentation
MediaPaperScreen
Pricing policyCommonCustom
Content typeText & pictureAudio, video
Content displaySpecific typographical rulesNo systematic methodology

 

The presentation of content is not a new topic. It has always been a matter of concern for editors of print media and having undergone various changes, has now matured well enough. The current format of today’s newspaper frontpage is the result of many optimization efforts and seems to be applied to the majority of printed news. Intentionally selected fonts, different header sizes, images, articles with more or less description are carefully placed in order to “guide” the reader’s attention. Current Internet seems to be much more volatile as the technologies are continuously evolving. From static Web sites with mere textual information, we have progressed to advanced Web applications that offer users a pleasant and interactive experience. All the characteristics that have been listed above justify the observed shift towards electronic news publishing. However there hasn’t been proposed a systematic methodology of content presentation such as in print media. The next section will attempt to identify some common features of content presentation methods that have been used on the Internet and list some representative examples for each category.

 

++++++++++

3. The landscape of content presentation for the online news industry

In order to identify and evaluate presentation methods that are used in electronic news you need to observe them from two different perspectives: content and layout. Content is the textual, visual or auditory information that someone may come across as part of a user’s browsing experience on a Web site. A structural key component of the presentation is page layout.

Going back to the first pages of ancient manuscripts and journals, up to modern, proper page layout design has been much debated in print media. With the widespread use of personal computers, page layout design has been transferred to electronic media. A Web page, otherwise considered as a graphical user interface, may include many interactive elements. The placement of those elements is usually called interface design and consists of a set of not only text and static images but also items of various other multimedia types like animation and video. Page layout on electronic media includes more complex procedures commonly implemented in collaboration with software engineers and specialized consultants [4]. Next we present the main axis which will allow us to categorize both content delivery and presentation as well as layout design methods:

  • Static, something that does not change over time, doesn’t update. Static Web sites commonly provide standard information in a consistent way for an extended period of time just like handing out a printed brochure to customers or clients.

— Layout: When referring to Web pages, the term static characterizes a page that is displayed to the visitor just as it is stored. In such pages the layout is predetermined, prohibiting any customization.

— Content: Consequently, a static page displays always the same information, and always in the same layout to all users. To alter the content of such site we need to either edit directly the (HTML) code of the associated page or use a WYSIWYG editor. Static content is by no means relevant to the dynamic nature of news and therefore we will not deal with it in the remainder of this paper.

  • Dynamic, something that is characterized by continuous change, activity or progress. Here the content flow is dynamic, while the layout is changing based on either the user’s interaction or the type of information to be displayed.

— Layout: A dynamic Web site is created differently for each separate view and the position of the layout elements is calculated at the beginning. In most cases the layout is created in real time based on the content to be displayed, using a particular algorithm (e.g., treemaping). Thus, they offer the capability to use a variety of different layouts to attract user’s interest.

— Content: Dynamic content is fundamental in the modern electronic news era [5]. A dynamic Web site varies with time (e.g., news content) and the visitor (e.g., user preferences). Applications in this category don’t offer the choice to specify the information sources which are typically predefined and this inability consist a serious drawback.

  • Customizable, something that may be modified to meet the needs of an individual. The term customization is used when the site only uses explicit data. A customizable Web site gives users the ability to modify both the presentation and content and to save their preferences. In most cases user registration is required.

— Layout: The user may modify the presentation of the application by choosing from predefined templates and saving his choices. Afterwards for each visit his preferences are automatically been applied.

— Content: A registered user is able to curate the content by designating RSS feeds as a source of information items or linking one or more of his social network profiles (Twitter, Facebook login) to receive their updates. Some of customizable applications use a rudimentary algorithm — which is usually based on collaborative filtering or voting features as for example the number of retweets or likes — for the evaluation of news items originated by those updates to offer a popularity ranking.

  • Personalized is something that has been created specifically for an individual. Personalization implies that the changes are based on implicit data. This category mostly contains applications that implement a filtering algorithm for evaluating the importance of each article to each reader [6].

— Layout: A personalized layout adapts item placement, positioning and size to user preferences and each layout is unique to the needs of an individual user. The layout is, in most cases, a sorted list of articles in decreasing order of importance. It seems that most such applications base their design decisions on the conjecture that the competitive advantage gained from the personalization of content they offer allows them not to emphasize on the layout presentation.

— Content: Personalization usually involves the creation of a profile containing information concerning the preferences of a particular user. This profile is continuously updated and used to filter information items so they can be ordered and presented according to the user preferences. There are two main methods for information filtering: Content–based [7] filtering and collaborative or social–based [8] filtering with the latter being the most commonly used. The former seems to promise more accuracy but it currently imposes several scalability challenges. Collaborative filtering is the process of filtering information that is based on methods which try to guess a user’s interests by correlating them to the interests of other “similar” users. Although collaborative filtering models are widely spread several issues need to be properly considered in order to avoid serious pitfalls that frequently appear with the most important being the cold start phenomenon which affects most collaborative systems and in particular those that involve freshness of items.

  • Collective, refers mainly to content and presentation adaptation so that it reflects the interests of an entire community or group of users. Applications where the selection of content and the way it is presented reflects the interests of a user group, belong to this category. Here the evaluation of news items is based on their popularity obtained through a voting system. As an alternative approach there may be created a collective profile that meets the specific interests of the community and then some filtering mechanism may be applied.

— Layout: A collective layout respectively arranges item placement, positioning and size according to group preferences and each layout is unique to the needs of the whole community. As in the previous category most of the existing applications in this category are based on a very simplistic way of presentation, usually made from a sorted list, focusing more on the relevancy of content rather than the layout.

— Content: In a collective case the evaluation of news items is based either on an associated collective profile containing the preferences of the entire group, or on a voting system in which the importance of each information item is analogous to the number of votes that it receives from the community. In collective profiling, the interests of each individual user are shaping the profile of the whole community it belongs. In voting systems, each user can participate in enhancing the popularity of the news items that considers valuable to the community by voting them. Voting systems are being used, with great success in several Web application areas, for example, deciding which movie to watch and which book to read. Nevertheless, they are quite vulnerable to reputation hacking attacks that promote specific news articles that under different circumstances would not be very popular.

The above axis allow us to easily categorize all possible e–news layout configurations and content presentations. As we can note in Table 2 at the time, there are no examples of applications with personalized or collective layout. This is an absence we will try to satisfy by implementing a prototype with personalized content and layout. In the next section we will try to make a review of the most representative examples of each combination shown in Table 2 and will describe their most important characteristics moving from bottom to top in the layout axis and from left to right in the content axis.

 

Table 2: The electronic front page landscape.
Layout — ContentDynamicCustomizable PersonalizedCollective
CustomizableNew York TimesNetvibes, iGoogleKrakatoa 
DynamicNewsmapFlipboard Zite 
StaticWeb CMSPaper.li, Pulse, SummifyMy6SenseDig, Reditt, Observatory

 

Web sites with dynamic content which need to be updated frequently, presumably in a collaborative manner, are usually constructed using a Web application of particular type commonly known as a Content Management System (CMS). Most of the modern CMSs use themes for the presentation of their content. Modifications on the site’s existing theme is usually done only by the Administrator in a non–automated and often tedious and time consuming way. Finally, the presentation is identical for all articles of the Web site and after a short time it becomes boring with the effect of a gradual reduction in a reader’s interest. This is the category where most of today’s blogs belong.

Summify [9] is a Web application that displays summaries of popular news being discussed in a user’s social networks (Twitter, Facebook). Paper.li [10] follows the same philosophy, except that it uses as the sole source of news, those of a user’s Twitter timeline. In this case the top articles are selected based on the number of retweets, while the layout is trying to emulate the style of a newspaper front page. Pulse [11] is a similar application for smart mobile devices. The user can determine the sources by choosing his favorite social networks or adding RSS feeds, using a friendly management environment. To present the news Pulse uses a layout divided into vertical “regions” containing news in tile format and in chronological order.

My6Sense [12] is an application for smart mobile devices that provides content relevant to the interests of the user. It creates a user profile (called Digital Intuition) and feeds it with new data every time he interacts with a news item. The content of every new article is compared against the user’s profile to provide an importance ranking. Furthermore, the user is able to define her own information sources which may be social networks updates, RSS feeds or a particular API. The layout is a sorted list that includes the title, the source name and a related small image.

Digg [13] is a content aggregator that brings out the best news, as voted by the community. It is essentially a voting system which promotes and displays the most remarkable of the community news, using a mix of criteria such as the number of votes (Diggs), the timeliness (freshness) of news, the number of comments and a user’s profile that logs the votes. The layout in this case consists of an ordered list of articles, which shows the title, part of the original content and possibly images. Reddit [14] is another “democratic” platform to promote news that the community considers important. It is based on a voting system with similar characteristics to Digg, while the layout consists of a simple, sorted list. The Regional Innovation Observatory of Thessaly (Nanas, et al., 2010b) is a prototype Web application capable of collecting and displaying news relevant to various areas of interest regarding the industry in the region of Thessaly, Greece. For each of the considered thematic areas, a different collective profile has been created and is maintained (fed with users’ feedback) with the help of the Nootropia (Nanas, et al., 2010a) model which also evaluates all incoming news based on their content (content based filtering). As previously, this results in a ranked listing of news. For the presentation, each area of interest is represented by a different widget, in which the list described above is being displayed.

Newsmap [15] visualizes the constantly changing landscape of news through Google News aggregator which automatically collects and aggregates news with similar content. Newsmap uses a treemap (Bederson, et al., 2002) visualization algorithm to depict the very large information volume gathered by the aggregator and the interactions that occur in a dynamic and constantly changing layout, where the placement of each news item and the total area that it will cover depends on the number of sources that reproduce it. Treemap algorithms are usually used to visualize large amounts of data. Although this approach gives a nice visual overview of what is important, it is unfortunately not suitable for actual reading, and does not comply with already established design and publishing rules.

Flipboard [16] is one of the most popular electronic magazine for mobile devices. It is important to mention here, that the term personalized used by the Flipboard’s developers, refers to the fact that the user may specify his own news sources, adding social network profiles and RSS Feeds, and surely is not in accordance with the definition of personalization we provided earlier. In other words, the personalization related to Flipboard is closer to our definition of customizable and not of personalized. The most important innovation of Flipboard that makes it so special and popular is undoubtedly its presentation. The whole application gives the user the feeling that he is browsing through a well–designed, modern magazine which makes reading a very convenient and pleasant experience. To achieve this, Flipboard uses a set of predefined page templates, designed following established typographical rules. To display the current page it randomly selects one of these templates. The dynamic flow of news items from user–defined sources, in conjunction with the diversity of the layout retain user’s interest undiminished and transfers the conventional reading practise with which the reader is already familiar, to the electronic world.

Zite [17] (for iPad and TouchPad) belongs to the category of personalized magazines, following, unlike Flipboard, our definition of personalization. The user may choose between topics of news that interest him or connect his social network profile (Twitter) to receive updates. Each time the user interacts with an article, Zite uses this interaction to update the profile accordingly, so after some “training” time, the news displayed is to a great extent related to user’s interests. So, unlike Flipboard, application content is personalized. For the presentation, although the user can not choose the layout, Zite has some predefined templates from which one is randomly selected for each particular page. This choice however is not based on the importance of each article for the reader. Unlike Zite, one of the approaches that we will propose in the next section specifically takes advantage of the personalized ranking of information items to choose the best layout that corresponds to it.

The Chrome browser implementation of the New York Times [18] is the modern electronic version of the famous newspaper. It does not allow us to specify different sources of information (obviously all the news come from the New York Times) but we may customize the presentation through a series of available templates and perhaps save it for future visits. The templates have been created deliberately in a way that is very close to the aesthetics of a real newspaper so the whole experience of reading the news online replaces with great success the conventional reading through the printed version.

Netvibes [19] is an innovative platform that belongs to the so–called personalized homepages (although the term personalized here also refers to customization) and epitomizes the definition of the word configurable. It uses widgets, which serve as placeholders that the user can drag and drop exactly where he prefers within the page to meet his own needs. A source of dynamic content (RSS feed) can be added to each of these widgets. There are also preformatted widgets where the user may connect his social networks, receive e–mail messages, or display other information such as maps, weather, etc. Furthermore, the application of one of the available themes can substantially change the whole aesthetic of the page. iGoogle [20] is a platform similar to Netvibes. Their differences are mainly aesthetic. Although personalized homepages is a great overview tool, the fact that they are over own by information that should be placed in a small widget, makes them unsuitable for news reading which presumably reflects their decline on user interest that has been lately noticed.

The Krakatoa Chronicle (Kamba, et al., 1995) is an interactive and personalized online newspaper. It is a prototype research application that was proposed and implemented in 1995 in Java. Despite the lack of today’s Internet technologies, the Krakatoa Chronicle has been an impressively innovative project for its time. Unfortunately, we are unaware of any similar production implementations that take proper advantage of today’s new and emerging Web technologies. The content is dynamically aggregated from the Internet and user’s feedback is utilized to personalize it, so each story is assigned a score. The layout of the application which tries to emulate the feeling of a newspaper is very interactive and is determined almost entirely by user settings which include changing indicators that define how the score of an article affects the size of the area devoted to it inside a page and how many articles will appear in any particular page.

Table 3 provides a summary of the above described presentation methods used in modern news systems, while Table 2 contains the classification of the particular related applications reported above. We should note here that to the best of our knowledge there are currently no applications offering a personalized or collective layout.

 

Table 3: Summarizing the characteristics for various layout case.
 Content
staticdynamiccustomizable personalizedcollective
Static layoutAdvantageEasy to develop & host
  • Any page is manageable but requires specific knowledge
  • No connection to database is required
Easy content management
  • Ability for frequent updates
  • No coding is required
May identify, store and utilize user’s preferences
  • Source code editing of content is required
  • News may be viewed hierarchically
Content is directly relevant to the user’s interests
  • Keep reader’s interest undiminished
News relevant to group’s interests
  • No registration is required
DisadvantageLong run maybe costly, and accordingly the frequency of updates & hosting
  • Often difficult to manage
  • Difficult to keep consistent and up–to–date
They feel that they are built according to a CMS
  • The customization of look and functionality of a CMS may be expensive
  • The visitor influences the way you view articles
No registration is required
  • Not possible to change the display mode, regardless the configuration of information sources
The static layout soon becomes monotonous and boringMonotonous layout
Dynamic layoutAdvantage Variety show options
  • Effective interaction with the application
Determination of sources of information from the user
  • Ability to save settings
  • Diversity on display
Personalised content
  • Dynamic change in the presentation
  • They keep the reader’s interest
 
Disadvantage Impossible to define the sources of information from the user
  • Automatic layout determination
Weakness personalizationNot fully exploit the personalization of content for customizing the appearance 
Customizable layoutAdvantage Select the way of presentation
  • Dynamic content update
Select the way of presentation
  • Possibility of determining the sources of information
Full control of presentation
  • Individualized, hierarchical view according to user’s interests
  • Keep reader’s interest
 
Disadvantage User cannot define the sources of information
  • Requires registration
Requires registration  

 

 

++++++++++

4. Layout generation

From the methods reported in the previous section which are a representative sample of the current situation in modern news industry, one can easily draw some useful conclusions: The presentation can be static, dynamic or customizable, whereas when we refer to dynamic content sources all presentation methods can be eligible. Out of the applications presented, only a few of them have the ability to personalize content so that it meets the always changing user interests. Additionally, almost none of them benefits from this fact to change the way content is presented. Assuming therefore that there is a content personalization method available, we should derive a way that will lead us to a layout that effectively depicts the special importance of each article. In particular we should assist the reader to percieve at a glance the importance of each article while at the same time we maintain page readability and also benefit from all the advantages of available modern electronic media. In accordance to the above lines our main objective is to design and implement a personalized and adaptive front page. As expected, the differences between the printed and electronic media, have resulted in different approaches regarding the optimization of methods of presenting the news. The advantages of electronic media are being reported extensively in section 2. However, any attempt to create an advanced, personalized and adaptive electronic front page should not ignore the pre–existing and well established techniques used in print media. It should be based on an optimally balanced approach that combines the benefits of both emerging electronic and traditional printed news eras. Given the existence of a personalization mechanism, the attempts that have been made mainly focus on the following three areas covering the full range of available options:

  • Adaptive layout
  • Fully dynamic layout
  • Templates layout

4.1. Basic procedures and principles

We consider the implementation of an electronic front page to be to a large extent a dynamic process that requires continuous optimization through trial–and–error. In practice a developer realizes that he has to face many tradoffs and engineering problems, which come mainly from the lack of available technical tools. Each one of the three prototypes that we have implemented here for this study is following a completely different philosophy, not only algorithmically but also in terms of aesthetics and ease of implementation. It is based on the experience gained and the lessons learned from the implementation of the previous one improving it in many respects (algorithmically, aesthetically, etc.). However, this prototype evolution inevitably introduced additional restrictions which nevertheless were reasonable and not very demanding.

We denote by N the number of articles variable that will be displayed on our front page. This number should be carefully selected. If it is too large, then the description for several (if not all) articles will be so short making very difficult for the reader to recognize its relevance and importance. If it is too small then we might be unable to cover the entire spectrum of news that reflect the reader’s interests. Modern newspapers usually display 8–12 articles on their front page. Extensive trial–and–error experimentation with all three prototypes developed, clearly revealed that N is very fundamental parameter whose value needs to be carefully selected since it greatly affects the further development.

Established writing direction in the Western world is from left to right and from top to bottom. This greatly affects the way we read and therefore consists an important issue that should be considered. Thus, the reader’s attention is initially focused on the upper left area of a page and is transferred towards right and bottom parts of it [21].

This factor is quite important and should be seriously considered by an electronic front page that wants to drive user’s attention to articles that are really interesting to him. This is a convention that most real newspaper front pages are following. When a two–column layout is adopted, important news are typically placed at the upper left part of the page while in a three–column layout, important news are placed at the top and center part. In our implementations, we are placing articles moving in the left–to–right and then top–to–bottom placement as the article’s score becomes smaller.

It is well known that in electronic media, the space available for articles appears to be theoretically infinite through horizontal and, or vertical scrolling. Scrolling is also an important issue. It is examined in detail in Braganza, et al. (2009). Nevertheless, it is widely accepted that important information should be placed so as to avoid scrolling. This is a feature that is rarely used by users [22]. We will not further consider scrolling in this paper since it seems to be orthogonal to our study. Since the articles to be displayed on the front page are only the most important ones, we decided to use a finite display area, defined by the size of the browser window without the need to scroll. This is a restriction that is also applied also to print media, as the placement area in front page is as big as the page size and all the major events should be displayed there.

In the front page of a real newspaper different font sizes are used in article titles to visually highlight the important news and guide the flow of reader’s attention. Our prototypes also try to follow this convention by reducing the font size as we move from articles with high to articles with lower score.

4.2. Adaptive layout

Our first attempt to create an electronic front page which takes into account the importance of each article for the reader, adopts an adaptive layout. It is based on the following philosophy. Given a specific layout, there should be some mechanism to modify it in such a way that meets certain predefined requirements. This layout should be modified in a away that retains its original characteristics and by all means its ability to display the articles in order of importance defined by their scores. We achieve such modification by dynamically adapting the boundaries of the areas of an initial predefined layout. The process of creating the layout includes the creation of initial areas (that would be used as placeholders) within a layout, the definition of dynamic zones and the placement of articles inside them. The initial areas of the layout can be defined in an HTML file (as empty div elements), while for the creation of the dynamic zones and the article placement, Javascript is used. This approach assumes that the arrangement of articles inside the original areas is known in advance. Once the number of front page articles is selected, the creation process follows as described below:

  1. Choose an initial area for placement.

  2. Choose the next N out of the total number of articles (sorted by score) in order to be placed in this area.

  3. Create zones for placement within the area as follows:

  4. For each zone, calculate the weighted average    formula
    of the score of X articles that are to be placed in this, where N is the total number of articles to be placed in the area.

  5. Place a zone within an area (order of placement is always from top to bottom, when the zone is horizontal and from left to right, if it is vertical). The height HZ (in the case of horizontal zone) or the width WZ (in the vertical case) are set equal to    formula

  6. Article placement:

  7. In case of horizontal placement, calculate the height Hi as the weighted score versus the total score of Z articles to be placed in the same horizontal zone, that is    formula

  8. In case of vertical placement, calculate the width Wi as the weighted score versus the total score of Z articles to be placed in the same vertical zone, that is    formula

To further understand the above process we have in Figure 1 highlighted with colors the zones and with blue the original areas. The layout therefore consists of two initial areas, the main and right column, as defined in the HMTL file with the following lines of code:

<div id=“right column”></div>
<div id=“main column”></div>

 

Layout with areas and zones
Figure 1: The Layout with areas and zones.

 

The creation of zones and the placement of stories is done by the Javascript function placeItems with the following signature:

placeItems (xml, position_start , position_stop , range_start , range_stop , dim , dim_size , container , transparent ,
name)

whose parameters are as follows:

xml: The XML code that contains the list of articles

position_start : The i–th article that will be used first

:

position_end: The i–th article that will be used last. When position_start == position_end we have article placement, and when position_end > position_start, a new zone that includes position_end — position_start articles is defined.

range_start: The i–th article, from where we begin to calculate the sum of the score,

range_end: The i–th article, which will complete the calculation of the sum of the score,

dim: Determines placement direction and take two values, ‘height’ for vertical placement and ‘width’ for horizontal

dim_size: The dimension (in pixels) of the area of placement. If dim == ‘height’ (vertical placement) then it refers to hight, while if dim == ‘width’ (horizontal placement), it refers to width

container: The id of the DOM element of the zone or area of placement.

transparent: ‘true’, when we want to slice a new zone and ‘false’ when we are placing an article

name: The name of the DOM element id of the created zone (in case of article placing it may be omitted)

An example on defining zones and placing articles is given in Listing 1:

1

  

placeItems (xml, 0,0,0,7, “height”, HEIGHT, “#container #main column” , true , “top”) #;

2

  

placeItems (xml, 1,3,0,7, “height”, HEIGHT, “#container_#main column” , true , “middle”) ;

3

  

placeItems (xml, 4,7,0,7, “height”, HEIGHT, “#container_#main column” , true , “bottom”) ;

4

  

placeItems (xml, 0,0,0,7, “height”, HEIGHT, “#container_#main column_#_top” , false );

5

  

placeItems (xml, 1,1,1,3, “width”, MAIN_WIDTH, “#container_#main column #_middle” , false );

6

  

placeItems (xml, 2,2,1,3, “width”, MAIN_WIDTH, “#container_#main column_#_middle” , false );

7

  

placeItems (xml, 3,3,1,3, “width”, MAIN_WIDTH, “#container_#main column_#_middle” , false );

 
Listing 1: Javascript code for defining zones (lines 1–3), and placing one article in red zone and 3 in the green zone (line 4 and 5–7 respectively).

Findings and observations

In the above described approach little attention has been devoted to the aesthetics of the presentation. We focused on the placement of articles so that their layout is representative of their importance to the user. It can easily be seen that the placing mechanism that we used is quite flexible in terms of number of displayed articles. This is due to the fact that the specification of the different number of zones and areas in the layout is easy. However, the implementation requires knowledge in Javascript and deep understanding of specifics of the method. This difficulty makes it quite complicated to create many different and complex layouts and this lack of variety in presentation can make the frontpage rather dull.

Another issue that must be addressed is the practice that should be followed if the distribution of scores of articles are quite uneven so some of them have very low rating (and hence minimum display area) compared to the rest. Finally, the frontpage is far enough from qualifying as attractive as the zones and areas correspond to the final score of each article and thus are indicative of its importance to the reader, but this uncertainty of the final result, in most cases is inconsistent with known and established rules of typography (e.g., golden rule proportions).

4.3. Dynamic layout

The above identified inability to differentiate the appearance of a front page led us to a completely different approach. This new implementation is based on a variant of Treemap visualization algorithm, the Squarified Treemap (Bruls, et al., 2000) and is similar to those used in (among others) http://newsmap.jp.

As usually, we must first decide on the number N of the articles that will be displayed and normalize the scores of N articles so that the weighted score is assigned to each of them    formula

The algorithm distinguishes the articles in three groups, those already placed, those ready to be placed and the unplaced ones. So for a given region of a given height and width, with aspect ratio    formula

The squarified treemap algorithm includes the following steps [23]:

  1. If the area to fill has ar > 1, then placement direction would be vertical, knowing the height and seeking the appropriate width of the area that we will subdivide. Otherwise, we will move horizontally knowing the width and specifying the height.

  2. Repeat steps 3 through 7 until you place all articles.

  3. Take the next article that has not been placed and move it to the group with the ones ready to be placed.

  4. Take the next article that has not been placed and move it to the group with the ones ready to be placed.

  5. Compute the dimensions of the subdivision as follows:    formula or    formula

  6. Calculate the height or width of each article that is about to be placed by allocating an area equal to its weighted score:    formula or    formula

  7. Find the article with the smaller area to be assigned (the last one that was added to the list of articles to be placed if the original list of articles is descending sorted by score). Calculate the aspect ratio (ari) as    formula or    formula depending on the direction of placement.

  8. If ari calculated is bigger than that of the previous iteration, then we move the last of the articles that are to be placed to the unplaced ones, place the rest to be placed with the dimensions calculated from the previous iteration and go to Step 1. Otherwise, go to Step 3.

A screenshot of the result of applying this algorithm to a specific front page along with the order of articles’ placement is presented in Figure 2.

 

Layout created with squarified treemaps
Figure 2: Layout created with squarified treemaps.

 

Findings and observations

The fully dynamic layout that we have proposed has certainly more diversity than the static one described in the previous section. Moreover it doesn’t exclude the less important news giving them areas that accurately represent their importance score. Another advantage is that the number of articles can be easily changed without significant modifications to the model. However, although the mechanism applied can result in quite different front pages there still remain some major problems. Because in the current approach the creation of the front page is dynamic, it is impossible to easily meet established typography rules. Moreover due to the nature of the algorithm (horizontal and vertical placement) generated layout patterns always have a specific form that doesn’t leave the reader with the pleasant and familiar taste of transitional newspaper’s front page. Finally, it fails to place the really important articles in areas of “high interest”, such as described above, so news with great score are often placed at the bottom of the page.

4.4. Templates layout

We proceed to our third approach which is largely based on the lessons learned and the experience gained from the two approaches described above. Specifically, we realized that the adaptive layout was not suitable for a personalized front page as it was quite complicated to create. It is also quite static to fulfil the needs of a dynamic application like the one considered in our study. On the other hand, the fully dynamic front page, although it can alter its presentation, it is not following established rules of typography.This results in several undesirable side effects as those already identified above and will be further discussed below.

Our new front page should have the ability to significantly vary its presentation following a given, possibly ever–changing distribution of article scores. It should also be modified and extended easily in a simple and practical way that does not require special skills like knowledge of an advanced programming language. Furthermore, we should follow, as close as possible, certain desirable established and widely spread rules and common practices of print media. The philosophy applied should be to a great extend similar to the one used to create the front page of a conventional newspaper. The cover of a newspaper is designed in such a way as to “attract” potential buyers in reading the articles it contains. The front page also provides the most important and fresh articles followed by images. Moreover, since it is the “showcase” of the newspaper, it has to display a couple of paragraphs of description while the main text of the article can be found in the internal pages.

Following the above rules, the newspaper editor creates a front page that corresponds to the flow of the day’s news. A day without a main incident results in a front page without a main editorial to stand out but to a front page with many less important news that occupy about the same area. Groundbreaking events will lead to a front page where two or three articles stand out with bigger headlines, and an increased area followed by other news in smaller headlines [24]. The model proposed here is similar to the one presented in Schrier, et al. (2008).

To benefit from this practice, the creation mechanism makes use of predefined templates. This provides some important advantages over the previous methods. Specifically,

  • The creation of, unlimited in theory, different templates gives the necessary diversity in front page presentation.

  • The utilization of the different templates gives us the ability of starting with a reasonably acceptable basis to follow practices that result in a beautiful aesthetic result.

  • Since we settle on a specific way to define a template, the development and expansion is rather straight forward.

  • There is a clear separation between content and presentation. The only requirement is to devise a mechanism to “fill” with content the areas that the template defines.

  • It is possible to define either a single style for all the application templates or a separate one for each of them.

Along the above lines we propose the development of a model consisting of simple HMTL code that defines the regions of article placement. An example of a template is given in Listing 2, while the definition of the associated CSS stylesheet is given in Listing 3.

 

1

   

<div class=“left column”>

2

  

   <div class=“article” id=“article4” style=“height:33%;”> article4</div>

3

  

   <div class=“article” id=“article6” style=“height:67%;”> article6</div>

4

  

</div>

5

 

6

  

<div class=“right column”>

7

  

   <div class=“article” id=“article7” style=“height:67%;”> article7</div>

8

  

   <div class=“article” id=“article8” style=“height:33%;”> article8</div>

9

  

</div>

10

   

11

  

<div class=“center column”>

12

 

13

  

<div class=“top row”>

14

  

   <div class=“article” id=“article1” style=“width:100%; height:67%;”> article1</div>

15

  

   <div class=“article” id=“article2” style=“width:100%; height:33%;”> article2</div>

16

  

</div>

17

 

18

  

<div class=“bottom row”>

19

  

   <div class=“article” id=“article3” style=“width:67%;height:100%;float:right;”> article3</div>

20

  

   <div class=“article” id=“article5” style=“width:33%;height:100%;float:left;”> article5</div>

21

  

</div>

22

 

23

  

</div>

 
Listing 2: HTML example for a specific template.

 

 

1

  

<style>

2

  

   . center column { width: 70%; float: left

3

  

   . center column . top row { height : 67%;}

4

  

   . center column . bottom row { height : 33%;}

5

  

   . left column { width: 15%; float: left; }

6

  

   . right column { width: 15%; float : right ; }

7

  

   . article { overflow–y : hidden ; }

8

  

 
# article1 . image img {height : auto !important;}

9

  

</style>

 
Listing 3: CSS code for a specific template.

 

As it can easily be seen, the only requirement for using HTML as a template, is to define the areas as div elements with class = “article”, article arrangement, the assignment of increasing number id i as id = “articlei” and the calculation of relative (percentage in this case) dimensions. Therefore, the template above includes areas for the placement of eight articles. The layout defined by this template is shown in Figure 3.

 

Layout created with a template based on listing 2 and 3
Figure 3: Layout created with a template based on listing 2 and 3.

 

So far we have described the process of creating and filling a template that can be used as an electronic front page. There is nothing personalized and adaptive to it. What is needed is a mechanism for choosing an appropriate template according to the distribution of article scores. As previously mentioned, the creator of a pattern can define the placement order of articles within areas using ids. In that way he indirectly defines the “comparative importance” of each area in this template. Since each template has information about the relative dimensions of each area, it is possible to produce a vector of the surface in square pixels of the front page’s areas. This vector can then be compared with the vector of normalized score of the top N articles to extract a value that indicates the “distance” between the two vectors. One way to compare two vectors dj, dk is the cosine similarity which is defined as:    formula

So for the front page layout, once we have chosen the template with the highest similarity, we deploy the mechanism of content filling for each of the articles presented in order of decreasing score. Through this process we ensure that the selected template meets in the best possible way the distribution of scores, just like a newspaper front page corresponds to news flow.

Findings and observations

We summarize our findings in this section with the following observations and conclusions. With Templates Layout we have attempted to combine the advantages of both worlds, the diversity of dynamic template selection and the aesthetic beauty of the static front page creation. The final result is quite close to a conventional newspaper front page, in many respects and in particular with respect to the effective visual identification of the most interesting news in a readable and pleasant manner. Our method seems to be restrictive on the initial number of articles displayed. Any change on this number would inevitably lead to the creation of a new series of templates, as the score vectors and sizes of the areas vectors defined in each template should always be of the same dimensions in order to use the cosine similarity. This rather technical issue can be resolved by creating/selecting an alternative method for calculating the distance between two vectors or, even better, to use a non–vector based similarity measure.

However, despite these limitations the templates layout method is quite extensible because it easily allows the creation of a new template, flexible, because it allows the creator to define areas of interest and aesthetically beautiful, because it can be designed in a way that follows established printing rules.

 

++++++++++

5. Content filling mechanism

In all of the prototypes that are proposed in this work, we use “Nootropia”, a model for adaptive information filtering, to personalize the content. In summary, Nootropia creates a user profile that consists of a network of features that represents his interests. A feature can be any descriptive element that can be extracted or been attributed to an information item describing its content or usage. In the case of textual content features, these correspond to words extracted from text. This network of features which constitutes a user profile, self–organizes in response to user feedback (direct or indirect) and thus adapts over time to the user’s changing interests. The profile is used to assess the relevance of an information item to the user’s interests. Nootropia is a general purpose model capable of calculating the relevance of an information item based not only on its content, but also according to the overlap in user interests, in a collaborative filtering manner. It can be used to capture the interest of a single reader or an entire group of users [25]. It should be noted at this point that instead of Nootropia we could use any other alternative method for assigning a scoring indicator in any article or news item, for example the number of retweets or likes, etc.

5.1. Basic procedures and principles

Before proceeding further, we should devise a standard that defines the representation of the information object (news article) that we will use. For this representation we have chosen the XML language. The only requirement of our prototype is an XML file that contains specific information using the following syntax:

 

1

  

<item> % Defines an information item

2

  

< title> ... </title>

3

  

< link> ... </link>

4

  

<rss title> ... </rss title>

5

  

    <description> ... </description>

6

  

    <score> ... </score>

7

  

    <pubDate> ... </pubDate>

8

  

</item>

 
Listing 4: XML code that represents a news item.

 

As one can easily distinguish, the above is the basic format of an RSS feed with the addition of the score tag.

All prototype implementations utilize Nootropia as the personalization mechanism which assigns scores to information objects based on the user interests and returns an XML list of articles sorted by importance, using the data structure described in Listing 4.

5.2. The evolution of the mechanism

In the front page of a real newspaper different font sizes are used for articles to visually highlight the important news and guide the flow of reader’s attention. The cover of a newspaper is designed in such a way as to “attract” potential buyers in reading the articles it contains. The front page also provides the most important and fresh articles followed by images. Moreover, since it is the “showcase” of the newspaper, it has to display one or two paragraphs of description with the main text of the article included to internal pages.

In our first two approaches we also tried to follow this convention by reducing the font size as we move from articles with high to articles with lower score. We noted that the reduction to the font size of the description apart from the title of the articles is not good practice because it reduces readability. This is a practice followed by newspapers, which although variably increasing or reducing title font size, they keep description font size intact.

Other conclusions drawn from our first two implementations are:

  • When we refer to dynamic content, an unpredictable factor is the size of text in article description. Having precaculated specific display area for each article, too little text makes the area to show “empty”, while if the description is longer than necessary, it may be “cut” at an undetermined position. The problem of showing just as much description text as it fits in the display area of the article is one of the most important issues to be addressed. However, since a fixed size font is chosen, between too little text and too much of it the latter is certainly preferable. Formatting of primarily textual documents including both micro– and macro–typographic concern is dealt in detail in Hurst, et al. (2009).

  • Another important issue has to do with the images. If we refer to dynamic article images, we will soon have to face two questions: Distortion of the aspect ratio of the image so that it fits perfectly to the dimensions of its display area or croping when a dimension is larger than the area? How should we act if the image is smaller than the viewing area?

We found out that in our third approach we had to devise a mechanism that takes into consideration the above findings and fills with content the areas specified by the layout. In order to create such a mechanism we used Javascript language and AJAX. Some of the problems that we spotted in previous implementations were related to the dynamic nature of content, including text adequency and display of images with unspecified dimensions. In order to overcome them, we had to make some conventions:

  • We assumed that there is a lot of available text in the description of each article;

  • that there are portrait and landscape images for each article; and,

  • that the orientation of each photo (landscape or portrait) is known in advance.

For content filling our mechanism uses the aspect ratio (width/height) of each area and treats it differently if it is more or less than one. Areas with aspect ratio <1 have a greater height than width and the placement of portrait images inside them would leave room for very thin text columns with several line-breaks. So in those areas we chose to place landscape images. For other areas with aspect ratio >1 that have greater width than height, the placement of landscape images would leave room for only a few lines of description. In this case we chose portrait images. The display of images so that not cropping or distortion happens requires code on the server that implements this task. Because we want our solution to be easily applicable and transportable, and therefore to reside on the client side, although we couldn’t fully resolve the problem, we managed to satisfactory maintain the main content of the displayed images, using the imgCenterPlugin for jQuery (a Javascript library) that assumes that the important information of an image is closer to center than the edges. Furthermore, articles with very small width were chosen to be displayed without any images so that there is room to place a short article description. For article descriptions we used a single font size and we tried to calculate the amount of text displayed by using empirical rules that take into account the font size and the aspect ratio of the article’s placement area. Finally, for title font size, the score of each article was taken into consideration, with articles having greater score having larger headers also. Using the mechanism described, we can place any article within an area as shown in Figure 4 that depicts a template filled with content.

 

Template filled with content
Figure 4: Template (as shown in Figure 3) filled with content.

 

Observations — Conclusions

The final result is quite close to an actual newspaper front page. To achieve this we have adopted several minor assumptions. We assumed that there is enough text to display in the description of each article and that the existing images are in a format that we can easily manage. The latter assumption seems to be unrealistic given the current and dynamic content on the Internet. Finally, it is worth to mention that it is expected that the emerging standardization of dynamic content creation on the Internet will specify in detail, among others, attributes of each information object (image size, text size, etc.) and also some functionality. This standardization would provide information on the number of characters that could be placed in an HTML page DOM element, leading to additional flexibility and effectiveness in future electronic front page mechanisms.

 

++++++++++

6. Synopsis and prospects

The evolution of the Internet and Web technologies is surely influencing modern mass media. Mass media needs to take advantage of Web 2.0, combining the advantages of electronic reality with elements of traditional print media. In this paper, we provided a review of a large set of online content presentation methods. Specifically we identified most of the existing such methods, analyzed their characteristics and highlighted the advantages and disadvantages for each, categorizing them according to their crucial features. In this context we have developed three different models: the adaptive, the fully dynamic and the templates layout. The conclusions drawn from an analysis of the first two revealed that full automation of the processes commonly leads to aesthetically unacceptable digital front pages. We utilized this analysis in our third approach which led to an electronic front page prototype, quite close to the philosophy and the presentation of a real newspaper front page with the additional benefits of Web 2.0. There surely exist some crucial issues that we did not consider in this study, which is part of an on–going effort and by no means offering a complete operational solution. Deciding about effective advertising placement, dividing the front page into thematic areas, reactiveness to screen size and resolution are just a few considerations. Nevertheless, we have sufficient evidence to claim that our approach can be extended to deal with issues. Such extensions are beyond the scope of this study. The lack of standardization in the creation and dissemination of dynamic content as well as some of current technical limitations prevent further optimization of the models considered. It is expected that with the rapid development of related technologies and overall research efforts, these limitations will be overcome, making the proposed mechanism widely useful. Therefore, we plan to further address the technical and conceptual issues raised in this paper and proceed to an extensive and systematic evaluation of our model. We envision the evolution of our prototype model into an operational practical platform for creating the next generation of digital front pages for mass media that recognizes and utilizes the interests of readers. End of
article

 

About the authors

Ioannis Koutsaftikis a researcher associated with the Centre for Research and Technology Thessaly (CE.RE.TE.TH) in Volos, Greece. This paper contains material from his Master’s thesis at the University of Thessaly.
Web: http://www.linkedin.com/in/ ikoutsaf
E–mail: ikoutsaf [at] cereteth [dot] gr

Dr. Nikolaos Nanas is a research fellow at the Centre for Research and Technology Thessaly (CE.RE.TE.TH), an associate lecturer at the University of Thessaly and a visiting research fellow at the Computing Department of the Open Univeristy (U.K.). He studied civil engineering at the Aristotle University of Thessaloniki (Greece). He received his M.S. degree in Intelligent Systems from the University of Sussex (U.K.) and his Ph.D. in Artificial Intelligence from the Knowledge Media Institute of the Open University (U.K.). His research work lies in the areas of biologically inspired computing, adaptive information filtering, and statistical natural language processing.
Web: http://lisys.cereteth.gr/nanas/
E–mail: n [dot] nanas [at] cereteth [dot] gr

Manolis Vavalis is Professor of Computer and Communication Engineering at the University of Thessaly in Volos, Greece.
Web: http://mav.inf.uth.gr/
E–mail: mav [at] uth [dot] gr

 

Notes

1. http://mashable.com/2011/03/15/ online-versus-newspaper-news/.

2. http:// www.invokemedia.com/whats-the-value-of-a-retweet.

3. http://www.smashingmagazine.com/2011/04/28/real- time-data-and-a-more-personalized-web.

4. http://en.wikipedia.org/ wiki/Page_layout.

5. 5http://en. wikipedia.org/wiki/Dynamic_web_page.

6. http://en.wikipedia. org/wiki/Personalization.

7. 7http://en. wikipedia.org/wiki/Content_filtering.

8. http://en.wikipedia.org/wiki/Collaborative_ filtering.

9. http://www.summify.com.

10. http://paper.li.

11. http://www.pulse.me.

12. http://www.my6sense.com/.

13. http://digg.com/.

14. http://www.reddit.com/.

15. http://newsmap.jp.

16. http://flipboard.com.

17. http://www.zite.com.

18. http://www.nytimes.com/chrome.

19. http://www.netvibes.com.

20. http://www.google.com/ig.

21. http://www.vanseodesign.com/web-design/ 3-design-layouts.

22. http://www.useit.com/alertbox/scrolling-attention. html.

23. The squarified treemap algorithm is described in details together with an example at http://www. codeproject.com/KB/recipes/treemaps.aspx.

24. 24http://www.brighthub.com/multimedia/publishing/ articles/81273.aspx.

25. http://www.lisys.gr/nanas/ ?page_id=249.

 

References

B.B. Bederson, B. Shneiderman, and M. Wattenberg, 2002. “Ordered and quantum treemaps: Making effective use of 2d space to display hierarchies,” ACM Transactions on Graphics, volume 21, number 4, pp. 833–854.http://dx.doi.org/10.1145/571647.571649

C. Braganza, K. Marriott, P. Moulder, M. Wybrow, and T. Dwyer, 2009. “Scrolling behaviour with single– and multi–column layout,” WWW ’09: Proceedings of the 18th International Conference on World Wide Web, pp. 831–840, and at http://www. www2009.org/proceedings/pdf/p831.pdf, accessed 29 January 2013.

D. Bruls, C. Huizing, and J. van Wijk, 2000. “Squarified treemaps,” In: W. de Leeuw and R. van Liere (editors). Data Visualization 2000: Proceedings of the Joint Eurographics and IEEE TCVG Symposium on Visualization. Vienna: Springer, pp. 33–42.

N. Hurst, W. Li, and K. Marriott, 2009. “Review of automatic document formatting,” DocEng ’09: Proceedings of the 9th ACM symposium on document engineering, pp. 99–108, and at http://www.wilmotli. com/pubs/hurst09adf.pdf, accessed 29 January 2013.

T. Kamba, K. Bharat, and M.C. Albers, 1995. “The Krakatoa Chronicle — An interactive, personalized, newspaper on the Web,” Proceedings of the Fourth International World Wide Web Conference, pp. 159–170, and at http://www.w3.org/ Conferences/WWW4/Papers/93/, accessed 29 January 2013.

N. Nanas, M. Vavalis, and E. Houstis, 2010a. “Personalised news and scientific literature aggregation,” Information Processing and Management, volume 46, number 3, pp. 268–283.http://dx.doi.org/10.1016/j.ipm.2009.07.005

N. Nanas, M. Vavalis, E. Houstis, L. Kelis, and I. Koutsaftikis, 2010b. “Collective information filtering for Web observatories,” In: P. Francq (editor). Collaborative search and communities of interest: Trends in knowledge sharing and assessment. Hershey, Pa.: Information Science Reference, pp. 164–181.

E. Schrier, M. Dontcheva, C. Jacobs, G. Wade, and D. Salesin, 2008. “Adaptive layout for dynamically aggregated documents,” IUI ’08: Proceedings of the 13th International Conference on Intelligent User Interfaces, pp. 99–108.

 


Editorial history

Received 24 August 2012; accepted 4 January 2013.


Copyright © 2013, First Monday.
Copyright © 2013, Ioannis Koutsaftikis, Nikolaos Nanas, and Manolis Vavalis.

Front–paging online newspapers
by Ioannis Koutsaftikis, Nikolaos Nanas, and Manolis Vavalis
First Monday, Volume 18, Number 2 - 4 February 2013
http://firstmonday.org/ojs/index.php/fm/article/view/4352/3411
doi:10.5210/fm.v18i2.4352





A Great Cities Initiative of the University of Illinois at Chicago University Library.

© First Monday, 1995-2014.