Web Design HTML CSS Create Single Page Website from Scratch
4.0 (79 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
6,165 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Web Design HTML CSS Create Single Page Website from Scratch to your Wishlist.

Add to Wishlist

Web Design HTML CSS Create Single Page Website from Scratch

Step by Step guide to building a single page website from scratch Learn how to use HTML CSS JavaScript jQuery together
4.0 (79 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
6,165 students enrolled
Created by Laurence Svekis
Last updated 8/2016
English [Auto-generated]
Current price: $10 Original price: $100 Discount: 90% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 2 hours on-demand video
  • 8 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • build a single page website from scratch
  • use HTML and CSS together
  • apply jQuery to create animation effects for scrolling
  • Create amazing looking websites
  • build a portfolio to include one page websites
View Curriculum
  • Basic HTML and CSS
  • Desire to learn web design
  • computer access

One page scrolling websites are extremely popular and a great way to way to present information for anyone.  

Benefits of one page websites

  • Great for mobile
  • Encourage users to see more content
  • very visually appealing
  • no page refreshes
  • easy to setup
  • engages visitors in a unique way
  • provide information in a unique and easy to consume way

Learn how to build a website from scratch...

  • Everything you need is included
  • Source Files ready
  • Top resources
  • Best links
  • Top tips for better web design
  • Step by step process explained
  • Tools and resources needed for web design

Start by creating a wire frame of the website, and draw up how you want the finished website to look.    Build the structure of the page using HTML.  Full explanations of code as it is built.  Create the HTML menu, content area and basics of web design.    Using HTML5 semantic tags, to create your webpage.

Styling explained.  Make your website come to life adding styling to HTML structure.  Attach external libraries to add more to your CSS.   Learn how to turn your HTML header into a sticky header.  Add styling to transform your unordered list into a custom navigation bar.  Learn about adding backgrounds, setting opacity to sections and more.

Make your website responsive so that it will work on any device across multiple screen sizes.   Resize and scroll the page to sections within your web design.

Add interaction and dynamic effects to your website using jQuery.  Learn about adding event listeners, move the screen position and more.

Start exploring what you can do with your website design

By the end of the course you will have the skills and know how to create your own website from scratch.

I am here to help you learn how to create your own web projects and ready to answer any questions you may have.

Want to know more, what are you waiting for take the first step.  Join now to start learning how you too can create dynamic and interactive web projects today.

Who is the target audience?
  • web developers
  • web designers
  • anyone who wants to learn how to build a website from scratch
  • web masters
  • anyone who wants to learn how to use HTML and CSS
Students Who Viewed This Course Also Viewed
Curriculum For This Course
28 Lectures
Introduction to creating a single page scrolling website from scratch
3 Lectures 10:58
Build HTML website
5 Lectures 29:06
Build HTML page structure in prep for Styling

Build Navigation Menu and Page Content

Source Code for project

Build HTML tags Nesting of Semantic Elements

HTML source Code
Add Styling to website
10 Lectures 56:46
Adding Styling to your webpage

Linking to Libraries Google Fonts and more

Sticky Headers Section Styling

Source Code HTML and CSS

Build a navigation bar with CSS

Add background images

Section text rgba

CSS Source Code

CSS media for responsive web design

Update menu to be Responsive on resize
Add Event listeners to website jQuery
9 Lectures 37:22
Introduction to JavaScript and jQuery

Add Click events create interactions for users

use jQuery to get pixel position of HTML elements

Scroll webpage dynamically

Hide menu when clicked on small screen

Source Code

Final Fix of issues completed website

Source Code Single Page interactive Website HTML full

Source Code Single Page website CSS Full
Conclusion Resources and More
1 Lecture 00:07
About the Instructor
Laurence Svekis
4.2 Average rating
14,197 Reviews
312,762 Students
188 Courses
Instructor, 18+yrs Web Experience

I'm here to help you learnachieve your dreams, come join me on this amazing adventure today

Providing Web development courses and digital marketing strategy courses since 2002.

Innovative technology expert with a wide range of real world experience. Providing Smart digital solutions online for both small and enterprise level businesses.

"I have a passion for anything digital technology related, enjoy programming and the challenge of developing successful digital experiences. As an experienced developer, I created my first computer applications in 1990, and my first website in 1998.  I enjoy sharing my knowledge with others and want to help you share in the wonderful opportunities that the internet provides."

"Learning, understanding with a strong passion for education.  The internet has provided us with new opportunities to expand and share knowledge."

Want to learn more about becoming a web developer, do you want to experience the freedom that technology provides for us? Learn how to bring amazing things to life online.  Technology connects us all in many ways.  It opens up doors to those who embrace it and learn how to make those connections real.

"My courses are designed to help you achieve your goals, learn and update skills"

Background : An experienced web application developer, having worked on multiple enterprise level applications, hundreds of websites, business solutions and many unique and innovative web applications.  Web application development areas of expertise include HTML, CSS, JavaScript, JQuery, Bootstrap, PHP and MySQL. Anything to do with web creation and digital experience. Passionate about everything to do with web application development, programming to online marketing with a strong focus on social media and SEO

"Understanding technology provides a means to better connect with users.  It also opens so many doors.   Knowledge is the key to success and I want to help you experience what technology has to offer. I'm passionate about web technologies, and look forward to sharing my knowledge and experience with you!"