Skip to main navigationSkip to main content
The University of Southampton

PSYC3058 Project-Based Introduction to Web Programming for Behaviour Researchers

Module Overview

This module adopts a project-based approach.  Through building the first project, the basic rules and syntax of the five web technologies (HTML5, CSS, PHP, MySQL, and JavaScript) are gradually introduced as they are used in the project.  Subsequent projects will consolidate acquired skills and develop more advanced skills.

Aims and Objectives

Module Aims

1. Demonstrate how to integrate the five technologies in web applications by building psychology-related research tasks (e.g., a survey, an experimental task). 2. Enable students to set up their own computer-based behaviour research using a local web server installed on their computers.

Learning Outcomes

Learning Outcomes

Having successfully completed this module you will be able to:

  • the relationships between a (research) task and web design
  • the basics of each of the five main technologies in web programing (i.e., HTML5, CSS, JavaScript, PHP, and MySQL)
  • how to apply and integrate the technologies in web applications


1. Introduction and preparations (A1 - A3) Project 1: Server-based MUQ Web Application 2. Index page; HTML -- mandatory and text tags/elements, entities, form and input, box model, comments, validation; CSS -- style sheets, style declarations (e.g., font, size, alignment, color, margin, padding, border), comments, validator. 3. Welcome page and modularisation; HTML -- item lists, id; CSS -- height/width, containing block, position, margin, min-height; PHP -- basics, echo, print, functions (e.g., include, require), variables, if-else construct, mingling with HTML, comments, validator. 4. Visible Part 1 of MUQ; HTML -- table, drop-down list, div; CSS -- pseudo-class; PHP -- arrays, $_GET[], $_POST[], for loops, comparison operators, concatenating assignment operator, user defined functions, comments, validator 5. Invisible Part 1 of MUQ; web security (validation and sanitisation); PHP -- $_SERVER['REQUEST_METHOD'], isset(), filter_var(), filter_var_array(), pre-defined filters, var_dump(), array_push(), session_start(), $_SESSION[], array_fill() 6. Part 2 of MUQ; data handling; HTML -- radio button; PHP -- foreach construct, header() 7. Data storage; MySQL -- create a database, create a table, define variables, data types, validation; PHP -- mysqli_connect(), mysqli_close(), error control operator, constants, mysqli_query(),define(), 8. Record and debriefing page; PHP -- implode(), date(), time(), mysqli_insert_id(); MySQL -- INSERT query; phpMyAdmin Project 2: JavaScript-enabled MUQ Web Application 9. JavaScript -- DOM and objects, methods and properties, DOM events and event handlers, comments, validator, functions, variables, arrays, length property, fill(), join(), push(), control structures (for, if-else), operators, alert(), write(), innerHTML, getElementById() 10. MUQ Parts 1 and 2; clent-side validation, getElementsByName(), value property, toString(), submit(), Project 3: An Experimental Task 11. Introduction of the task and planning 12. Scripting the task; JavaScript -- custom-defined shuffle(), timing methods and events, measuring response times, onkeydown event, key property, search()

Learning and Teaching

Teaching and learning methods

• Lecture in class • e-tutorials via PowerPoint slides • Q&A workshops

Independent Study128
Total study time150


Assessment Strategy

For the referral assessments, unless the Special Considerations and/or Exams Boards recommend otherwise, the module will be redeemed by completing all required coursework assignments and a supplementary exam. Component marks for coursework and research participation will be carried forward.


MethodPercentage contribution
Exam  (1.5 hours) 30%
Homework/Coursework 69%
Research Participation 1%


MethodPercentage contribution
Coursework assignment(s) 70%
Exam 30%

Repeat Information

Repeat type: Internal & External

Share this module Share this on Facebook Share this on Twitter Share this on Weibo

We use cookies to ensure that we give you the best experience on our website. If you continue without changing your settings, we will assume that you are happy to receive cookies on the University of Southampton website.