Courses Synopsis

In this course, students will be exposed to the popular communication tool which is the internet, and how to use it in teaching and learning efficiently. students will experience in developing a website/portal for interactive teaching and learning. (Programming skills obtained from course MPT 1193 will help). This course also gives an opportunity to the students to evaluate the effectiveness of the developed website by using several testing and evaluation techniques.

Learning Outcomes

At the end of this course, students should be able to:

1. Identify the concepts of developing a teaching and learning website or portal.
2. Identify the instructional design model for web development.
3. Acquire the technology related to web development sufficiently.
4. Develop a website or educational portal for the purpose of teaching and learning.
5. Conduct an evaluation process towards the produced website or portal.
6. Upload and update the website on the server.

Week 4

Web Design

Web designing process- Information design, interaction design and interface design.

I've been creating web sites for 10 years, and I've got much more successful at it over that time. And I've come into contact with lots of very clever and complex software development processes, many of which don't produce very good results.

This is the typical process I use today on most of the sites I do (of all sizes). It focuses on getting clear on what you're doing before you start, and staying clear while you work swiftly towards a good solution.
Overview

1. Know what you're doing
2. Know what the site needs to do
3. Know what the site's visitors want
4. Get a good picture of the personality and style of the web site
5. Sketch out highly successful scenarios
6. Organise views into a site map
7. Sketch the essential features & look
8. Map your visitors' attention
9. Arrange the visual elements to work together

Step-by-step
1. Know what you're doing

Being clear about what you are working to achieve helps you achieve it.

Always be clear on your goal - the state you wish to reach - when you sit down to design a site.

* Do you want to impress other web designers?
* Do you want to delight your client?
* Do you want to make a good profit and pay your rent on time?

There's a kind of magic called "creative visualisation". When you can see an end-point in your mind's eye, you can much more easily see the steps you need to take to get there. Also, you'll even find that your subconscious actions help carry you forward too.
2. Know what the site needs to do

You may have a client who tells you what they want (e.g. "We want to break into the big time and sell more widgets.").

Try to get really clear about what the goals of a site are. What does success look like? How will you know when you've got there?

Having this stuff clear in your mind helps you:

1. make the thousands of design decisions between now and a finished product
2. communicate with your client and maintain their confidence throughout the process
3. show that you've done what you set out to do

3. Know what the site's visitors want

Ideally, you'd like to show your designs to all your site's target users, and find out what works well for them. As this is not possible, you need another technique.

For all but the simplest of sites, I develop personas and scenarios, based on a simple goal-directed techniques developed by lovely Alan Cooper and his friends at Cooper Interaction Design.
4. Get a good picture of the personality and style of the web site

User personas give you great insight into users' goals and behaviour.

But a web site often has its own goals that may be in conflict with the goals of the users. The site also often has Soft Goals, to support or develop its Brand.

You need a way to balance all these various forces optimally.

I've developed a further tool, the Site Persona, which embodies the site's personality, drive and goals in the same way that User Personas do for users. The Site Persona represents both the Brand and the Goals of the web site, which you work into the mix through dialogue with User Personas.

Picture your web site's interactions as a series of conversations between User Personas and the Site Persona. The users are trying to get what they want, and the Site Persona is trying to help them, while ensuring it does its own job.
5. Sketch out highly successful scenarios

Once you know what your site wants to achieve, and what your visitors want to achieve, it's time to start planning out the site's structure.

I don't start with a site map, as this is too restrictive. I prefer to sketch out the experience, using pencil & paper, just showing the most important aspects of the interaction between site and user.

(Sometimes, these are in the form of a scripted dialogue, where my user persona and site persona communicate as though in a conversation, which will eventually be translated into visual elements.)

A sketch will typically feature:

* Stars showing how a user arrives at the site (entry points)
* Circles showing actions, views or places (which may eventually become pages)
* Arrows showing how users may move around the site
* Speech bubbles representing what a user persona thinks at key places

Here's a real first site sketch I've just done on paper, which lets me think and work quickly.

Don't worry about the particulars of the design. This sketch isn't a project deliverable to share with other people. It's for my use, to help me clarify what's important.

This particular sketch shows a few successful scenarios, which may apply to different user personas. The important thing is I've started visualising the path to success (users taking part in online auctions), from different starting points.

Here, I've realised that the key point is ensuring that visitors can find something that they're interested in. If that doesn't happen, nothing else I can design will matter.

Therefore, to make this site successful, I have to make it easy and appealing to look around until you find something you like enough to find out more.

I may do lots of these sketches, but they'll never take more than a couple of minutes each. But I've got my head working freely on the problem, unencumbered by constraints like complicated drawing packages or modelling syntax.
6. Organise views into a site map

You will need to plan out what pages will be on your site, how they might be grouped, and how users will easily find their way around.

Your site map will effectively merge all the views from your initial free sketches into a structure that's clear and economical. You want your visitors to be able to move freely from place to place, following their noses to their goals.

Things to think about:

* Think what global or top-level links really need to be available on every page. Test your assumptions.
* Create enough sections that it will be easy to focus on what you want.
* Be careful not to over-segment. If you have too many sections, your site will look bigger and seem harder to navigate. Avoid creating sections that won't have enough content. ("No news is bad news").
* You need to include any other stuff that needs to be there (like Contact Us and Login), which might not feature on any of your sketches to date.
* Look for ways to use smart links and deep links that take users directly to what they're most likely to want next. Don't make them dig.
* Try to optimise the site so that the paths to the key goals are easy, i.e. with fewest possible steps. Your page design will build on this.
* Remember the principles of simplicity and Occams Razor. If you can achieve something more simply, if you can remove something and still maintain the required effect, do it.

7. Sketch the essential features & look

Now we'll start designing the page, still working on paper at this point. (I find that paper & pencil are much quicker tools than a computer, no matter what software package I use.)

Normally, I'll start by shutting my eyes or gazing out of the window, while I visualise what kind of layout and look will feel right, providing a nice clean interface that portrays the right personality.

I'll then sketch that quickly onto paper, in a rough rectangle, and slap on the essential features:

* Overall page structure and proportions
* Level 1 navigation (your sections)
* Other global navigation (like login/out, site map, help, footer navigation)
* Main areas of screen real-estate
* Any key graphical elements

There's not much to see in this simple sketch. The body of the site will sit in the middle of the page. I've put in the top navigation bar, site logo and strapline, and I've got an idea where the content is going, and that there will be thumbnail images down the right hand side.

It doesn't look like much, but all it's doing is helping me crystallise the vision in my mind's eye of what the page will look like.
Why I do more designing in my head than I do on the computer

The quick pencil sketch just helps me quickly record the likeness of what I've visualised in my head. Then I don't forget and can make it up quickly in Photoshop. I find this way of working a lot more efficient than starting off in Photoshop. Again, it's getting clear first, then doing (think-then-do).
8. Map your visitors' attention

A key step in doing your page layout sketch is getting a good idea of where your visitors will want to look.

When you craft the page on the computer, your job is to balance the relative noticeability of all the visual elements on the page, so that visitors will be drawn to the things that are most important.
Things that increase noticeability

* Bigger things!
* Strong colours (used sparingly)
* High contrast (either shapes, lines or edges with significantly different tones)
* Movement (either actual animation or dynamic lines that give the impression of movement)
* Things with plenty of space around them (they're easier to identify and seem more important)
* Things placed at high-value positions on the page (e.g. towards the top-left and down the middle -- depends on your layout)

The Golden Rule comes into play here.

Everything on your site must either:

* Help your visitors achieve their goals, or
* Support the site's goals without obstructing the visitor's goals

So we'll use these devices to show visitors where to look, and where they don't need to look (unless they need to).

On the screenshot above, notice what's most noticeable. See how you can get an impression of what the site's about, and what you're likely to find there, with just a quick glance (and without being able to read much of the text).

This is made possible by carefully prioritising the most relevant visual elements - the ones that are most useful in explaining what the site is about, what you'll find here, and where you might go next.
9. Arrange the visual elements to work together

It's only now that I'd dive into Photoshop. I'm totally prepared, and ready to work quickly (because I know that playing on the computer can easily make me lose perspective).

* I know what the site has to achieve to succeed
* I know what my visitors are looking for, and what they're trying to achieve
* I understand the site's personality and what it wants to achieve while the visitors are on there
* I know what pages and sections are on my site
* I have a good idea of the right page layout that will help visitors flow round the site easily, keeping them interested until they have done what they want
* I know what visual elements will be on my page, and their relative priority

This prior work will help me quickly execute a design that's fit-for-purpose, without getting too bogged down trying lots of different page layouts in Photoshop (which is time-consuming).

There are a few other principles & disciplines that help me create something that's more than adequate, without taking up too much of mine & my client's time:

* I work in short bursts. If I feel tired or unclear, I'll stop and do something else.
* I keep it simple. I'll try to find simple page layouts, navigation structures, and tonal/colour schemes. I'm not afraid to adapt something that has worked before, if it's suitable.
* I invest energy where it is most beneficial. I'll happily craft custom buttons, an icon or logo, if doing so will deliver impact. I know that each page doesn't need too many rich visual features, if they are applied with care

Instructional design model that can be used- Hipermedia design model. R2D2, Rapid prototyping model.

Week 1

Introduction to the course syllabus

Introduction

Welcome to Web-based Multimedia Development. In this course you’ll learn the basics of building educational multimedia Web sites. There are a range of tasks involved, requiring both design skills and software development skills.The course flows along in three main streams, that parallel and build on one another. Our first order of business is to begin to master the software toolkit you’ll need to build Web sites. The toolkit includes HTML, a Web page editor, image editing software, animation software, and audio and video compression software. Naturally, part of the job is to figure out how to use the right tool for the right job and pull all the pieces together. We’ll use a screen- and print-based tutorial called Presence as you work with the tools on your computer.
Software tools: Presence

Design skills: Textbook and Web-based modules.
Designing an Educational Web Site

Introduction
Welcome to Web-based Multimedia Development. In this course you’ll learn the basics of building educational multimedia Web sites. There are a range of tasks involved, requiring both design skills and software development skills.The course flows along in three main streams, that parallel and build on one another. Our first order of business is to begin to master the software toolkit you’ll need to build Web sites. The toolkit includes HTML, a Web page editor, image editing software, animation software, and audio and video compression software. Naturally, part of the job is to figure out how to use the right tool for the right job and pull all the pieces together. We’ll use a screen- and print-based tutorial called Presence as you work with the tools on your computer.


But the software tools, of course, are useless without some design skills to go with them. In this course, you’ll learn to assess your target audience’s needs, then choose appropriate content and design navigation systems and page layouts to meet those needs. You’ll do this with the help of the textbook (Williams & Tollett) and the Web-based presentations, discussions, and other activities.
You’ll put your newly-acquired design skills into practice right away by starting to design your own educational Web site. You’ll assess your audience’s needs, draft a short proposal, draw a flow diagram and sketch a storyboard. By the time your design is ready, you’ll have completed the software tools segment of the course, and you’ll be ready to begin development of your design. By the end of the course, you’ll have designed and developed a prototype educational multimedia Web site you can use in your professional portfolio.

Week 10

Technology for producing dynamic menus web development

The method of producing dynamic web page content for transmission on a computer network, comprising the steps of: providing one or more entries in a system dictionary,each entry representing a static layout tag type to be mapped to one or more dynamic structures; receiving a first reference to at least one web page portion, said web page portion comprising static layout definitions and static content definitions; receiving a second reference to alternate web content via an Hyper Text Transfer Protocol Post command; extracting said layout definitions from said web page; creating at least one layout template web page from said extracted layout definitions; andmapping said alternate web content into said layout template web page by replacing content parameters associated with said extracted layout definitions for which matching entries are found in said system dictionary, thereby creating at least one web pageportion containing said alternate content.

2. The method of producing dynamic web page content of claim 1, wherein said web page portion contains Hyper Text Markup Language.

3. The method of producing dynamic web page content of claim 1, wherein said template web page contains Hyper Text Markup Language.

4. The method of producing dynamic web page content of claim 1, wherein said alternate content web page contains Hyper Text Markup Language.

5. The method of producing dynamic web page content of claim 1, further comprising the step of retrieving said alternate web content from a computer-readable medium.

6. The method of producing dynamic web page content of claim 5, wherein said step of retrieving said alternate web content from a computer-readable medium includes retrieving said alternate content from a computer database.

7. The method of producing dynamic web page content of claim 5, wherein said step of retrieving said alternate web content from a computer-readable medium includes retrieving said alternate content from a computer file system.

8. The method of producing dynamic web page content of claim 5, wherein said step of retrieving said alternate content from a computer-readable medium includes retrieving said alternate web content from a computer network

interface.

9. The method of producing dynamic web page content of claim 8, wherein said step of retrieving said alternate web content from a computer network interface includes retrieving said alternate content from a local area network interface.

10. The method of producing dynamic web page content of claim 8, wherein said step of retrieving said alternate web content from a computer network interface includes retrieving said alternate content from an Internet.

11. The method of producing dynamic web page content of claim 1, further comprising providing a servlet for extracting said template web page from said received web page portion.

12. The method of producing dynamic web page content of claim 1, further comprising providing a servlet for mapping said alternate web content into said template web page.

13. The method of producing dynamic web page content of claim 1, further comprising the storing of said alternate web page in a computer-readable media.

14. The method of producing dynamic web page content of claim 1, further comprising transmitting said alternate web page over a computer network.

15. The method of producing dynamic web page content of claim 14 wherein said computer network includes a local area network.

16. The method of producing dynamic web page content of claim 14 wherein said computer network includes an Internet.

17. An article of manufacture comprising: a computer readable medium suitable for encoding program code means therein or thereon; and one or more program code means causing a processor to perform the steps of: (a) providing one or more entriesin a system dictionary, each entry representing a static layout tag type to be mapped to one or more dynamic structures; (b) receiving a first reference to at least one web page portion, said web page portion comprising static layout definitions andstatic content definitions; (c) receiving a second reference to alternate web content via an Hyper Text Transfer Protocol Post command; (d) extracting said layout definition; (e) creating a template web document using said extracted layout definition; (f) retrieving alternate web content suitable for mapping into a web document; and (g) mapping said alternate web content into said template web document by replacing content parameters associated with said extracted layout definitions for whichmatching entries are found in said system dictionary, thereby creating a web page containing said alternate web content.

18. An article of manufacture according to claim 17, wherein said web page portion comprises a Hyper Text Markup Language web page portion.

19. An article of manufacture according to claim 17, wherein said template web page comprises a Hyper Text Markup Language web page.

20. An article of manufacture according to claim 17, wherein said alternate web page comprises a Hyper Text Markup Language web page.

21. An article of manufacture according to claim 17, wherein said step of receiving a web document portion comprises retrieving said web document portion from a computer database.

22. An article of manufacture according to claim 17, wherein said step of receiving a web document portion comprises retrieving said web document portion from a computer network.

23. An article of manufacture according to claim 22, wherein said step of retrieving said web page portion from a computer network comprises retrieving said web document portion from an Internet.

24. An article of manufacture according to claim 17, wherein said step of receiving a web document portion comprises retrieving said web document portion from a computer file system.

25. An article of manufacture according to claim 17 comprising at least one servlet.

26. An article of manufacture according to claim 25 comprising at least one Java servlet.

27. An article of manufacture according to claim 17, wherein said further comprises code means-for storing said created web page in a computer readable medium.

28. An article of manufacture according to claim 27 wherein said code means for storing said created web page in a computer readable medium comprises code means-for storing said created web page in a computer file system.

29. An article of manufacture according to claim 27 wherein said code for storing said created web page in a computer readable medium comprises code means for storing said created web page in a computer database.

30. An article of manufacture according to claim 17, wherein said code means further comprises code means for transmitting said dynamic web page over a computer network.

31. An article of manufacture according to claim 30, wherein said computer network comprises an Internet.

32. A system for producing web pages containing dynamic content, comprising: one or more entries in a system dictionary, each entry representing a static layout tag type to be mapped to one or more dynamic structures; a means for receiving afirst reference to a web page portion, said web page having at least one static content definition and an associated layout definition; a means for extracting said layout definition from said first web page; a means for receiving a second reference toalternate web content to be mapped into a web page; and a means for mapping said received alternate web content into said extracted layout definition by replacing content parameters associated with said extracted layout definitions for which matchingentries are found in said system dictionary, thereby creating a second web page.

33. A system for producing web pages containing dynamic content according to claim 32 wherein said means for receiving a first web page portion includes a means for receiving a Hyper Text Markup Language web page portion.

34. A system for producing web pages containing dynamic content according to claim 33 wherein means for receiving a Hyper Text Markup Language web page portion includes a means for receiving web content from a computer database.

35. A system for producing web pages containing dynamic content according to claim 33 wherein means for receiving a Hyper Text Markup Language web page portion includes a means for receiving web content from a computer file system.

36. A system for producing web pages containing dynamic content according to claim 33 wherein means for receiving a Hyper Text Markup Language web page portion includes a means for receiving web content from a computer network.

37. A system for producing web pages containing dynamic content according to claim 36 wherein means for receiving web content from a computer network includes a means for receiving web pages from an Internet.

38. A system for producing web pages containing dynamic content according to claim 32 wherein said means for extracting said layout definition from said first web page comprises a servlet program.

39. A system for producing web pages containing dynamic content according to claim 32 wherein said means for mapping said alternate web content into said layout definition and creating a second web page comprises a servlet program.

40. A system for producing web pages containing dynamic content according to claim 32 further comprising a means for storing said created web page in a computer database.

41. A system for producing web pages containing dynamic content according to claim 32 further comprising a means for storing said created web page in a computer file system.

42. A system for producing web pages containing dynamic content according to claim 32 further comprising a means for transmitting said created web page over a computer network.

43. A system for producing web pages containing dynamic content according to claim 42 wherein said computer network includes an Internet.

Week 9

Web tools

Brief explanation and the technology available in a web site e.g: Chatting, forum, e-mail, download and upload, guestbook etc.

Web 2.0 Technology

"Web 2.0" refers to web development and web design that facilitates interactive information sharing, interoperability, user-centered design and collaboration on the World Wide Web. Examples of Web 2.0 include web-based communities, hosted services, web applications, social-networking sites, video-sharing sites, wikis, blogs, mashups and folksonomies. A Web 2.0 site allows its users to interact with other users or to change website content, in contrast to non-interactive websites where users are limited to the passive viewing of information that is provided to them.

The term is closely associated with Tim O'Reilly because of the O'Reilly Media Web 2.0 conference in 2004.Although the term suggests a new version of the World Wide Web, it does not refer to an update to any technical specifications, but rather to cumulative changes in the ways software developers and end-users use the Web. Whether Web 2.0 is qualitatively different from prior web technologies has been challenged by World Wide Web inventor Tim Berners-Lee who called the term a "piece of jargon"

Week 8

Students begin to develop their web sites

• Integration of graphics and animation into web site
• Integration of audio and video elements into web site- Streaming concept

Week 7

Web Evaluation


The process of web evaluation insluding formative and sumative assesment

Web Formative and Summative Assessment

There is a limited research base on the use of online tools to deliver formative and summative assessments. However, the research base on traditional testing formats is relevant and provides insight into the experiences of learners. To frame the theoretical framework for this study, we present the literature demonstrating that (a) formative assess­ments can serve as effective test preparation events, (b) providing multiple formative assessments can influence learners’ test perceptions, and (c) migrating traditional multiple-choice tests to an online testing protocol provides no universal performance or perception variances.

Impact of Formative Assessment on Learning and Achievement

The decision to use formative assessment in instruction is typically motivated by an attempt to provide the instructor with an accurate esti­mation of student ability at a particular point in the course, or to provide the students with an assessment task similar in nature to the summative test (Buchanan, 1998). This allows the student to identify strengths and weaknesses and to better prepare for the “real” exam. One of the great advantages of online test programs is the ability to deliver practice tests that serve as formative assessment tools for the students. Practice tests have been shown to increase students’ final outcome performance by roughly twelve percent (Bocij & Greasley, 1999; also see Carrier & Pashler, 1992; Dempster, 1997; Glover, 1989; McDaniel, Kowitz, & Dunay, 1989). Delivering practice tests online may provide an additional benefit to the student by allowing her or him to complete the test conveniently without the environmental distractions that are common during in-class practice tests.

Because different conceptualizations for “practice test” or “practice quiz” are common, there are dramatically different educational, cognitive, and theoretical implications when employing the different strategies of practice testing; thus, operationalization is key. In this discussion, unless otherwise noted, practice quizzes and formative assess­ments refer to assessment tools that are completed by students prior to a summative (graded) assessment. These practice tests are similar to summative assessments in format and difficulty level, but do not impact the students’ course grade and are comprised of a different set of items.

The utility of formative assessment is partly reliant upon the manner through which the feedback is provided to the learner. The most desirable feedback approach appears to be immediate post-performance reporting,

which provides feedback directly after the entire quiz or test has been completed (King & Behnke, 1999). This method takes advantage of a primary benefit of computer-assisted assessment by supplying timely feedback (Clariana, Ross, & Morrison, 1991; Jongekrijg & Russell, 1999), while avoiding the problem of inducing anxiety or distraction that can arise when providing performance indicators directly after each item (Wise, Plake, Eastman, Boettcher, & Luken, 1986; Wise, Plake, Pozehl, Barnes, & Lukin, 1989). The anxiety induced in item-by-item feedback has been shown to hamper performance through motivational processes such as learned helplessness or externalized attributions of control over perfor­mance (Boggiano & Ruble, 1986).

Formative Assessment and Students’ Perceptions of Tests

The benefits of repeated formative assessment for students are likely to rest in their perceptions of test preparedness for the summative measure. Bandura (1986) proposed repeated exposure to successful testing experiences for students with high anxiety would promote self-efficacy for later tests. The use of formative assessments (where no evaluative pressure is imposed) as practice for tests is likely to increase the probability that students will have a positive experience in the testing event with respect to anxiety. In these formative assessment experiences, perceived threat, self-awareness, cognitive test anxiety, and emotion­ality should all be lower than in standard summative assessment sessions (Kurosawa & Harackiewicz, 1995; Schwarzer & Jerusalem, 1992). With the suppression of these affective detractors, the student is more likely to be able to benefit from self-regulatory processes in the practice testing session, leading to higher performance, growth, and subsequent success (Bandura, 1986; Schutz & Davis, 2000).

Online Summative Assessment

Summative assessment in an online environment differs in form and function from the formative assessment process. Not only are the summative assessments graded, but the methods through which students access and respond to the tests usually differ. The summative assessment process requires high levels of control and security in the testing process to ensure reliability and validity in scores, attention to technical problems that may arise during the testing session, and assurance that the online nature of the testing process itself has no impact on actual performance. An additional concern that is often raised by instructors considering online summative assessment is that online testing will induce heightened levels of anxiety over the test, leading to performance levels that underestimate true ability.

The advantages for providing course tests online can include flexibility in delivering tests to students and efficiency in scoring, depending upon the method of delivery chosen by the instructor. With the online delivery of tests, students are not necessarily bound by the traditional artificial academic scheduling constraints. Specifically, (a) they can complete exams at different times of the day to fit their convenience; (b) they can poten­tially complete the tests in different locations if the test is not a required “closed-book” exam; and (c) unless there is an explicit reason for a time limit, students can take as long as needed to complete the exam. In a similar line, an additional benefit that can be gained through online summative assessment is that additional class time may be gained in traditional on-campus courses. That is, rather than taking a class period to have the students complete the course exam, the instructor can use the class period for instruction.

In perhaps the most complete examination of online summative assess­ment to date, Bocij & Greasley (1999) reported that students claimed online testing was superior because they were less distracted with the process of handwriting their responses, which helped them maintain focus on the test items and were less panicked. The lower levels of panic were impacted in part by the fact that online tests took less time to complete. Students in Bocij & Greasley’s (1999) work reported the tests were fair, unbiased, and “less threatening than conventional examinations” (p. 14). Finally, the authors reported that performance gains were noted in the online testing conditions, but these effects were not present for the high ability students who appeared to be unaffected by test delivery format.

Present Investigation

As mentioned earlier, this investigation addressed two research questions. The first was a comparison of the effect of delivering course exams online versus in class on paper. This portion of the study involved examining the affective experiences of one instructor’s students. The students were enrolled in the same course, separated by one year. The only evaluative difference existing between the two courses was the method of delivering the course exams. For the first group of students, all tests were delivered in class on paper. For the second group, all tests were delivered online in a computer-based testing laboratory staffed by testing proctors who ensured the security of the testing process and corrected any technical issues that arose. Students’ levels of cognitive test anxiety, emotionality, and perceived threat of tests were compared to determine if there were dif­ferential perceptions of tests for students experiencing the two alternate methods of test delivery. These data were intended to examine the extent to which online testing leads to heightened levels of fear, anxiety, or worry over tests. The hypothesis underlying this question was that the method of presentation would have no meaningful detrimental impact for the students in any of these variables.

The second part of the study examined the relationships among the use of online formative assessments, student performance, and test perceptions. For both groups of students, online practice tests were made available as a test preparation option for only the third exam. It was expected that the students using online formative assessment tests (as practice) would have higher rates of performance on subsequent summa­tive assessment measures. Due to the differential patterns of behavior and performance traditionally noted in students with test anxiety based in part on study strategies (Naveh-Benjamin, McKeachie, & Lin, 1987), no a priori predictions regarding the relationship between online formative assessment and test perceptions were reasonable.

Analyzing existing web evaluation forms

Web analytics is the measurement, collection, analysis and reporting of internet data for purposes of understanding and optimizing web usage

There are two categories of web analytics; off-site and on-site web analytics.

Off-site web analytics refers to web measurement and analysis irrespective of whether you own or maintain a website. It includes the measurement of a website's potential audience (opportunity), share of voice (visibility), and buzz (comments) that is happening on the Internet as a whole.

On-site web analytics measure a visitor's journey once on your website. This includes its drivers and conversions; for example, which landing pages encourage people to make a purchase. On-site web analytics measures the performance of your website in a commercial context. This data is typically compared against key performance indicators for performance, and used to improve a web site or marketing campaign's audience response.

Historically, web analytics has referred to on-site visitor measurement. However in recent years this has blurred, mainly because vendors are producing tools that span both categories.

Online form

Online form tracking and analysis is somewhat nascent to say the least. A quick search on Google yields little on the subject beyond the odd discussion group. However, UK-based solutions provider Speed Trap has recently included the functionality in its Prophet E-Business Intelligence Suite. Prescience or wishful thinking? We think prescience: the form tracking industry seems here to stay. After all, it’s another way that the web can measure marketing initiatives in a way that offline programs cannot.

This article introduces the online form tracking market at its earliest stage, and identifies the needs and measures for form tracking as a subset of web analytics.

Form filling plays a significant role for most websites. Often a form is an important market research tool or a key lead generator for further offline and online marketing initiatives. They help you learn about user needs and better shape products or services for them.

However, they are often perceived as the bane of web user’s existence, getting in the way and obstructing them from the content they want.

Given this dichotomy – and the ongoing necessity of online forms – the need to optimise online form usage and fulfillment has never been greater.

What to measure

The items to track a form can be group into four areas: Form Fulfillment, Form Failure, Form Abandonment and Form View Only. The relevant factors to measure vary, but generally include questions that need to be answered as to why a form is completed or not.

Form Fulfillment - The form is completed and submitted with no problems. One or two attempts may have occurred, but you collect the minimum information required. Relevant factors include:

• How long did it take to complete?
• How much information over the minimum was collected?
• Did the form fill sequence work?
• Where was the information entered first?
• What optional fields were left vacant?

Form Failure - The form is completed or partially finished but no acknowledgement from the site that the form was submitted, likely rendering the data lost. This can occur with people who are less web savvy, or if the ’submit’ button is harder to find. Relevant factors include:

• What information/fields were entered?
• What sequence was used?
• Not entered
• Design/layout
• Browser compatibility
• Use of autofill

Form Abandonment - The form is attempted but abandoned. No attempt to submit. Relevant factors include:

• What information was entered?
• What sequence is used?
• Form length
• Labeling
• Design layout
• Incentives
• Use of autofill
• Distractions
• Security Concerns

Form View Only - A user has merely viewed the form and clicked away. Relevant factors include:

• What sequence is used?
• Form length
• Labeling and/or instructional copy
• Design layout
• Incentives
• Distractions
• Security Concerns

Build or buy

Preliminary research revealed that the preference in the early days (a few years ago) for form tracking was to purpose-build an application. This was mainly because few solutions existed in the marketplace. Today, purchased applications are winning favour and those with an understanding of form tracking’s importance are leaning that way.

Mike Keyes, of Minneapolis-based web marketing consultancy Ciceron, said he built a tracking application several years ago, but plans to replace it with a purchased solution. “We realised there was no way for us to cost-effectively keep up with the innovation that is occurring in the industry right now,” said Mr Keyes.

Jim Cuene ,who works for a large financial services company, said has been looking for a form tracking tool for some time. He had previously used Atlas Net Conversions usability service but felt it was cost prohibitive. “It’s ( Atlas) a great snapshot of how forms are used, but it is too expensive,” said Mr. Cuene.

Consequently the buy option in relation to form tracking is becoming more realisable as the need for overall ‘out of the box’ web analytics solutions grow. Providers such as Web Side Story (HBX On Demand) and Speed Trap are including form tracking as part of a fully featured web analytics package.

Thus as the cost comes down and the functionality increases, the buy option is fast becoming a no-brainer.

Producing and utilizing of web evaluation form

Checklist for Evaluating Web Resources
Is the Web a good research tool? This question is dependent on the researcher's objective. As in traditional print resources one must use a method of critical analysis to determine its value. Here is a checklist for evaluating web resources to help in that determination.

Authority:
-Is the information reliable?
-Check the author's credentials and affiliation. Is the author an expert in the field?
-Does the resource have a reputable organization or expert behind it?
-Are the sources of information stated? Can you verify the information?
-Can the author be contacted for clarification?
-Check for organizational or author biases.

Scope:
-Is the material at this site useful, unique, accurate or is it derivative, repetitious, or doubtful?
-Is the information available in other formats?
-Is the purpose of the resource clearly stated? Does it fulfill its purpose?
-What items are included in the resource? What subject area, time period, formats or types of material are covered?
-Is the information factual or opinion?
-Does the site contain original information or simply links?
-How frequently is the resource updated?
-Does the site have clear and obvious pointers to new content?

Format and Presentation:
-Is the information easy to get to? How many links does it take to get to something useful?
-What is the quality of the graphical images? Do these images enhance the resource or distract from the content?
-Is the target audience or intended users clearly indicated?
-Is the arrangement of links uncluttered?
-Does the site have its own search engine?
-Is the site easily browsable or searchable?

Cost and Accessibility:
-Is the site available on a consistent basis?
-Is response time fast?
-Does the site have a text-based alternative?
-How many links lead to a dead-end?
-Is this a fee-based site? Can non-members still have access to part of the site?
-Must you register a name and password before using the site?

Other Tips:
-Check the header and footer information to determine the author and source.
-In the URL, a tilde ~ usually indicated a personal web directory rather than being part of the organization's official web site.
-In order to verify an author's credentials, you may need to consult -some printed sources such as Who's Who in America or the Biography Index.
-Check and compare the web site to others which are both similar and different.

Exposure to the concept of reliability and validity of web evaluation form

Reliability and Validity for Quality
Information is everywhere on the Internet, existing in large quantities and continuously being created and revised. This information exists in a large variety of kinds (facts, opinions, stories, interpretations, statistics)and is created for many purposes (to inform, to persuade, to sell, to present a viewpoint, and to create or change an attitude or belief). For each of these various kinds and purposes, information exists on many levels of quality or reliability. It ranges from very good to very bad and includes every shade in between.

Getting Started: Screening Information
Pre-evaluation

The first stage of evaluating your sources takes place before you do any searching. Take a minute to ask yourself what exactly you are looking for. Do you want facts, opinions (authoritative or just anyone's), reasoned arguments, statistics, narratives, eyewitness reports, descriptions? Is the purpose of your research to get new ideas, to find either factual or reasoned support for a position, to survey opinion, or something else? Once you decide on this, you will be able to screen sources much more quickly by testing them against your research goal. If, for example, you are writing a research paper, and if you are looking for both facts and well-argued opinions to support or challenge a position, you will know which sources can be quickly passed by and which deserve a second look, simply by asking whether each source appears to offer facts and well-argued opinions, or just unsupported claims.

Select Sources Likely to be Reliable
Becoming proficient at selecting sources will require experience, of course, but even a beginning researcher can take a few minutes to ask, "What source or what kind of source would be the most credible for providing information in this particular case?" Which sources are likely to be fair, objective, lacking hidden motives, showing quality control? It is important to keep these considerations in mind, so that you will not simply take the opinion of the first source or two you can locate. By thinking about these issues while searching, you will be able to identify suspicious or questionable sources more readily. With so many sources to choose from in a typical search, there is no reason to settle for unreliable material.

Week 5 & 6

Application of learning theory in producing a website.

Observational Learning

Definition

Observational learning, also called social learning theory, occurs when an observer’s behavior changes after viewing the behavior of a model. An observer’s behavior can be affected by the positive or negative consequences–called vicarious reinforcement or vicarious punishment– of a model’s behavior.

Discussion

There are several guiding principles behind observational learning, or social learning theory:

1. The observer will imitate the model’s behavior if the model possesses characteristics– things such as talent, intelligence, power, good looks, or popularity–that the observer finds attractive or desirable.
2. The observer will react to the way the model is treated and mimic the model’s behavior. When the model’s behavior is rewarded, the observer is more likely to reproduce the rewarded behavior. When the model is punished, an example of vicarious punishment, the observer is less likely to reproduce the same behavior.
3. A distinction exists between an observer’s “acquiring” a behavior and “performing” a behavior. Through observation, the observer can acquire the behavior without performing it. The observer may then later, in situations where there is an incentive to do so, display the behavior.
4. Learning by observation involves four separate processes: attention, retention, production and motivation.
• Attention: Observers cannot learn unless they pay attention to what’s happening around them. This process is influenced by characteristics of the model, such as how much one likes or identifies with the model, and by characteristics of the observer, such as the observer’s expectations or level of emotional arousal.
• Retention: Observers must not only recognize the observed behavior but also remember it at some later time. This process depends on the observer’s ability to code or structure the information in an easily remembered form or to mentally or physically rehearse the model’s actions.
• Production: Observers must be physically and/intellectually capable of producing the act. In many cases the observer possesses the necessary responses. But sometimes, reproducing the model’s actions may involve skills the observer has not yet acquired. It is one thing to carefully watch a circus juggler, but it is quite another to go home and repeat those acts.
• Motivation: In general, observers will perform the act only if they have some motivation or reason to do so. The presence of reinforcement or punishment, either to the model or directly to the observer, becomes most important in this process.
5. Attention and retention account for acquisition or learning of a model’s behavior; production and motivation control the performance.
6. Human development reflects the complex interaction of the person, the person’s behavior, and the environment. The relationship between these elements is called reciprocal determinism. A person’s cognitive abilities, physical characteristics, personality, beliefs, attitudes, and so on influence both his or her behavior and environment. These influences are reciprocal, however. A person’s behavior can affect his feelings about himself and his attitudes and beliefs about others. Likewise, much of what a person knows comes from environmental resources such as television, parents, and books. Environment also affects behavior: what a person observes can powerfully influence what he does. But a person’s behavior also contributes to his environment.

How Observational Learning Impacts Learning:

Curriculum– Students must get a chance to observe and model the behavior that leads to a positive reinforcement.

Instruction– Educators must encourage collaborative learning, since much of learning happens within important social and environmental contexts.

Assessment–A learned behavior often cannot be performed unless there is the right environment for it. Educators must provide the incentive and the supportive environment for the behavior to happen. Otherwise, assessment may not be accurate.

Documentation production related to web development.

Web design is the skill of creating presentations of content (usually hypertext or hypermedia) that is delivered to an end-user through the World Wide Web, by way of a Web browser or other Web-enabled software like Internet television clients, microblogging clients and RSS readers.

The process of designing Web pages, Web sites, Web applications or multimedia for the Web may utilize multiple disciplines, such as animation, authoring, communication design, corporate identity, graphic design, human-computer interaction, information architecture, interaction design, marketing, photography, search engine optimization and typography.

• Markup languages (such as HTML, XHTML and XML)
• Style sheet languages (such as CSS and XSL)
• Client-side scripting (such as JavaScript)
• Server-side scripting (such as PHP and ASP)
• Database technologies (such as MySQL and PostgreSQL)
• Multimedia technologies (such as Flash and Silverlight)

Web pages and Web sites can be static pages, or can be programmed to be dynamic pages that automatically adapt content or visual appearance depending on a variety of factors, such as input from the end-user, input from the Webmaster or changes in the computing environment (such as the site's associated database having been modified).

With growing specialization within communication design and information technology fields, there is a strong tendency to draw a clear line between web design specifically for web pages and web development for the overall logistics of all web-based services.

Analysis and plan document

Analysis Document

Documentation is used to visually plan the site while taking into account the purpose, audience and content, to design the site structure, content and interactions that are most suitable for the website. Documentation may be considered a prototype for the website – a model which allows the website layout to be reviewed, resulting in suggested changes, improvements and/or enhancements. This review process increases the likelihood of success of the website.

The first step may involve [[information architecture]] in which the content is categorized and the information structure is formulated. The information structure is used to develop a document or visual diagram called a [[site map]]. This creates a visual of how the web pages or content will be interconnected, and may help in deciding what content will be placed on what pages.

In addition to planning the structure, the layout and interface of individual pages may be planned using a [[storyboard]]. In the process of storyboarding, a record is made of the description, purpose and title of each page in the site, and they are linked together according to the most effective and logical diagram type. Depending on the number of pages required for the website, documentation methods may include using pieces of paper and drawing lines to connect them, or creating the storyboard using computer software.

Some or all of the individual pages may be designed in greater detail as a [[website wireframe]], a mock up model or [[comprehensive layout]] of what the page will actually look like. This is often done in a graphic program, or layout design program. The wireframe has no working functionality, only planning, though it can be used for selling ideas to other web design companies.

Design Document

Design document is similar (in a very simplistic way) to traditional print publishing. Every [[website]] is an information display container, just as a [[book]] is a container; and every web page is like the page in a book. However, web design uses a [[framework]] based on [[digital code]] and [[display technology]] to construct and maintain an environment to distribute information in multiple formats. Taken to its fullest potential, web design is undoubtedly the most sophisticated and increasingly complex method to support communication in today's world.

For the typical web sites, the basic aspects of design are:

* The ''content:'' the substance, and information on the site should be relevant to the site and should target the area of the public that the website is concerned with.

* The ''usability:'' the site should be user-friendly, with the interface and navigation simple and reliable.

* The ''appearance:'' the graphics and text should include a single style that flows throughout, to show consistency. The style should be professional, appealing and relevant.

* The ''visibility:'' the site must also be easy to find via most, if not all, major search engines and advertisement media.

A web site typically consists of text and [[images]]. The first page of a web site is known as the [[Home page]] or Index. Some web sites use what is commonly called a Splash Page. Splash pages might include a welcome message, language or region selection, or disclaimer. Each web page within a web site is an [[HTML]] file which has its own [[Uniform Resource Locator|URL]]. After each web page is created, they are typically linked together using a navigation menu composed of [[hyperlinks]]. Faster browsing speeds have led to shorter attention spans and more demanding online visitors and this has resulted in less use of Splash Pages, particularly where commercial web sites are concerned{{Fact|date=April 2009}}.

Once a web site is completed, it must be published or uploaded in order to be viewable to the public over the [[internet]]. This may be done using an [[FTP client]]. Once published, the [[web master]] may use a variety of techniques to increase the traffic, or hits, that the web site receives. This may include submitting the web site to a [[Web search engine|search engine]] such as [[Google]], [[Bing (search engine)|Bing]] or [[Yahoo]], exchanging links with other web sites, creating affiliations with similar web sites, etc.

===Multidisciplinary requirements===
Web site design crosses [[Interdisciplinary|multiple disciplines]] of multiple [[information systems]], [[information technology]] and [[communication design]]. The web site is an [[information system]] whose components are sometimes classified as [[front-end and back-end]]. The observable [[web content|content]] (e.g. [[page layout]], [[user interface]], [[graphics]], [[writing|text]], [[sound|audio]]) is known as the front-end. The back-end comprises the organization and efficiency of the source code, invisible scripted functions, and the server-side components that process the output from the front-end. Depending on the size of a Web development project, it may be carried out by a multi-skilled individual (sometimes called a [[web master]]), or a [[project manager]] may oversee [[collaborative design]] between group members with specialized skills.

===Issues===
By its very nature, web design is conflicted, involving rigid [[technical]] conformance and personal [[creative]] balance. Rapid technological change complicates acquiring and deploying suitable resources to maintain web presence.

===Environment===
Layout is a double edged sword: on the one hand, it is the expression of a framework that actively shapes the web designer. On the other hand, as the designer adapts that framework to projects, layout is the means of [[content delivery]]. [[Publishing]] a web engages [[communication]] '''throughout''' the [[Production, costs, and pricing|production]] process as well as '''within''' the [[product (business)|product]] created. [[Publication]] implies adaptation of culture and content standards. Web design incorporates multiple intersections between many layers of technical and social understanding, demanding [[creative]] direction, design element [[structure]], and some form of [[social]] [[organization]]. Differing goals and methods resolve effectively in successful deployment of education, software and team management during the design process. However, many competing and evolving [[platforms]] and [[Desktop environment|environments]] challenge acceptance, completion and continuity of every [[design]] product.

===Collaboration===
Early Web design was less integrated with companies’ [[advertising campaign]]s, [[commercie|customer transaction]]s, [[extranet]]s, [[intranet]]s and [[social network]]ing. Web sites were seen largely as static [[online]] [[brochure]]s or database connection points, disconnected from the broader scopes of a business or project. Many Web sites are still disconnected from the broader project scope. As a result, many Web sites are needlessly difficult to use, indirect in their way of communicating, and suffer from a 'disconnected' or ineffective bureaucratic [[information architecture]].

===Form versus function===
A [[web developer]] may pay more attention to how a page looks while neglecting other [[copywriting]] and [[search engine optimization]] functions such as the readability of text, the ease of navigating the site, or how easily the visitors are going to find the site. As a result, the designers may end up in disputes where some want more decorative graphics at the expense of [[keyword (internet search)|keyword]]-rich text, [[bullet list]]s, and [[text link]]s. Assuming a [[false dichotomy]] that form and function are mutually exclusive overlooks the possibility of integrating multiple disciplines for a collaborative and [[synergistic]] solution. In many cases [[form follows function]]. Because some graphics serve [[communication]] purposes in addition to [[aesthetic]]s, how well a site works may depend on the [[graphic design]] ideas as well as the [[professional writing]] considerations.

When using a lot of graphics, a web page can load slowly, often irritating the user. This has become less of a problem as the internet has evolved with [[high-speed internet]] and the use of [[vector graphics]]. However there is still an ongoing engineering challenge to increase [[Bandwidth (computing)|bandwidth]] and an artistic challenge to minimize the amount of graphics and their [[file size]]s. This challenge is compounded since increased bandwidth encourages more graphics with larger file sizes.

When faced with a large database and many requirements, a design group may throw far too much information for a server to manage. Alternative technology or additional structure (even another server or site) may be required to fit the demand.

===Layout===
Layout refers to the dimensioning of content in a device display, and the delivery of media in a content related stream. Web design layouts result in visual content frameworks: these frameworks can be fixed, they can use units of measure that are relative, or they can provide fluid layout with proportional dimensions. The [[deployment flowchart]] (a useful tool on any design project) should address content layout. Many units of measure exist, but here are some popular dimension formats:

* Pixel measure results in [[fixed]] or static content

* Em measure results in [[proportional]] content that is relative to font-size

* Percent measure results in [[fluid]] content that shrinks and grows to "fit" display windows

Proportional, liquid and hybrid layout are also referred to as dynamic design. [[Hybrid]] layout incoroprates any combination of fixed, proportional or fluid elements within (or pointing to) a single page. The hybrid web design framework is made possible by [[digital]] [[internet]] [[conventions]] generally proscribed by the [[W3C]]. If any layout does not appear as it should, it is very likely that it does not conform to standard design principles, or that those standards conflict with standard layout elements. Current knowledge of standards is essential to effective hybrid design.

The earliest web pages used fixed layouts without exception. In many business pages fixed layouts are preferred today as they easily contain static tabled information. Fixed layout enforces device display convention, as viewers must set their display to at least a certain width to easily view content. This width can include display of corporate logos, cautions, advertisements and any other target content. Design frameworks for fixed layout may need to include coding for multiple display devices.

Hybrid design maintains most static content control, but is adapted to textual publishing, and for readers, to conventional ([[printed]]) display. Hybrid layouts are generally easy on the eye and are found on most sites that distribute traditional images and text to readers. For some sites, hybrid design makes an otherwise cold text column appear warm and balanced. A good example of hybrid layout is [[Wordpress]], where liquid design is now optional, and movie and auditory media is stretching the envelope.

Fluid design is useful where content is delivered to an 'unknown device' population. Appropriate liquid [[code]] displays images, text and spaces proportional to display size. Someone with a handheld can see view and interact with the same content as someone using a large desktop monitor. Fluid display is the future for most layout projects, but let's consider obstacles to this current direction.

A note here on space and layout is important. As W3C conventions evolve, the use of design "space" is becoming less static and more fluid in its potential. The result is that old layouts look ... old. In dealing with font layout, even expressed as ems, a static core cannot be escaped and often anchors most page content. However, as new standards are adopted by device manufacturers, viewers notice a wider spectrum of content and a greater interaction between and through content. For the World Wide Web Consortium drawing up tomorrows layout conventions, new media types and methods are increasingly in the mix. It is a true double axiom that 'content is all about layout', and 'layout is all about content'. We could say that layout is what designers squeeze into available technology - content is the culture manifested in the layout. "Space' is the envelope holding layout and content together. Space communicates style (layout appearance) to the target population. Understanding how to adapt space to this layout-content relationship is essential to web design. Every design's survivability depends on its sensitivity to emerging technology (within the cultures that its framework is servicing), and immediate acceptance depends on the layout or presentation of that content. On every page, no content is more susceptible to changes and variations in standards, than space. While the professional designer casually admits that 90% of design code is used to adapt space, most of his current work deploys [[spatial manipulations]] being used to actively reshape Internet communication.

Conceptual barriers to adequate layout abound! Presently layout is challenged by conflicting convention that makes it impossible to fit liquid and hybrid layout to the bottom corners of a display. Simply put, [[display device]] manufactures use the top right and/or left corners to display content. For non-standard equipment, setting custom fixed layout to their device is still seen by some businesses as a means of increasing revenue, as they can [[sell]] a 'unique' display. This business approach, domainating the digital market at the end of the last century, is not so useful today. However, some would claim a decade behind schedule, [[CSS3]] and [[HTML5]] are finally taking the four penultimate display reference point seriously. Just in time for 3 dimensional [[Euclidean vector|vector]] layout to tangle designers' [[templates]] in conundrums!

A common misconception among designers is to assume their layout is liquid because initial [[space]] and [[text]] container widths are in percents. However, their 'liquid' framework, while adhering to focused conventions, failed to manage graphic content. A subsequent edit placing a large image on the page, destroys the page [[appearance]]. When managing a design framework, it is critical that layout address content, convention and user interaction.

===Device===
On the web the designer has no control over several factors, including the size of the browser window, the [[web browser]] used, the input devices used ([[operating system]], [[Mouse (computing)|mouse]], [[touch screen]], [[voice command]], [[text]], [[teletype]], [[cell phone]], or other [[hand-held]]), and the size, design, and other characteristics of the fonts that users have available (installed) and enabled (preference) on their device. Unique manufacture and conflicting device contentions are further complicated by varying browser interpretations of the same content, and some content automatically can trigger browser changes. Web designers do well to study and become proficient at removing competitive device and software [[markup]] so that web pages display as they are coded to display. Eric Meyers, a well known educator and developer, is one of many resources who have spear-headed HTML [[reset]] coding. While they cannot yet leave one local environment to control another, web designers can adjust target environments to remove much common markup that alters or corrupts their web content.

Because device manufacturers are highly protective of their patent markup, Meyers and others caution that reset remains ''experimental''.

===Tableless Web design===

{{Main|Tableless web design}}

When [[Netscape Navigator]] 4 dominated the browser market, the popular solution available for designers to lay out a Web page was by using tables. Often even simple designs for a page would require dozens of tables nested in each other. Many [[web templates]] in [[Adobe Dreamweaver|Dreamweaver]] and other [[WYSIWYG]] editors still use this technique today. Navigator 4 didn't support [[Cascading Style Sheets|CSS]] to a useful degree, so it simply wasn't used.

After the [[browser wars]] subsided, and the dominant browsers such as [[Internet Explorer]] became more W3C compliant, designers started turning toward CSS as an alternate means of laying out their pages. CSS proponents say that tables should be used only for tabular data, not for layout. Using CSS instead of tables also returns HTML to a [[semantic markup]], which helps [[bots]] and search engines understand what's going on in a web page. All modern [[Web browser]]s support CSS with different degrees of [[Comparison of layout engines (CSS)|limitations]].

However, one of the main points against CSS is that by relying on it exclusively, control is essentially relinquished as each browser has its own quirks which result in a slightly different page display. This is especially a problem as not every browser supports the same subset of CSS rules. There are the means to apply different styles depending on which browser and version are used but incorporating these exceptions makes maintaining the style sheets more difficult as there are styles in more than one place to update.

For designers who are used to table-based layouts, developing Web sites in CSS often becomes a matter of trying to replicate what can be done with tables, leading some to find CSS design rather cumbersome due to lack of familiarity. For example, at one time it was rather difficult to produce certain design elements, such as vertical positioning, and full-length footers in a design using absolute positions. With the abundance of CSS resources available online today, though, designing with reasonable adherence to standards involves little more than applying CSS 2.1 or CSS 3 to properly structured markup.

These days most modern browsers have solved most of these quirks in CSS rendering and this has made many different CSS layouts possible. However, some people continue to use old browsers, and designers need to keep this in mind, and allow for graceful degrading of pages in older browsers. Most notable among these old browsers is Internet Explorer 6, which, according to some web designers,{{Who|date=June 2009}} is becoming the new Netscape Navigator 4 — a block that holds the World Wide Web back from converting to CSS design. However, the W3 Consortium has made CSS in combination with XHTML the standard for web design.

Week 3

Web project management

The skills required by a group of web developers.
Skills required include:
-Must have experience with PHP5 and object oriented design.
-Must have experience with HTML, CSS, and advanced javascript (ExtJS, jQuery). -Must be able to write HTML manually.
-Must have experience with Subversion or some versioning control. -Strong organizational skills required. -Must have the ability to juggle numerous projects at once and be able to give detailed status updates. Must be willing to work in a team environment.
- Responsibilities of web project manager.

Group structure for web developers

A Good Web Development Team

As always, people are the key to success.

Whether they are used as a marketing tools or for eCommerce business, Web sites are more than just an addition to the corporate presence. They are a necessity. In many instances, a site can make-or-break a company's image. Visitors want simple, yet interesting sites with appealing graphics and user interaction. However, if the design is too busy or the pages take too long to download, you will lose potential clients. This is why a good Web development team is crucial to your business.
March 7, 2001
If your business uses its Web site as a marketing tool to present products and services, you may only need a static site that will be updated periodically. Your Web team may consist of a single skilled Web master. Just be careful of putting too much stock in one individual. A long-term absence could be catastrophic to the project. Other sites may require weekly, daily, and in some cases, up-to-the-minute updates requiring round the clock attention. This team may consist of multiple system administrators, Web application programmers, Web masters, and project managers.
For the sake of this article, I am going to discuss a team compiled for a small to medium-sized eCommerce company, and I offer this scheme not as a rule, rather as a guide.

Project Manager:
The project manager is the key to a successful team. He or she is responsible for more than just the site. They are responsible for the team's individual members, communication and follow-through. This position does not require specific programming or networking skills, however, a technical background is preferable. The project manager will be representing the team, and must be able to speak intelligently. One of their most important tasks is to gather the requirements of the site and understand the expectations of the client. They must understand the scope of the project to correctly convey the ideas to the team members. Good oral and written communication skills are essential, as are time management and organizational skills. They must possess the ability to lead team members, manage resources and be poised and confident to speak to management and clients regarding the progress of the team. Generally speaking, three to five years of project management experience is a good minimum requirement for this position.
Web Master:
A Web master is more than just someone who knows HTML and a few scripts. This person must also have good written skills, should be responsible for grammar and spelling, and will work closely with the client and Project Manager to determine the content of the site and layout. Depending on the size of the site, the Web master may also be responsible for graphic design. Knowledge of Flash animation, Adobe Photoshop, as well as VB Scripting is always desirable. Should a designer be available, the Web master should be the liaison to the team. A successful Web master must also be familiar with the operating system, and the internet server applications that run on the server. The two most common OS's are Windows NT/2000 running Internet Information Server, and Unix running Apache Web Server. A third up-and-comer is the Linux/Apache combination. The required skill set will depend on your environment. An understanding of SQL or another database engine, and how it communicates to the application server is desirable. Three to five years of experience is typical for a qualified Web master.
Application Developer:
The Web Applications Developer is responsible for developing server side functionality for Web-based applications. This involves working with all aspects of the server and database. Common Internet programming languages include PERL, CGI, ActiveX, ASP, and Java, among others. Experience with IP networks, database development and an understanding of the operating system are essential. They must be able to work with the project manager to analyze and interpret the client requirements and recommend solutions, so strong problem-solving and analytical skills are essential. Depending on the complexity of the applications, your developer should have anywhere from 2-4 years experience.
Systems Administrator
A good SysAdmin can make the difference in a successful site. The site is only good if it can operate in a secure and stable environment. System administrators are generally responsible for building, maintaining and securing the Web, application and database servers in the Internet architecture. A Microsoft Certified Systems Engineer (MCSE) with a background in Internet Information Server has the appropriate skill set for system administration in a Microsoft environment. If your environment runs on Unix, an individual with firewall and Apache Web server background, along with 4-6 years of network administration experience, should possess the necessary skills to complete any Web team.
Many times, system administration is outsourced. If you are a small company, you may not have the equipment necessary to host your own servers and provide 24/7 reliability. You have to account for backups, UPS, site monitoring, redundancy, server maintenance, security, and overall reliability. Sometimes it is more feasible to contract out to a hosting service like Virtualis or eHost.
Graphic Designer (if available)
As I mentioned before, Web masters often have the basics of graphic design. However, if you have the resources, a graphics designer will greatly enhance your Web development team. The designer can assist in the creation of images and other graphical needs of the development project. You should expect a minimum of a four-year degree in fine arts or related field, and least two years of graphical design experience in a Web environment. Additionally, they should be proficient with the latest multimedia tools. Adobe Photoshop and Illustrator are recognized as the industry standard. Knowledge of layout, composition and color theory as well as experience with HTML is a plus.
Project Management
I said earlier that the Project Manager is responsible for managing the team's activities, especially communication among the team members. A solid plan is critical to accomplishing this task. The plan must be detailed, straightforward, and easy to understand. Regular project updates should occur so the members may interact and discuss various tasks in depth. Keep in mind, just as the project manager must provide the medium to communicate openly, all team members have a responsibility to be actively involved in the project. Most importantly, involve the members in the planning from the beginning. If not, you run the risk of team members not understanding the scope and the required result. A hardcopy of the plan should be readily available to each member, and displayed in an easy to reach area. I recommend Microsoft Project 2000 as an in-depth tool in the creation of the project plan. It allows you to create a calendar, Gantt chart, flow charts, and to track resources, plus other valuable features.
In closing, I want to stress the importance of communication among the members of any project team. Without clear guidance and leadership, project failure is inevitable. Without constant communication, details will be missed and tasks will be incomplete or wrong. In the end, the client will lose potential profits and the team will lose potential clients.

Phases and stages of work for web development

The Web Site Design and Development Process

There are numerous steps in the web site design and development process. From gathering initial information, to the creation of your web site, and finally to maintenance to keep your web site up to date and current.

The exact process will vary slightly from designer to designer, but the basics are generally the same.

Phase One: Information Gathering

The first step in designing a successful web site is to gather information. Many things need to be taken into consideration when the look and feel of your site is created.

This first step is actually the most important one, as it involves a solid understanding of the company it is created for. It involves a good understanding of you – what your business goals and dreams are, and how the web can be utilized to help you achieve those goals.

It is important that your web designer start off by asking a lot of questions to help them undersand your business and your needs in a web site.

Certain things to consider are:

• Purpose
  What is the purpose of the site? Do you want to provide information, promote a service, sell a product… ?
• Goals
  What do you hope to accomplish by building this web site? Two of the more common goals are either to make money or share information.
• Target Audience
  Is there a specific group of people that will help you reach your goals? It is helpful to picture the “ideal” person you want to visit your web site. Consider their age, sex or interests – this will later help determine the best design style for your site.
• Content
  What kind of information will the target audience be looking for on your site? Are they looking for specific information, a particular product or service, online ordering…?

Phase Two: Planning

Using the information gathered from phase one, it is time to put together a plan for your web site. This is the point where a site map is developed.

The site map is a list of all main topic areas of the site, as well as sub-topics, if applicable. This serves as a guide as to what content will be on the site, and is essential to developing a consistent, easy to understand navigational system. The end-user of the web site – aka your customer – must be kept in mind when designing your site. These are, after all, the people who will be learning about your service or buying your product. A good user interface creates an easy to navigate web site, and is the basis for this.

During the planning phase, your web designer will also help you decide what technologies should be implemented. Elements such as interactive forms, ecommerce, flash, etc. are discussed when planning your web site.

Phase Three: Design

Drawing from the information gathered up to this point, it’s time to determine the look and feel of your site.

Target audience is one of the key factors taken into consideration. A site aimed at teenagers, for example, will look much different than one meant for a financial institution. As part of the design phase, it is also important to incorporate elements such as the company logo or colors to help strengthen the identity of your company on the web site.

Your web designer will create one or more prototype designs for your web site. This is typically a .jpg image of what the final design will look like. Often times you will be sent an email with the mock-ups for your web site, while other designers take it a step further by giving you access to a secure area of their web site meant for customers to view work in progress.

Either way, your designer should allow you to view your project throughout the design and development stages. The most important reason for this is that it gives you the opportunity to express your likes and dislikes on the site design.

In this phase, communication between both you and your designer is crucial to ensure that the final web site will match your needs and taste. It is important that you work closely with your designer, exchanging ideas, until you arrive at the final design for your web site.

Then development can begin…

Phase Four: Development

The developmental stage is the point where the web site itself is created. At this time, your web designer will take all of the individual graphic elements from the prototype and use them to create the actual, functional site.

This is typically done by first developing the home page, followed by a “shell” for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas.

Elements such as interactive contact forms, flash animations or ecommerce shopping carts are implemented and made functional during this phase, as well.

This entire time, your designer should continue to make your in-progress web site available to you for viewing, so that you can suggest any additional changes or corrections you would like to have done.

On the technical front, a successful web site requires an understanding of front-end web development. This involves writing valid XHTML / CSS code that complies to current web standards, maximizing functionality, as well as accessibility for as large an audience as possible.

This is tested in the next phase…

Phase Five: Testing and Delivery

At this point, your web designer will attend to the final details and test your web site. They will test things such as the complete functionality of forms or other scripts, as well last testing for last minute compatibility issues (viewing differences between different web browsers), ensuring that your web site is optimized to be viewed properly in the most recent browser versions.

A good web designer is one who is well versed in current standards for web site design and development. The basic technologies currently used are XHTML and CSS (Cascading Style Sheets). As part of testing, your designer should check to be sure that all of the code written for your web site validates. Valid code means that your site meets the current web development standards – this is helpful when checking for issues such as cross-browser compatibility as mentioned above.

Once you give your web designer final approval, it is time to deliver the site. An FTP (File Transfer Protocol) program is used to upload the web site files to your server. Most web designers offer domain name registration and web hosting services as well. Once these accounts have been setup, and your web site uploaded to the server, the site should be put through one last run-through. This is just precautionary, to confirm that all files have been uploaded correctly, and that the site continues to be fully functional.

This marks the official launch of your site, as it is now viewable to the public.

Phase Six: Maintenance

The development of your web site is not necessarily over, though. One way to bring repeat visitors to your site is to offer new content or products on a regular basis. Most web designers will be more than happy to continue working together with you, to update the information on your web site. Many designers offer maintenance packages at reduced rates, based on how often you anticipate making changes or additions to your web site.

If you prefer to be more hands on, and update your own content, there is something called a CMS (Content Management System) that can be implemented to your web site. This is something that would be decided upon during the Planning stage. With a CMS, your designer will utilize online software to develop a database driven site for you.

A web site driven by a CMS gives you the ability to edit the content areas of the web site yourself. You are given access to a back-end administrative area, where you can use an online text editor (similar to a mini version of Microsoft Word). You’ll be able to edit existing content this way, or if you are feeling more adventurous, you can even add new pages and content yourself. The possibilities are endless!

It’s really up to you as far as how comfortable you feel as far as updating your own web site. Some people prefer to have all the control so that they can make updates to their own web site the minute they decide to do so. Others prefer to hand off the web site entirely, as they have enough tasks on-hand that are more important for them to handle directly.

That’s where the help of a your web designer comes in, once again, as they can take over the web site maintenance for you – one less thing for you to do is always a good thing in these busy times!

Other maintenance type items include SEO (Search Engine Optimization) and SES (Search Engine Submission). This is the optimization of you web site with elements such as title, description and keyword tags which help your web site achieve higher rankings in the search engines. The previously mentioned code validation is something that plays a vital role in SEO, as well.

There are a lot of details involved in optimizing and submitting your web site to the search engines – enough to warrant it’s own post. This is a very important step, because even though you now have a web site, you need to make sure that people can find it!

Week 2

Introduction to website and its relation to education.
Internet adalah hasil gabungan kecanggihan komputer dan teknologi komunikasi yang digabungkan dalam satu jaringan yang meliputi seluruh dunia. Tujuan utama rangkaian kerja (network) global ini ialah memudahkan pertukaran dan perkongsian maklumat serta perhubungan dalam pelbagai bidang. Capaian internet dimanfaatkan oleh seluruh masyarakat tanpa mengira batasan geografi dan budaya. Pelbagai aplikasi Internet seperti emel, internet relay chat (IRC), on-line forum, laman web, papan buletin, pangkalan data dan komunikasi masa nyata (real time) digunakan menerusi rangkaian Internet. Oleh itu, pengalaman dalam penggunaan IT dan internet dalam kehidupan harian seharusnya diintegrasikan kepada dunia pendidikan bagi menyediakan pengalaman pembelajaran sebenar kepada pelajar. Ciri interaktif dan fleksibel yang disediakan menjadi pilihan utama kenapa laman web dilihat sebagai alternatif terkini proses penyampaian pengajaran. Faizah dan Rohayah (2003), dalam kajiannya tentang pembelajaran kendiri di antara berasaskan buku dan pembelajaran berasaskan web (web based learning) mendapati bahawa lebih 70% subjek kajian dapat meningkatkan pencapaian melalui web. Ini menunjukkan bahawa penggunaan laman web sebagai medium pengajaran semakin mendapat tempat di kalangan pendidik alaf ini.

Exposure towards the usage of web for teaching and learning.
Dalam pendidikan formal, proses pengajaran dan pembelajaran (P&P) haruslah diberi penekanan yang sewajarnya. Proses yang disinonimkan dengan pengajaran dan pembelajaran bilik darjah melibatkan guru dan pelajar ini sememangnya memerlukan suatu usaha berterusan ke arah menyediakan pendidikan komprehensif dan efektif terhadap segala isi pelajaran yang disampaikan. Proses pengajaran juga dikenali sebagai pedagogi dalam istilah pendidikan, iaitu merujuk kepada kajian tentang kaedah dan prinsip pengajaran. Oleh itu, proses P&P perlu diberi ‘sentuhan’ yang dapat menarik minat para pelajar agar setiap isi pelajaran yang disampaikan memberi input maksimum terhadap kefahaman mereka.
Koh Boh Boon (1992) menyatakan bahawa proses pengajaran-pembelajaran di sekolah melibatkan dua pihak iaitu guru dan murid. Justeru, pengajaran yang ideal haruslah membawa kesan penuh ke atas pembelajaran yang berlaku. Keadaan di mana para pelajar tidak memberi tumpuan dalam peroses P&P adalah wujudnya pertentangan minat mereka disebabkan kebergantungan guru sepenuhnya terhadap kurikulum yang telah ditentukan untuk diajar kepada para pelajar diperingkat-peringkat tertentu sehingga usaha para guru tertumpu kepada menghabiskan sukatan pelajaran dan mengabaikan proses pengajaran yang sepatutnya (Atan Long, 1982). Justeru, proses pengajaran memerlukan persediaan yang mantap oleh seorang pendidik sebelum terlibat secara langsung dalam proses P&P di sekolah. Menurut Zawawi Hj. Ahmad (1992) pengajaran seorang guru bukanlah semata-mata dengan hanya menyampaikan kandungan pelajaran yang dikuasainya itu kepada muridnya. Hal ini kerana, sekiranya seorang guru hanya berbuat demikian maka langkah tersebut belum lagi menjamin prestasi pengajaran yang tinggi. Dalam pada itu, konsep ‘pengajaran guru dan pembelajaran murid’ menurut beliau lagi merupakan konsep menggunakan pendekatan yang positif bagi menggerakkan motivasi dalaman murid disamping menyampaikan isi pelajaran yang dikuasai oleh seorang guru. Konsep ini juga sebagai suatu usaha bagi menimbulkan rasa perlu murid untuk mengikuti pelajaran dan mereka akan berasa rugi sekiranya tidak dapat mengikuti
pelajaran yang disampaikan.
Sementara itu, Abd.Ghafar Md.Din (2003) mengemukakan proses pengajaran mempunyai ciri-ciri sains kerana ia melibatkan penyelidikan, pemerhatian dan mempunyai rumusan-rumusan sebagaimana bidang sains. Tambah beliau lagi, proses ini juga dianggap sebagai suatu seni kerana seorang guru perlu kreatif agar menjadikan pengajaran lebih menarik dan berkesan. Kemahiran juga amat diperlukan dalam proses pengajaran selain penguasaan ilmu pengetahuan. Oleh itu, proses ini melibatkan latihan sempurna bagi menghasilkan pengajaran yang menarik sekaligus menambah keyakinan seseorang guru.
Justeru, beliau menyifatkan guru sebagai seorang seniman yang berfungsi sebagai seorang pelakon dengan menggunakan pergerakan badan, mimik muka dan tekanan suara yang sesuai bagi memenuhi kesempuranaan proses pengajaran yang dilaksanakan. Sehubungan itu, fokus perlu diberikan sepenuhnya terhadap proses pengajaran serta faktor-faktor yang dapat mempertingkat dan memperkembang ke arah mewujudkan amalan pengajaran guru yang berkesan. Bagi tujuan tersebut kajian berhubung isu proses pengajaran perlu diperhalusi agar ia menjanjikan keberkesanan sistem pendidikan semasa melalui falsafahnya untuk melahirkan generasi seimbang yang cemerlang dalam akademik dan pembangunan insan.

Arus perkembangan semasa menuntut kepada perubahan dari segenap aspek mahupun lapangan kehidupan umum. Perubahan positif merupakan anjakan yang perlu dihasilkan bagi mewujudkan kedinamikan untuk menghadapi cabaran-cabaran baru seiring perkembangan semasa. Justeru, pendidikan masakini perlu kepada pembaharuan bagi merealisasikan proses pembentukan dan pengembangan potensi diri yang patut disalurkan kepada para pelajar. Bagi tujuan tersebut penelitian terhadap aspek pengajaran khususnya dalam bilik darjah menjadi asas pencapaian kecemerlangan akademik buat para pelajar. Dalam pendidikan formal, proses pengajaran menjadi elemen terpenting bagi
mencapai keberkesanan isi pelajaran yang disampaikan. Proses pengajaran berkesan akan hanya dicapai menerusi pendekatan, kaedah dan teknik yang bersesuaian oleh seorang guru untuk mencapai objektif pengajarannya terhadap isi pelajaran yang disampaikan. Hal ini melibatkan kemahiran serta penguasaan penuh guru terhadap pelajaran yang disampaikan. Persediaan mantap berkaitan kemahiran dalam proses pengajaran oleh seorang guru membolehkannya menjalankan proses P&P dengan penuh keyakinan dan semangat tinggi. Dengan demikian, guru akan dapat memberikan sepenuh komitmen dan kesungguhan yang tinggi untuk menyampaikan ilmu pengetahuan kepada para pelajar. Sharifah Alwiah Alsagoff (1983) menyatakan bahawa pengajaran yang berkesan adalah merujuk kepada guru yang dapat membawa pelajar kepada hasil pembelajaran
terakhir yang diinginkannya. Hal ini melibatkan corak pengajaran bersturktur dari segi organisasi bilik darjah serta mementingkan isi pelajaran. Selain itu, ia juga merujuk kepada perihal pengajaran guru yang lebih memusatkan kepada para pelajarnya sehingga mereka tertarik mengikuti aktiviti pembelajaran. Oleh itu, pembentukan proses pengajaran berkesan mempunyai nilai yang berbeza-beza namun ia masih bermatlamat untuk melihat hasil daripada isi pelajaran yang disampaikan.
Mewujudkan proses pengajaran yang berkesan memerlukan kepada komitmen guru sepenuhnya. Ia melibatkan perancangan dan strategi serta kemahiran guru yang padu dalam mengorganisasi proses P&P bilik darjah. Langkah awal dalam membentuk satu proses pengajaran yang berkesan adalah dengan menilai pertindanan domain kognitif, afektif dan psikomotor yang menjadi dasar objektif proses P&P. Guru seharusnya memerlukan segala persediaan yang rapi meliputi pengetahuan dan kemahiran penyampaian isi pelajaran agar membuka minda dan minat pelajar. Dengan itu, terbentuklah suasana pembelajaran yang melibatkan tindak balas positif dan tingkah laku aktif para pelajar.
Selain itu, interaksi sosial guru dan pelajar merupakan sebahagian daripada beberapa faktor ke arah keberkesanan pengajaran. Hubungan dua hala (guru-pelajar) yang baik perlu diwujudkan oleh setiap guru agar masalah berkaitan pelajar dapat diselesaikan seterusnya para pelajar dapat menumpukan sepenuh perhatian terhadap proses P&P. Adalah menjadi keutamaan dalam proses pengajaran untuk mengelakkan daripada berlakunya penyertaan pasif dikalangan pelajar disebabkan kurangnya perhatian dan fokus serta ketidakselesaan
mereka semasa mengikuti proses P&P. justeru, guru berperanan memberikan motivasi agar para pelajar dapat mengikuti segala maklumat pengetahuan yang disampaikan sepenuhnya. Penggunaan bahan-bahan pengajaran yang bersesuaian dengan kandungan pelajaran turut menyumbang kepada keberkesanan proses pengajaran. Menurut Atan Long (1982) bahawa sesuatu alat penyampaian terutama alat yang baru bagi pengalaman pelajar akan dapat menimbulkan minat dan seterusnya menggerakkan pelajar-pelajar untuk belajar. Sehubungan itu, penyediaan bahan pengajaran yang bertepatan dengan isi pelajaran akan membawa dimensi baru dalam pembelajaran para pelajar bagi meningkatkan lagi kefahaman mereka. Seiring perkembangan semasa, proses pengajaran memerlukan satu usaha yang dapat menjana perkembangan proses pembelajaran pelajar. Kedinamikan proses pengajaran melalui daya kreativiti mahupun penggunaan teknologi masakini menjadi asas ke arah melahirkan amalan proses pengajaran berkesan. Seterusnya hal ini akan menjadikan proses P&P di sekolah dapat memberi sumbangan sepenuhnya kepada pencapaian kecemerlangan para pelajar serta memperkasakan lagi sistem pendidikan sedia ada.

Concept of web development.

Web development is a broad term for any activity to developing a web site for the World Wide Web or an internet. This can include e-commerce business development, web design, web content development, client-side/server-side scripting, and web server configuration. However, among web professionals, "web development" usually refers only to the non-design aspects of building web sites, e.g. writing markup and coding. Web development can range from developing the simplest static single page of plain text to the most complex web-based internet applications, electronic businesses, or social network services.

For larger businesses and organizations, web development teams can consist of hundreds of people (web developers). Smaller organizations may only require a single permanent or contracting webmaster, or secondary assignment to related job positions such as a graphic designer and/or Information systems technician. Web development may be a collaborative effort between departments rather than the domain of a designated department.

Introduction to the concept of portal.