Menu
close
Apply Now
Contact
Parent Programme
Bachelor of Science in Computing (Level 7 NFQ)
NFQ Level & Reference
Level 6 / Ref: M2.5
Duration
12 Weeks X 3 Hours each week
MODULE TITLE
Front-end Web Development
STAGE
2
Monule Credit Unit
ECTS: 5

Front-end Web Development

Introduction to Front-end Web Development

The Front-end Web Development module will provide Learners with a solid foundation in modern HTML5/CSS3 front-end development.   They will acquire the knowledge and skills to build, update, test, and deploy standards-based, visually attractive, responsive, and functional websites.

Indicative Syllabus Content

Introduction to Front-end Web Development

  • Principles of Front-end Web Development with HTML5 and CSS3
  • Working environment: Microsoft Visual Studio Code and extensions, web browser Developer Tools, hosting with GitHub Pages
  • HTML foundations: meta data, semantic and formatting tags, block versus inline tags, lists and bullets, tables, hyperlinks
  • CSS foundations: selectors, declarations, properties, and values

Web Page Layouts

  • The ‘box model’: margins, padding, borders, positioned elements, z-index overlays
  • Multi-column, flexbox-based grid layouts, negative spacing.
  • Responsive design with media queries and CSS custom properties.

Web Page Design

  • Working with colour models and palettes
  • Sourcing and adding copyright-free images, icons and videos
  • Typography – Google fonts
  • CSS Animation

Standards and Testing and performance

  • Accessing web standards – Who sets the standards and what are they?
  • W3C mark-up validation for HTM and CSS
  • Web Content Accessibility Guidelines (WCAG) 2.1
  • UX/UI-design and experience
  • User testing – Role of testing in the development process, practical application of criteria
  • Optimising HTML and CSS for fast loading, Google Page Speed Insights
  • SEO topics, Google Analytics, Google Search Console, Irish and EU privacy laws, sitemaps
  • Choosing third-party templates and frameworks

Minimum Intended Learning Outcomes (MIMLOs)

Upon successful completion of this module, the learner should be able to:
MIMLO1
Demonstrate an appropriate knowledge of the architecture of web applications, the underpinning internet technologies, and fundamental HTML and CSS syntax.
MIMLO2
Construct responsive, grid-based web designs employing colour theory, fonts and fluid typography, media queries, CSS animations, and CSS custom properties.
MIMLO3
Build six professional-quality web projects using standard-based frameworks and libraries, and copyright-free assets.
MIMLO4
Demonstrate proficiency in adhering to web standards, optimizing web performance, conducting user testing, and implementing SEO and legal compliance in web design.
MIMLO5
Build a unique, personalised portfolio showcase website that demonstrates technical proficiency, standards adherence, and individual creativity in content, design, and layout.

Assessment

MIMLOs
Assessment
Percentage
1, 2, 3, 4, 5
CA 1 – Practical Lab Work (In-class examination)
Total 100%
CA 2 – Practical Lab Work (In-class examination)
All Assessments
CA 3 – Personal Portfolio – Practical Web site Project

Reassessment Opportunity

Where the combined marks of the assessment and examination do not reach the pass mark the learner will be required to repeat the element of assessment that they failed. Reassessment materials will be published on Moodle after the Examination Board Meeting and will be aligned to the MIMLOs and learners will be capped at 40% unless there are personal mitigating circumstances.

Aims & Objectives

The objectives of this module will ensure learners:

  • Understand the basics of HTML5 and CSS3.
  • Work with images, video, fonts, icons, and animations.
  • Build six professional-quality websites using frameworks and copyright-free assets.
  • Track user visits and interactions with Google Analytics, and comply with Irish and EU privacy laws.
  • Create a four-page personal portfolio website for showcasing their work to future employers.
[TheChamp-Sharing]
APPLY NOW
Top