Direct instruction, active learning and project-based learning will be the main teaching and learning strategies used in this course module. Group discussions will be held in order to encourage reflection on the topic.
Assessments will be carried out by means of practical work, project work and continuous assessment.
Module Aim:
The aim of this module is to give students an ability to design a responsive web site using HTML and CSS code with a text editor and/or a WYSIWYG editor.
In doing so the students will display knowledge of integrating video and photo files on the site along with showcasing online marketing techniques. Video formats that work in tandem with web technologies will also be explored.
Learning Outcomes
On successful completion of this module the learner should be able to:
LO1
Combine HTML and CSS code in order to design a website.
LO2
Produce video content specifically for online platforms.
LO3
Differentiate between various WYSIWYG programs and text editors.
LO4
Develop a responsive web page that will work across multiple devices.
LO5
Value and display online-marketing techniques.
Pre-requisite learning
Module Recommendations
This is prior learning (or a practical skill) that is recommended before enrolment in this module.
No recommendations listed
Incompatible Modules
These are modules which have learning outcomes that are too similar to the learning outcomes of this module.
No incompatible modules listed
Co-requisite Modules
No Co-requisite modules listed
Requirements
This is prior learning (or a practical skill) that is mandatory before enrolment in this module is allowed.
No requirements listed
Module Content & Assessment
Indicative Content
Introduction & planning a website
Topics to include: Protocols and standards. Routing. IP addresses, accessibility, principles of graphic design and colour theory. Defining the target audience.
HTML Programming
The history of HTML (different versions of HTML/current standard). HTML syntax . HTML elements. Setting up a folder structure. HTML for building site content. Introduction to WYSIWYG software and text editors. Elements of a basic HTML page. Tables. Inserting photo, video and audio. Linking (externally & internally). Comments and organising code. Hierarchy with headers. Page structure with tables. Page structure with Div’s. Accessability in web design. Introduction to CSS. Cross-over between HTML & CSS. Completing a page design with HTML only. Testing the page and debugging. Design a homepage with HTML & CSS.
Cascading Style Sheets (CSS)
Define cascading style sheets (CSS). Define CSS terms, style definition locations and CSS benefits. Create CSS Rule types. Define HTML tag rules. Set CSS preferences. Create external, embedded and inline CSS. Use points, pixels or ems for font sizes. Export CSS rule definitions. Class and ID selectors. Pseudo-elements selectors and combination selectors. Understand cascading order and inheritance of styles. Working with CSS frameworks. Design forms with HTML and CSS. Design a complete website with HTML & CSS.
WYSIWYG editor
Navigate through the WYSIWYG’s interface. Define a local root folder. Use the Files panel. Use the development view. Add page titles and save pages.
Working with Video and other Media
Insert video, photo and audio into a web page. Produce video for online platforms that adhere to current trends. Convert media into different file formats with current software. Work with native and embedded video. Exploration of third party video hosts and platforms. Video marketing and the web.
Responsive Design
Designing web pages for different screens and devices. Using classes. Using CSS frameworks. Using multiple CSS documents. The basics of Java Script.
Test, Maintain, and Upload
Test a complete site. Check accessibility settings. Check links. Check browser compatibility. Generate site reports. Maintain files and folders. Rename and move site files. Work with the integrated file browser. Connect to a remote server. Upload files using FTP. Cloak files and folders. Synchronize files and folders.
Assessment Breakdown
%
Continuous Assessment
10.00%
Project
50.00%
Practical
40.00%
Continuous Assessment
Assessment Type
Assessment Description
Outcome addressed
% of total
Assessment Date
Other
A written continuous assessment test in relation to HTML & CSS coding will assess the learning outcomes covered up to that point.
1
10.00
Week 5
Project
Assessment Type
Assessment Description
Outcome addressed
% of total
Assessment Date
Project
A significant project which will assess the degree to which the students have achieved the skill, competencies and knowledge as defined in the learning outcomes.
1,2,3,4,5
50.00
End-of-Semester
Practical
Assessment Type
Assessment Description
Outcome addressed
% of total
Assessment Date
Practical/Skills Evaluation
Each student will be required to complete a practical assignment as part of the assessment of this module.
1,2
40.00
Week 7
No End of Module Formal Examination
SETU Carlow Campus reserves the right to alter the nature and timings of assessment