Recently Updated Pages
Restoring a XAMPP Project from Backup
Restoring a XAMPP Project from Backup recreates both the website files and the MySQL database. Wo...
Moving a XAMPP Project to Another Computer
Moving a XAMPP project requires a verified backup of both the project files and its database. Pre...
Backing Up a XAMPP Project
A working XAMPP project normally has two separate parts: website files inside htdocs and data st...
HTML Forms
Forms collect user input. Accessible forms connect every control to a visible label and provide i...
HTML Lists and Tables
Lists organise related items. Tables represent information with meaningful row and column relatio...
HTML Links and Images
Links support navigation and images communicate visual information. Both need meaningful text alt...
Presenting PHP Data with JavaScript Charts
PHP can query and process database data, then pass a small prepared result to JavaScript for pres...
Updating Interfaces Accessibly
Dynamic interfaces must communicate changes without removing keyboard access or context. Status m...
Filtering and Sorting Displayed Data
Client-side filtering can help users explore data already present in the browser. Database filter...
Handling Events and User Input
Events allow a script to respond to user actions. <label for="team-filter">Filter teams</label> <...
Connecting JavaScript and Selecting Elements
JavaScript can add interaction to an HTML interface. Keep the page usable when supporting scripts...
Styling Tables, Navigation and Data Displays
Data interfaces should prioritise interpretation over decoration. .table-wrap { overflow-x: auto;...
Styling Forms and Validation Messages
Form styling should make labels, controls, instructions and errors easy to identify. .form-group ...
Accessible Colour, Typography and Focus
Accessible styling supports perception, reading and keyboard use. body { color: #1f2933; back...
Responsive Layouts with Flexbox and Grid
Responsive layouts adapt to available space rather than one device size. Flexbox navigation .navi...
CSS Box Model and Spacing
Every element is a box made from content, padding, border and margin. *, *::before, *::after { ...
CSS Selectors, Classes and Reusable Rules
Selectors identify the HTML elements a rule styles. body { margin: 0; } h1 { color: #123f73; } .c...
Connecting a CSS Stylesheet
CSS controls presentation while HTML provides structure. Connect the file Create css/style.css, ...
Creating a User Database and Table Using SQL
A login system needs a users table that can identify accounts, store password hashes and enforce ...
Creating a Navigation Menu Based on User Roles
Role-aware navigation shows users the actions available to them. It improves usability, but serve...