Layout
Specialist
Full Skills Course Learn the key technologies of modern layout and
start your web development career from scratch!
Full Course
Master all aspects of the topic from the
basics to advanced techniques.
Downloadable Resources
Access useful materials at any time.
Real Project
Put your knowledge into practice and build your portfolio.
Certificate
Get a document to prove your skills.
A layout specialist
A layout designer creates the visual part of a website: based on the designer's layout, using HTML and CSS to turn graphics, fonts and other elements into working code, adapting it for different browsers and devices.

As the number of websites grows, the demand for skilled layout designers who can work quickly and accurately continues to grow.
IT profession, where specialists
are needed right now
$1000
junior
$2100
middle
$3200
Senior
There is always a demand
for layout services and
prices are rising
You can become a middle developer with a
salary of $3200 for a year of real development.
More than
1200 vacancies
On Linkedin
There are vacancies
in remote format
You can work from anywhere in the
world or look for an employer abroad.
Who will benefit from
this course
For IT
beginners
Master HTML, CSS and JavaScript from scratch to start a career as a layout designer (including remote work).
For experienced specialists
Update your layout skills in accordance with current market requirements.
For
entrepreneurs
Create a website yourself and get rid of dependence on freelancers.
For future
developers
Start with layout to take the first step into the world of IT and web development.
What you will learn in the course
Build websites
from layouts
Turn design into working code.
Work with block layout
Create page structure using HTML and CSS.
Write semantic
and valid code
Make sites understandable to browsers and search engines.
Adapt the layout
for all devices
Customize correct
display on all screens.
Add animations
and effects
Make interfaces dynamic and modern.
Work with FlexBox
and CSS Grid
Control the layout of elements flexibly and efficiently.
Use preprocessors
(SCSS) and Bootstrap
Speed up development
with modern tools.
Use JavaScript
for layout
Bring websites to life with
scripts and libraries.
Training Program
Module 1
Introduction
Introduction
Resources
How to ask questions about the course
Module 2
HTML, CSS Basics
HTML basics
Questions on HTML basics
Basic markup
CSS Basics
Questions on CSS basics
Basic styles
Working with text
Questions about working with text
Text styling
Working with block elements
Working with indents
Stylization of block elements
Card styling
Work with links and buttons
Creating links
Work with images and icons
Stylization of pictures
Automatic formatting in VS Code
CSS pseudo-classes and pseudo-elements
Using pseudo-classes
Website structure and types of layouts
Tables and table layout
Table layout
Old-style block model of layout
Positioning, drop-down menu
Application of positioning
Introduction to FlexBox
FlexBox practice
Block model of layout on flexes
Module 3
Work with layouts
Layout slicing in Photoshop
Zeplin and import from Photoshop or Figma
Layout workshop
Layouts
Module 4
Advanced HTML and CSS Techniques
BEM basics
Form elements
Adding audio and video
CSS filters
HTML5 semantic tags
Cross-browser support
CSS3 transformations
CSS3 animations
Work with adaptive content
Basic use of the SASS
SCSS preprocessor
Advanced use of SASS
SCSS
Module 5
Bootstrap 4
General features of Bootstrap
Work with the Bootstrap grid
Using Bootstrap components
Module 6
JavaScript for a Front-End Developer
Introduction to JavaScript
Creating variables
Branches and loops
Work with a loop in JS
JS objects and arrays
JS functions
Creating JS functions
The concept of DOM and nodes
Practice on getting links to HTML elements
Click event handling
Creation of a slider on JS
Creation of a modal window
Creation of tabs
Creation of a filter of cards
Module 7
JavaScript Libraries
jQuery basics
FancyBox Gallery
ParollerJS and ParallaxJS animations
ScrollMagic Animations
SwiperJS adaptive slider
Bonus module
CSS Grid Specification
CSS Grid. Basic terminology
Basic features of CSS Grid
Templates and fractions
Grid areas and working with them
Alignment
Adaptive methods
Nuances of use
CSS variables
PRACTICE
Layout project
Layout template overview
UI Kit - what and why
Setting up the environment
Variables and typography
Feature component
Screenshot component
Review component
Price component
Form and social icons components
Website introductory block
"About the Product" block
Features block
Screenshots Block
"Testemonials" block
Prices block
Footer block
Layout validation
Production/Assembly
Conclusion
Summing up
Summing up
How the training takes place
Watch video
recordings
You have access to all the videos at once, watch them at your convenience
Study the
materials
Texts and additional materials will help you understand the details
Pass the
Assignments
Complete the assignments and consolidate your knowledge in practice
Claim Your
Certificate
After successful completion of the course a certificate will be waiting for you in the mail and in your personal cabinet.
Real-time
code practice
The course contains interactive programming assignments
where you immediately put your new knowledge into practice.
Demonstration
Authors and curators
of the course
Maxim Aliev
Frontend developer at Yandex, ex-Tinkoff 10+ years in web development, specialist in complex layout and performance optimization.
Ekaterina Smirnova
Senior Frontend Engineer at Avito, mentor at HTML Academy Expert in adaptive design, JavaScript and modern frameworks.
Denis Kozlov
Tech Lead at Lamoda Specialist in CSS Grid, Flexbox and advanced frontend development.
Anna Morozova
UI/UX Designer at SberTech Specialist in Figma, Photoshop and creating design systems for complex interfaces.
Choose the right tariff
Introductory course
  • - 2-module training program
  • Lecture materials
  • Downloadable resources
  • Course access - 1 month
  • No certificate
Start Now
$7
Basic
  • 7-module training program
  • Lecture materials
  • Practical assignments
  • Downloadable resources
  • No feedback
  • Course access - 2 months
  • No certificate
Start Now
$14
Standard
  • Training program - 7 modules
  • Bonus module: CSS Grid Specification
  • PRACTICE: Layout project
  • Video materials
  • Practical tasks
  • Chat for students
  • Assignment check and feedback
  • Course access - 6 months
  • Certificate
Start Now
$36
Standard Plus
  • Training program - 7 modules
  • Bonus module: CSS Grid Specification
  • PRACTICE: Layout project
  • Video materials
  • Practical tasks
  • Mentor support and recommendations
  • Chat for students
  • Assignment check and feedback
  • Course access - 12 months
  • Certificate
Start Now
$49
Corporate
  • Groups of 5-10 people
  • Curriculum - 7 modules
  • Bonus module: CSS Grid Specification
  • PRACTICE: Layout project
  • Adaptation of course materials to corporate topics
  • Assignment check and feedback
  • Course access - 12 months
  • Add to group chat
  • Certificate
Start Now
$450
Offer for companies
You can train your employees in this course. We will adapt the program to your business.

If you train several employees at once -
more favorable cost.
Certificate
After completing the course, you will
receive an official certificate with the
qualification “Specialist in layout”.
Our students are in demand
According to data collected on LinkedIn
77%
of graduates find a job within
2 months of graduation
1200
companies are looking
for layout specialists
Testimonials from our students
The course was a great start! I learned to layout from scratch and already make websites on freelance. The training is clear, and the support of mentors really helps.
Alexey
I am a designer. I wanted to expand my skills - now I layout my layouts myself. Especially liked the modules on adaptability and animations. I recommend it!
Marina
I was looking for a course with the latest technologies - here everything is on point: Flexbox, Grid, SCSS. After the training I easily moved on to more complex projects. Thank you for a good product!
Dmitry
I wanted to make a website for my business without overpaying. During the course I learned how to layout on my own - the savings on development are enormous!
Anna
I was afraid that I would fail, but the presentation of the material is so lively that even JS became clear. I've got my portfolio together - now I'm looking for an internship.
Ivan
Question and answer
01
Can I learn if I have no experience at all?
Yes, the course is suitable for complete beginners with no programming experience. But
to achieve results, you need to put in the effort—complete the practical assignments.
02
I see a lot of unfamiliar terms: HTML and CSS. What do they mean?
HTML is the most widely used markup language on the internet. You can think of HTML as a set of commands that defines the structure and logic of a website.
CSS is the language that describes the style of a website. If HTML is responsible
for the content, then CSS defines the appearance of the website.
CSS Grid is a tool in CSS: a special grid that helps arrange website elements
symmetrically and neatly.
Figma is a service where designers create the interfaces for websites and mobile
applications.
Webpack is a tool that can help automate part of the work on layout.
Pixel Perfect is an approach in layout where every pixel of the finished website
occupies the same position as in the designer's mockup. If you "overlay" the
design on the website, the difference will be minimal.
Visual Studio Code is a free code editor for developing web applications.
03
Do I need to install programs to work on the course?
There is no need to download anything in advance. During the course, we will help you install all the necessary software for your work.
04
What equipment will I need for training?
Web development doesn't require a lot of computing
resources, so a regular laptop or computer will suffice. Here are
the minimum hardware requirements:
Operating system: Windows 8.0 or higher, macOS 10.12 (macOS
Sierra) or higher.
Processor: 4-core at 2.5 GHz or higher.
RAM: 4GB or more.
Internet access.
05
Why is the price so low?
The mission of our course is to make expensive IT education accessible to everyone!
06
What if the course doesn’t suit me or I don’t like it?
If during the course you realize that this course is not suitable for you -
within 30 days from the date of purchase, you can get a full refund.
Take the training and
become a confident
IT professional!
Start Now