Web Technologies

This course introduces students to web design and development using HTML 5, the UTF-8 character set, and the basics of Cascading Style Sheets (CSS). Students will hand code web pages and style them with CSS. Students will analyze commercial websites in order to gain insight into website design and story-boarding of their own pages. In addition to web design learners will also explore web publishing, web marketing, website maintenance (Internet and intranet) along with other web technologies. This is a distance education web design course offered entirely online. Students must have access to the Internet, a personal e-mail account, and a PC Pentium/Dual Core or Macintosh PPC/Intel with 1gb or more of RAM. Also required is an FTP Client for PC or Macintosh. Links to available FTP software will be provided from within the course documentation.
Prerequisite(s):

• Students will need to have current PC or Mac operating system, reliable Wi-Fi or cellular data connection as well as an up-to-date version of Chrome, Firefox, Safari or Microsoft Edge browser is recommended.

This course is a continuation of MDIA 1205 (Web Design Technologies 1), which begins with a review of the basic concepts of HTML and CSS (Cascading Style Sheets) and then moves into more complex topics. These techniques involve HTML5 functions for creating interactive online forms using input elements and related attributes. You will be provided with server-side script for form processing. This course introduces you to organic Search Engine Optimization (SEO) and how search engines index, return, and rank results. Web analytics and sitemaps are also discussed. Activities include keyword research, choosing appropriate keywords, and preparing a web page optimized with the techniques covered. In depth coverage of CSS concepts and routines are detailed, including different types of page layouts, navigation menus, accessibility, semantic naming of CSS elements, contextual selectors, grouping selectors, pseudo-classes and elements, the float property and element positioning. You will create web page layouts with CSS styled vertical and horizontal navigation menus, general links as well CSS styled images, data tables, and print style sheets for your pages. Practical CSS techniques, such as best practices, code organization, commenting, shorthand, and accessibility, will be explored.
Prerequisite(s):

• 50% in MDIA 1205^† (^† may be taken concurrently)

​This course introduces you to the Photoshop interface and tools to create or edit graphics and images for use on the web. You will apply colour theory and management knowledge using different colour modes and bit depth. Topics include painting and editing tools, cropping, rotating, creating selections, saving selections in channels, layers, typography, paths, masking, colour correction with curves and levels, and using filters. Photoshop tools will be used in creating graphical web page elements, and designing and aligning image components. You will format image files, optimize images for the web, design and construct a layered graphic, and retouch photographic images.​​​
Prerequisite(s):

• No prerequisites are required for this course.

This course concentrates on using and modifying commercial and/or freeware JavaScript routines to enhance the content of Web pages. To fully explore how JavaScript scripts work and how they may be modified, students will be asked to create JavaScript routines using manual coding.
Prerequisite(s):

• 50% in MDIA 1205^† (^† may be taken concurrently)

In this course students use the WordPress dashboard to install and customize existing WordPress themes, add and activate plug-ins, and modify widgets to quickly and efficiently develop template driven websites. Students will convert HTML websites into WordPress templates and integrate WordPress with custom websites as a Content Management System. Students will install WordPress on a local host and migrate content between local and hosted servers; and look behind the scenes of a functioning website to examine concepts such as cPanel, database creation, and phpMyAdmin to set up and manage their own hosted WordPress website. The course will be delivered through a series of video notes.
Prerequisite(s):

• 50% in MDIA 1205^† (^† may be taken concurrently)

Students use the Premiere Pro interface to create multi-layered movies by syncing audio, video, and imagery seamlessly to produce a video. The course covers adding styled titles, applying filters and transitions, and colour correcting the entire video to ensure a professional product from start to finish. The course explains how to use Premiere Pro's workflow and integrate with Adobe Photoshop, Audition, and After Effects to edit audio, imagery, and add complex effects that update in real time. Students will explore the best options for exporting video content to mount on a website, or through video sharing sites such as Vimeo, Youtube, and Vine. The course will be delivered through a series of video notes.
Prerequisite(s):

• No prerequisites are required for this course.

This course uses Bootstrap as a powerful responsive framework to manually code dynamic mobile websites. Students will combine Bootstrap's mobile assets with HTML and CSS to develop custom mobile websites with content that resizes, repositions, collapses, and hides for optimal delivery on any device. Students will implement Bootstrap's responsive plugins, including Carousel Galleries, Accordions, Modals, and Popovers to increase site usability and interactivity, and create dynamic animated elements with Bootstrap's integrated CSS animations. To ensure optimized web delivery, this course explores custom Bootstrap exports, which minimize Bootstrap's file size and increase site performance. The course will be delivered through a series of video notes.
Prerequisite(s):

• 50% in MDIA 1205^† (^† may be taken concurrently)

This course is the culmination of the Associate Certificate program. As a major task in this course, learners will be required to locate a person or organization desiring a website and design and develop a pro bono (i.e., free) website for them. Other related tasks will include storyboarding the site, costing and contracting issues, and designing the client site (including creating a domain name for the client, mounting the site using a commercial ISP, and registering the site with search services). Other topics in the course include creating a business plan (including a strategic marketing plan), setting up a company in British Columbia, and site maintenance and related topics.
Prerequisite(s):

• 50% in MDIA 1205^† (^† may be taken concurrently)

In this course we will deal with four broad design areas in terms of contemporary issues in web design — website usability, effective use of colour, modern trends in web design, and website accessibility (for those with disabilities). In the assignments, you will explore all of these issues by analyzing a small website from their portfolio and illustrating how the issues raised in this course could be implemented to provide a better and modern user experience. You will be given a number of tools and checklists to use in analyzing websites that will help you enhance the user experience.
Prerequisite(s):

• 50% in MDIA 2205

This is an introduction to using XML (Extensible Markup Language) to enhance Web page design and for e-commerce applications. Topics include the structuring of an XML document, transforming an XML document into XHTML using XSL (Extensible StyleSheet Language) and XPath, creating a DTD (Document Type Definition) and an XML Schema to define the elements and attributes which are valid in a XML document. The course also introduces using XML in a Web publishing environment.
Prerequisite(s):

• 50% in MDIA 2205

This is an introduction to using the jQuery JavaScript library which will help students write JavaScript in a simplified, concise and elegant manner. Topics include navigating and selecting DOM (Document Object Model) elements on a web page using jQuery functions, handling events and event binding, creating simple visual effects including animation, creating simple jQuery widgets. This course also introduces learners to jQuery plugins for image manipulation, form validation and file uploads.
Prerequisite(s):

• 50% in MDIA 2205

In this course, learners examine the basics of Responsive Web Design. Students compare and contrast responsive design with other approaches to multi-platform and device design, and are introduced to testing tools (emulators/simulators) for various platforms that could be targeted and use these tools to validate their work. Learners also develop a wireframe for a responsive website and create a simple responsive website based on a site they previously designed using flexible grids, flexible images, and CSS3 media queries. Students will then adapt this site so that it functions well on desktop, mobile, and tablets thus creating a fully responsive Web design conversion.
Prerequisite(s):

• 50% in MDIA 3201

Through a series of video notes this course explores the wealth of statistical data Google Analytics provides, to track how visitor activity can help you streamline your design and guide your marketing strategies. By reviewing the data in Google Analytics reports, you will learn how to optimize different aspects of your site to increase visitors, maximize Conversion Rates, and reduce your Costs of Acquisition. The course also teaches the importance of your online persona and how to synchronize your brand across all Social Media outlets.
Prerequisite(s):

• 50% in MDIA 2205

This course introduces the fundamentals of creating dynamic, interactive Web pages using PHP technology. Topics include: an introduction to PHP, PHP syntax, using variables HTML forms and PHP, doing math in PHP, using strings, basic control structures, using arrays, creating functions, working with files and directories, using databases in PHP, employing cookies, creating Web applications, and debugging PHP scripts.
Prerequisite(s):

• 50% in MDIA 2205 and 50% in MDIA 3207

This course introduces the fundamentals of creating mobile websites using the jQuery Mobile framework — a JavaScript library that makes it easy to create websites that render correctly on a variety of mobile devices, including iOS (iPhone, iPod Touch, iPad), Android, Blackberry, PalmOS, and others. Students will explore the basic structure of a jQuery Mobile page, how to implement commonly-used page components like headers, footers, toolbars, buttons, lists, dialogs, form controls and multi-column layouts. Additional topics include the jQuery Mobile navigation model, managing transitions between pages, using themes, and responding to touchscreen events like tap and swipe. NOTE: You should own or have access to at least one mobile device (smartphone or tablet) for this course.
Prerequisite(s):

• 50% in MDIA 3207 and 50% in MDIA 4307

This course is the culmination of the Certificate in Web Technologies. You will draw together all of the knowledge and skills that you have acquired in the Certificate program and present them in terms of a personal online portfolio. There will be ten assignments (portfolio web pages) and each assignment focusses on a specific skill or technique, although other design elements to create a well-balanced web page should be included. You should approach this course with the idea that you will create a marketing tool that can be used to demonstrate your design background and skillset to prospective clients.
Prerequisite(s):

• All other courses in Certificate program matrix list must be completed before the Final Project: www.bcit.ca/study/programs/6420cert#courses