PRACTISING WEB DESIGN ESSENTIALS BY ITERATIVE BLOG

DEVELOPMENT WITHIN A COMMUNITY PORTAL

Martin Homola

1,2

and Zuzana Kubincov´a

Faculty of Mathematics, Physics and Informatics, Comenius University, Mlynsk´a dolina, 842 48 Bratislava, Slovakia

FBK-IRST, Via Sommarive 18, 38050 Povo, Trento, Italy

Keywords:

Education supporting platform, Community portal, Blog-supported learning, Learning communities, Lifelong

learning, Teaching web design, Teaching XSLT.

Abstract:

Following constructionism and the learning by doing approach of Papert in our university web design course

students are given the task of building a personal blogs. Students thus practice selected Web technologies.

The task is supported by a dedicated web-based integrated development environment. Their blogs are inter-

connected and communication is available. Students are also encouraged to publish relevant articles on their

blogs. We have observed competitiveness boosting, experience exchange, and overall increase of involvement

with the course. Our experience suggests improved quality of learning to the beneﬁt of our students.

1 INTRODUCTION

Blogging, online communities formation and so-

cial networking have recently become important

socio-economic phenomena that increasingly inﬂu-

ence lives of all, no matter the age, background, or

professional afﬁliation. Within the ﬁeld of online pub-

lishing, the impact of blogging is especially inﬂuen-

tial. The blogosphere has proven to serve as an un-

foreseen media space easily accessible to everyone.

Blogs have been used on an incredible variety of pur-

poses, such as personal publication, independent jour-

nalism, online marketing and corporate public rela-

tions. The omnipresence of blogs and blog articles

does in turn shape the habits of Internet users and it

has impact on user’s needs. Thus blogging has be-

come unignorable in particular for web designers and

web application developers. Therefore we advocate

coverage of blogging by web design and web devel-

opment curricula at any level. We will demonstrate

later on that such inclusion may in fact contribute to

the quality of such curricula increasing the fun factor

and students’ involvement with such courses.

The beneﬁt of information technologies in learn-

ing has been justiﬁed (Papert and Caperton, 1999;

Mosel, 2005) by such theoretical frameworks of

knowledge and learning as radical constructivism

(von Glasersfeld, 1995) and constructionism (Papert

and Harel, 1991). These frameworks conjecture that

knowledge is constructed from perception and inter-

action with the world. Moreover, perception, inter-

pretation and representation of communication and

knowledge are subjective among different learners.

Constructionists suggest learning by doing – by per-

sonal experience and by practical exploration, by do-

ing things in real world. Beneﬁts of blogging and

the newly emerging social Internet in education have

been analyzed by Mosel (Mosel, 2005). According to

Mosel, blogging contributes to effective construction

and organization of knowledge. Through communi-

cation and discussion, that is easily triggered by the

possibility of leaving a comment, one compares her

subjective perceptions with the others and a socially

shared view may evolve. Mosel views blogging and

the associated social Internet technology as an emer-

gent phenomenon and suggests its application in cur-

ricula and didactic applications as an open issue of

particular interest.

In this paper we describe our university course

on web design which makes use of blog develop-

ment and blogging as practical assignments. In our

course students learn web technologies through itera-

tive development of their own blogs, directly experi-

encing the power of the technologies and experiment-

ing with them freely. This is in accordance with Pa-

pert’s learning by doing approach. We encourage stu-

181

Homola M. and Kubincová Z. (2009).

PRACTISING WEB DESIGN ESSENTIALS BY ITERATIVE BLOG DEVELOPMENT WITHIN A COMMUNITY PORTAL.

In Proceedings of the First International Conference on Computer Supported Education, pages 180-185

DOI: 10.5220/0001849901800185

 SciTePress

dents to communicate with others, we focus on build-

ing a learning community, and thus facilitate learning

of serious skills in a way which is appealing and en-

tertaining.

In order to achieve all these goals we provide a

web-based integrated development environment for

our students which they use to build up their blogs.

Blogs of all students are integrated into a portal, and

accessible to all the other students. Communication

and discussion is immediately availablevia comments

under the blog articles, and so students get feedback

and advise from their colleagues and from course lec-

turers as well. During our three year experience with

this practical assignment and our platform we have

observed on our students effects such as unpredicted

creative realization, competitiveness boosting, mutual

exchange of experience, etc. We conclude that thanks

to our application students’ interest and involvement

with the course increases, students ﬁnd working on

the assignment amusing and quality of learning is in-

creased. Our experience shows that choosing blogs

and blogging for practical assignments was a partic-

ularly rewarding step and we agree with observations

of Mosel (Mosel, 2005).

Full version of this paper is available online as

technical report (Homola and Kubincov´a, 2009).

2 EDUCATIONAL BACKGROUND

Newest trends in the learning theories try to map and

reﬂect the real impact of information and communica-

tion technology on the society. In this respect educa-

tional knowledge and learning theories such as con-

structivism and constructionism have become more

and more signiﬁcant. Constructivism, as an episte-

mology theory given by Piaget (Gruber and Voneche,

1995) refers to the process of knowledge construction

from human experience. In radical constructivism of

von Glasersfeld, the relation between the objective

world and the individual’s constructed representation

of reality is characterized by the notion of viability

(von Glasersfeld, 1995; Mosel, 2005). According to

this theory, the important aspect of the subjective rep-

resentations that individuals construct during the pro-

cess of learning is the extent to which these are in con-

ﬂict with the reality they face. These subjective rep-

resentations are the more viable, the less the learner

encounters conﬂicts when comparing them with new

perceptions and acting upon them. Low viability of

constructed knowledge purportedly leads to revision

of constructed knowledge in the process of repetitive

exploration of reality from different angles and view-

points. Radical constructivism results in the conclu-

sion that human beings do not only actively construct

perception and consciousness, but also knowledge

and learning (Mosel, 2005). In accordance, construc-

tivists regard humans to be inventively active subjects

which create their knowledge from perception and in-

teraction with the world.

Didactic approaches based on constructivism put

stress on learning by discovering. Constructionism –

a learning theory by Papert (Papert and Harel, 1991),

states that the most effective way of learning is the

learner’s active knowledge construction. The use of

these theories is promoted by the educational ap-

proach called learning by doing, in which learners ob-

tain new knowledgefrom their ownexperience gained

through the practical application of the subject matter.

Impact of new technologies on the learning pro-

cess is an important research issue that has enjoyed

attention (Papert and Caperton, 1999). A valuable

insight on beneﬁts of blogging and newly emerging

technologies of the so called social Internet in educa-

tion is offered by Mosel (Mosel, 2005). Mosel builds

on notions of microcontent

and micropublishing as

introduced by Spivack (Spivack, 2003). Loosely

speaking, microcontent refers to URI-referable units

of information accessible via Internet, each typically

encapsulating no more then a small number of central

ideas. Microconent typically occurs in collections of

common themes and topics. The act of publishing mi-

crocontent is then called micropublishing by Spivack

and Mosel. Undoubtedly, blogging is the most pop-

ular and most typical type of micropublishing. Blog

postings are mostly rather short and consist of one or

few topics. Hence they usually are more focused than

longer elaborate articles which tend to have many in-

terrelated arguments and are often highly complex.

According to Mosel, micropublishing and specif-

ically blogging contributes to effective social con-

struction and organization of knowledge of elevated

quality with respect to the theory of radical construc-

tivism. Blogs are often thematically focused and

learner-centered. They represent also author’s sub-

jective views and statements as well as relations to

other resources. The possibility of leaving a comment

right under the blog article contributes to interaction

and collaboration with other users. As small units

of knowledge are much easier to discuss and decon-

struct, they are also more helpful with respect to new

knowledge construction. In addition, through collab-

oration, by identifying, formulating and discussing

problems and interests, a socially shared view can

evolve. Mosel views blogging and associated social

Spivack’s notion of microcontent (Spivack, 2003) is not

to be confused with the notion of microcontent used in ty-

pography and usability (Nielsen, 1998).

CSEDU 2009 - International Conference on Computer Supported Education

182

Internet technology as a rather unexplored emergent

phenomenon and suggests its application in curricula

and didactic applications as an open issue of particu-

lar interest.

3 OUR WEB DESIGN COURSE

The course “Modern Approaches in Web Design” is

part of the Master-level curriculum in applied infor-

matics at our university. The course provides a unify-

ing view of the rich palette of web technologies cur-

rently used, that are to some extent covered within

various other courses and concentrates in greater de-

tail on selected technologies. The course has four

main objectives. First, to give an overview of main

technologies employed in web design and web de-

velopment. Second, to cover selected technologies

such as XML, XSLT

and CSS in great detail. Third,

to make students acquainted with standards, method-

ologies and production issues that are relevant to

industrial-level web development such as accessibil-

ity, usability, search engine optimizing, web applica-

tion security, etc. Finally, to rise awareness of emerg-

ing phenomena that nowadays more than ever shape

the Web and inﬂuence web design such as Web 2.0,

blogs, community portals, social networking, etc.

Secondary although still very important goal of

our course is to develop students’ lifelong learning

and personal development skills and competencies re-

lated to effective operation with professional knowl-

edge that they acquire during their training but also

during praxis. Such competencies include: ability to

gather knowledge from various information sources,

to analyze, synthesize, process and critically evaluate

information, to effectively communicate one’s profes-

sional stances and opinions, etc. We address these

secondary goals by practical assignments that involve

such activities (e.g., collecting information and pub-

lishing digest on-topic blog articles).

Students work on several practical assignments of

which only one – the main project assignment – is

mandatory, the rest are extra assignments which are

awarded by extra evaluation points. For the main

project assignment each student needs to implement

a personal blog, especially the visual layout. The

XSLT, the XML Style sheet Transformation language,

is a recursive declarative template language that speciﬁes

how one XML format is translated into another one. Thanks

to its nature, programming inXSLT is signiﬁcantly different

from common imperative languages such as C++ of Java.

As XML has become widely adopted, XSLT programming

is an important skill to train for computer science and ap-

plied informatics students.

most notable extra assignment is the task of publish-

ing blog articles on any topic that is related to the

course. With this assignment students are encour-

aged to make their own research on Web technology,

methodologies, tools, etc., a skill that they will fre-

quently employ in their future praxis. Another inter-

esting extra assignment is to implement original and

unusual features on their blogs.

In the course learning contract students agree with

their name and evaluation being exposed their col-

leagues which as we believe boosts competitiveness

(see Sect.5). At the end of the semester projects are

evaluated. Half of the score for the project is for sub-

mitting a feature-rich blog, the other half is for meet-

ing the web design quality standards such as code va-

lidity, accessibility and usability. The extra assign-

ments add up some score and possibly improve stu-

dent’s grading. The extra score is not at all limited,

and students may publish as many blog articles as

they wish. However, they need to do some research

or to spend extra working hours on their project and

experiment with original features, and hence this as-

signment is practically limited only by the amount of

working time they are willing to invest.

The nature of our course, its content and aims

have inspired us in development of a supporting ap-

plication that provides blog space for our students and

it also serves as integrated development environment

with help of which students are able to implement the

visual layout of their blogs while sharing the same

back-end. The main goals for the application are the

following: to provide each student with a uniﬁed ba-

sic development environment for her blog, where es-

pecially all the blogs share the same back-end, and

students can fully concentrate on the task of devel-

oping the visual layout for their blogs; to enable to

use the very same blog space for submission of the

blog articles for the extra assignments; to have such a

blog portal back-end for this purpose, that would en-

able and boost students’ communication; to support

the teachers in the evaluation process.

4 OUR BLOG PORTAL

Our platform is part of the blog.matfyz.sk community

portal. This portal is accessible to general public and

is purported to become a dedicated unofﬁcial commu-

nity portal for the students but as well for the staff of

our faculty. It serves to three main goals:

Community goal. To create an alternative and un-

ofﬁcial communication channel for the people con-

nected to the faculty.

PRACTISING WEB DESIGN ESSENTIALS BY ITERATIVE BLOG DEVELOPMENT WITHIN A COMMUNITY

PORTAL

183

Figure 1: Typical blog within our portal in default layout.

Educational goal. To provide a supportive envi-

ronment for various courses taught at the faculty, most

notably our course.

Research goal. The portal has been mostly de-

veloped by Bachelor and Master students as part of

their Bachelor/Master projects. Design of the portal

focuses on various research issues related to commu-

nity building, internet publishing and social network-

ing, various Web related technologies and real-world

deployment of native XML databases.

Once a student has registered to the portal, the

portal interfaces change for her and also the way her

blog is processed is changed, and – from the student’s

point of view – the portal effectively turns into an in-

tegrated blog development environment. The portal

makes heavy use of XML technologies. All data is

stored in native XML database, the XML Query Lan-

guage (XQL) is used for querying, and XSLT is then

used to transform the XML data into browser read-

able XHTML documents. This fact has enabled us

to develop with little effort special interfaces for stu-

dents of the course, which are different from the inter-

faces used by ordinary users, and are heavily XML-

oriented. Students post their articles using a desig-

nated data-driven XML format. Students’ blogs are

processed differently by the portal. At the beginning

no layout is applied on their blogs and the students

must develop the visual layout of their blogs by them-

selves, in XSLT and CSS. As their blogs are being

developed, students are encouraged to post course re-

lated information on their blogs. Thus the portal sup-

ports two of the practical assignments of the course:

development of visual layout of one’s personal blog,

and also publishing on topic articles on one’s blog.

And, thanks to the design of interfaces, students prac-

tise XML, XSLT and CSS on the way.

As the portal serves for variety of goals, there are

also trade-offs that had to be undertaken. For most of

Figure 2: Article editing within the student’s interface.

the semester, most of the students’ blogs are under-

developed, some even broken for certain periods of

time. However, for the community building purpose,

students’ articles are visible to all portal visitors, in-

cluding random internet users. When such a visitor

encounters an article written by one of our students,

the article is formatted using the standard portal lay-

out. Students’ own layouts are only visible to other

students of the course. Each visitor, whether a class

mate or not, is able to post comments on student’s

article. Thus students collect feedback from their col-

leagues, but possibly also from wider public.

We will now describe how students use the por-

tal within the course and what they learn by using it.

In order to demonstrate the functionality and features

of her blog, the student is required to publish at least

several articles throughout the semester. In addition

students are encouraged to publish on topic on their

blogs as they are rewarded extra evaluation points for

that. By editing articles via the XML-oriented inter-

face provided for them, they train all the basic XML

notions and skills such as well-formed XML syntax,

DTDs, validation, element and attribute types, etc.

Another thing students extensively practise is pro-

gramming in XSLT, as the portal only allows this lan-

guage to be used in order to process the data and cre-

ate the layout of one’s blog. This is a useful skill since

XSLT is nowadays more and more frequently applied

in various contexts as XML data formats have become

widely adopted. XSLT itself uses XML syntax, hence

students contact time with XML is further increased.

To complete the project assignment students must

implement a blog layout that includes basic and com-

monly expected blog features. Students are also en-

couraged to go beyond this basic requirements and

to implement advanced features such as interactively

folding tree views of comments, their own article

management, access statistics, polls, etc. They are

CSEDU 2009 - International Conference on Computer Supported Education

184

Figure 3: Custom blog layout by a student of the course.

awarded some extra evaluation points for doing that.

Every year some of the most active and creative stu-

dents come up with entirely original ideas to imple-

ment on their blogs thus exploring blogs as a web de-

sign genre and publication media to the fullest. An-

other part of the blog which is evaluated is its com-

pliance to the web design quality standards such as

code validity, cross browser compatibility, accessibil-

ity and usability. It is not trivial at all to produce web

applications that are both compliant with the quality

standards and still neatly and attractively designed.

What is more, this fact is still frequently ignored even

by professional web developers; appealing design and

cool user interface features are commonly preferred to

accessibility and ease of use (Nielsen, 2008).

In this way students train XML, XSLT and CSS,

they are acquainted with blogs and blogging as an im-

portant internet and social phenomenon that increas-

ingly inﬂuences web design as a ﬁeld, they master es-

sentials of blog anatomy, community portal features,

web page layout standards, and they are acquainted

with web design quality standards as well.

5 EVALUATION

The course has already run three times in the form de-

scribed in this paper. In Table 1 we provide some sta-

tistical data from each run of the course. Even if each

student could get around by posting 3–4 articles, we

can see that the average number of articles is higher

than that. Also, the number of comments signiﬁcantly

outnumbers the number of articles, and we notice un-

usually high number of comments for the second year

even if the number of participating students was low

on that year. Indeed students’ activity varies for each

group but overall we conclude that students’ involve-

Figure 4: Another student’s custom blog layout.

ment with these assignments has been signiﬁcantly

high, and they share interest in communication with

others. In addition to measurable values we have ob-

served several things related to the didactic goals of

the course, as follows.

Table 1: Students’ activity per one run of the course.

Year Students Articles Comments

2006/2007 190 1183 1555

2007/2008 87 649 1406

2008/2009 101 663 1172

Competitiveness. We really care for boosting

competitiveness. We believe that it makes partici-

pation in the course attractive and possibly even en-

tertaining. It increases students’ involvement and re-

sults into deeper understanding of the subject matter.

In order to achieve this, we enforce by the learning

agreement that students’ name and intermediate eval-

uation is accessible to all the other students. Student’s

blog and her work in progress is also visible to them.

While such a move may rise privacy concerns, we be-

lieve that our decision is justiﬁed by increased quality

of learning.

Communication. The portal provides means to

comment on each blog article to everyone (even to

general public). Thus students are easily able to com-

municate with their colleagues. As they all cope with

similar tasks, they can provide valuable feedback one

to another. We also encourage students to document

their progress by blog articles. This way they are

immediately helpful to others and they can start dis-

cussion on the problems they encounter while coping

with more difﬁcult parts of the assignment.

Creativity. The task of developing one’s own blog

layout is a great opportunity to exercise creativity.

The fact that everyone can easily see the work and

PRACTISING WEB DESIGN ESSENTIALS BY ITERATIVE BLOG DEVELOPMENT WITHIN A COMMUNITY

PORTAL

185

progress of others, further boosts one’s will to cre-

ate something beautiful and original (at least in some

students). Thus a programming exercise which might

have otherwise been boring turns out to actually be

fun for many students.

6 CONCLUSIONS

In our university web design and web application de-

velopment course we rely on the theory of learning by

doing that builds upon constructionism of Papert (Pa-

pert and Harel, 1991). Students work on various as-

signments, so that they practically explore what they

are taught during the lectures. The main assignment

amounts to developing a personal blog. We have cre-

ated a web-based platform that provides an integrated

blog development environment to our students. The

platform is part of a wider community portal used

at our faculty. Students’ interfaces are heavy XML-

oriented, they develop their blogs by applying XSLT

and CSS on XML data, thus effectively practising

these technologies.

Students’ blogs are not isolated, but they are in-

stead interconnected within the portal. Communi-

cation means such as the possibility to comment on

each and every article are readily available. This sup-

ports students’ mutual interaction and contributes to

their collaboration during the learning process. Thus

a learning community is effectively formed. The par-

ticipants of such a learning community are able to

compare their work with their peers including the in-

termediate evaluation. This creates competition, im-

proves students involvement with the course and in-

creases their understanding and interest in the subject

matter. We have observed situations in which indi-

vidual students appeared to be dragged into the work

on their projects by their peers or simply as they re-

alized that others are already ahead of them. In addi-

tional assignments we encourage our students to pub-

lish meaningful articles on their blogs, documenting

their work in progress and blogging on topics related

to the course subject as well. Thus according to Mosel

(Mosel, 2005) efﬁcient subjective learning is stimu-

lated and social knowledge construction is enabled.

In addition these tasks require collecting and process-

ing relevant information and communicating this in-

formation together with personal views and opinions.

Hence the students’ development continues in such

areas as gaining lifelong learning habits, information

gathering, analyzing, synthesizing and communica-

tion of one’s professional opinions and stances. We

conclude that use of blogging environments, for in-

stance in the way that we have described in this paper

and that we employ in our course, is particularly suit-

able to support such educational goals.

ACKNOWLEDGEMENTS

Full version of this paper is available as technical

report (Homola and Kubincov´a, 2009). Martin Ho-

mola is supported by project VEGA no. 1/0719/09 of

Slovak Ministry of Education and Slovak Academy

of Sciences. The authors are grateful to all stu-

dents who contributed to development of the portal,

most notably Anton Kohutoviˇc, Martin Rejda, Marek

Kov´aˇcik, Juraj Fank, Michal Novomesk´y and Marek

Sivˇco. Many thanks to Michaela Daniˇsov´a who con-

tributed graphics for the extended version, and to

Just´ına Cielontkov´a and Luk´aˇs Zdechovan for allow-

ing to publish screenshots of their blogs.

REFERENCES

Gruber, H. E. and Voneche, J. J., editors (1995). The Es-

sential Piaget: An Interpretive Reference and Guide.

Jason Aronson.

Homola, M. and Kubincov´a, Z. (2009). Practising web de-

sign essentials by iterative blog development within a

community portal (extended version). FMFI UK, TR-

2009-019 in Informatics. http://kedrigern.dcs.fmph.

uniba.sk/reports/display.php?id=20.

Mosel, S. (2005). Self directed learning with personal pub-

lishing and microcontent. In Microlearning 2005 con-

ference, June 23-24, Innsbruck, Austria.

Nielsen, J. (1998). Microcontent: How to write headlines,

page titles, and subject lines. In Jakob Nielsen’s Alert-

box. http://www.useit.com/alertbox/980906.html.

Nielsen, J. (2008). Four bad designs. In Jakob Nielsen’s

Alertbox. http://www.useit.com/alertbox/bad-design.

html.

Papert, S. and Caperton, G. (1999). Vision for education:

The caperton-papert platform. In91st annual National

Governors’ Association meeting.

Papert, S. and Harel, I. (1991). Constructionism. Ablex

Publishing Corporation.

Spivack, N. (2003). Deﬁning microcontent. In Minding the

Planet. http://novaspivack.typepad.com/nova

spivacks weblog/2003/12/deﬁningi microc.html.

von Glasersfeld, E. (1995). Radical Constructivism. A Way

of Knowing and Learning. Falmer Press, London.

CSEDU 2009 - International Conference on Computer Supported Education

186