Course Description and Competencies

What to Expect

In this course, you will gain an overall understanding of front-end web development and its concepts. You will learn about navigational schemes and user-centered design. You will learn JavaScript. You will explore Hypertext Markup Language (HTML), including formatting text and images and how to create hyperlinks. You will use Cascading Style Sheets (CSS) to create reactive websites. And you will implement data entry and data storage capabilities in web design.

Throughout this course, you will find a variety of interactive elements. These include an interactive textbook, participation activities, and labs. Engaging with these activities reinforces new learning. It also complements the knowledge you bring to this area of study. 

Prerequisites:

Web Development Foundations (D276) is the recommended prerequisite course.

Course Competencies

This course covers the following competencies:

  • The learner implements navigational schemes in websites.
  • The learner develops reactive user web interfaces using CSS.
  • The learner implements data entry and data storage capabilities in a web environment.
  • The learner implements user-centered solutions from multiple perspectives emphasizing usability and functional page layouts.

Assessment

Once you have engaged with the course material, you can prepare to turn in your two projects. These projects are described on the following pages. You must achieve a ranking of Competent on each project to pass the course. You may attempt each project two times before additional support is necessary. If you require further attempts, please contact your Course Instructor or Student Experience Specialist.

2 Projects
3 Competency Units

Course Outline

ModuleUpon completion of this module, you will be able to:
1. HTML Fundamentals
  • Create a formatted HTML document
  • Use an HTML validator
  • Implement comments in an HTML document
  • Create lists and tables in HTML
  • Display images and special characters in HTML
  • Create hyperlinks in HTML 
2. More HTML
  • Use containers to format elements in an HTML document
  • Implement block and inline elements in an HTML document
  • Create forms in an HTML document
  • Add audio and video elements to an HTML document
  • Use script and style tags to provide interactive functionality and presentational styling to an HTML document
  • Implement best practices in HTML development 
3. CSS Fundamentals
  • Apply CSS to stylize an HTML document
  • Apply CSS to stylize text in an HTML document
  • Implement the box model in an HTML document
4. More CSS
  • Implement flexbox containers and items in an HTML document
  • Implement grid containers and items in an HTML document
  • Use the CSS position property to place elements in an HTML document
  • Apply special effects and animate elements in an HTML document
  • Use Sass to build complex CSS stylesheets 
5. Mobile Web Development
  • Identify the differences between traditional web applications and mobile web application sites
  • Identify essential responsive web design (RWD) techniques
  • Use mobile development tools
  • Design HTML documents for different screen sizes
  • Create responsive images for an HTML document
  • Use Bootstrap to create responsive websites 
6. JavaScript Basics
  • Use JavaScript to add interactivity to an HTML document
  • Use variables and data types in JavaScript
  • Use comments in JavaScript
  • Use arithmetic operators to perform a computation in JavaScript
  • Use conditional statements and loops in JavaScript
  • Invoke functions, methods, and arrays in JavaScript
7. Data Entry & Storage
  • Validate data received from an HTML form
  • Store data using the Web Storage API
  • Set cookies to store user data
8. User-Centered Design
  • Describe the principles of user-centered design
  • Explain user-centered design processes such as Agile and Waterfall
  • Explain the benefits of participatory design and scenario-based design
  • Describe cognitive psychology principles that apply to the design processes
  • Develop personas, use case approaches, and test to optimize usability
  • Optimize accessibility for a website
9. Website Navigation
  • Describe principles of navigation
  • Implement best practices of navigation
  • Follow website navigation conventions
  • Differentiate between primary and secondary navigation schemes
  • Describe a navigation action plan
10. React (Optional)
  • Use React to create an interactive user interface
  • Complete React Labs for additional practice
11. Appendix
  • Follow APA guidelines for citing resources
  • Use web hosting best practices
12. Web Accessibility
  • Implement best practices of accessibility
  • Use tools to support accessibility requirements
  • Create websites with accessible colors, images, links, and text
13. Web Development Process and Resources
  • Define phases of web development
  • Explore supplemental resources

Key Contacts

Certificate Connect
Check out this online community to take advantage of course resources, including videos and tips from your educators. You can ask and answer questions, provide feedback on your progress, and interact with fellow students. You will find this platform in the Student Resources section of the course. Log on and do some exploring!

Tutor.com
If you need academic support, don’t hesitate to contact Tutor.com. There, you have access to thousands of tutors. And they are available 24/7 from any internet-ready device. You can also benefit from instructional videos, study tools, and other assistance.

Technical Support
If you encounter technical issues, be sure to contact the Help Desk. Just submit a Support Request for assistance.

Program Support
Do you have questions about your account? Student Support has answers. They can help with billing, switching courses, and other requests. You can contact them at (888) 320-0540 or support@academy.wgu.edu.

Accommodations

WGU provides compliant and accessible learning experiences. If you require accommodation, please contact us at the start of the course. You can email disability@academy.wgu.edu.

We are committed to ensuring that all students with disabilities have equal access to WGU's services and materials. We strive to use best practices for accessibility. Our goal is to conform to existing U.S. laws, including the Americans with Disabilities Act and Section 504 and Section 508 of the Rehabilitation Act.

Our learning management system (LMS) platform is Open edX. Open edX’s commitment to accessible content is published in their Website Accessibility Policy.