HTML CSS Create a Single Page Website from Scratch

Laurence Svekis, Web technology Instructor

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
21 Videos (2h 8m)
    • Promo video

    • 1 Single page website course introduction

    • 2 Web Developer Tools and Resources Overview

    • 3 Create a wireframe of website

    • 4 Build HTML page structure in prep for Styling

    • 5 Build Navigation Menu and Page Content

    • 7 Build HTML tags Nesting of Semantic Elements

    • 9 Adding Styling to your webpage

    • 10 Linking to Libraries Google Fonts and more

    • 11 Sticky Headers Section Styling

    • 13 Build a navigation bar with CSS

    • 14 Add background images

    • 15 Section text rgba

    • 17 CSS media for responsive web design

    • 18 Update menu to be Responsive on resize

    • 19 Introduction to JavaScript and jQuery

    • 20 Add Click events create interactions for users

    • 21 use jQuery to get pixel position of HTML elements

    • 22 Scroll webpage dynamically

    • 23 Hide menu when clicked on small screen

    • 25 Final Fix of issues completed website


About This Class

HTML CSS Create a 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

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.





Laurence Svekis

Web technology Instructor

Providing Smart digital solutions online since 2001. I am considered a true web technology expert. Having professional experience in a wide range of digital areas. Everything from Search Marketing, Video Marketing, Content creation, User Experience, application architecture, and web programming.

Understanding how users flow through the web and learning what drives users to interact online has been the cornerstone of what I do. The more seamless the process the better the user experience and the more likely they are to interact again and share their experiences.

After launching my first websites I quickly realized that to get traffic on your site you need to be able to market online. Research and using personal experimentation as to what are the most successful ways to effectively drive traffic to my websites, I was able to successfully build multiple success eCommerce sites. I used my expertise to provide Search Engine Marketing Services SEO to 100's of clients.

In the advent of Social Media in 2006, I had identified it as an excellent opportunity to drive traffic and connect with users. I created many successful sites that integrated with Myspace and then later into Facebook. I was able to monitize the traffic on several platforms, driving in some cases 10K+ clicks daily to the various platforms. I continued to perfect the art of Internet marketing and adapt to new technology and changes.

In 2008 I created my first YouTube video, and channel. Realizing that there was another great opportunity with video I have been experimenting with video marketing and video monization. Youtube being the second largest search engine has a very bright future. As technology progresses the trend has always been quicker, easier means of delivering content always wins out. Images beat out text as they are easier and quicker for us to process, videos beat out images being the most efficient means of getting content to users. As bandwidth increases, and more platforms that can even easier deliver videos become available videos will be the trend for the future.

Understanding technology provides a means to better connect with users.

Applications I've created have entertained, informed and engaged tens of millions of people. I have over billions of page views on various platforms, and have sent millions of click through visitors.

I have developed hundreds of web applications, from micro sites to enterprise level platforms.