• Skip to content
  • Select language
  • Skip to search
OpenClassrooms.comOpenClassrooms.com
Our training programs
Online and at your own pace.
Compare our training programs
Learn a profession
Degree programs
Acquire in-demand skills with real-world projects and one-to-one mentoring.
Discover a topic
Free-access courses
Broaden your knowledge with 500+ regularly updated courses
Apprenticeship
Online and at your own pace.
Students
Start an apprenticeship
Kick off a new career with our 100% online registered apprenticeship degrees, which offer a monthly salary and no fees.
Consult job opportunities
Access thousands of apprenticeship job opportunities across France all year round.
Employers
Hire apprentices
Access qualified candidates all year round, create a job posting with AI, or receive a tailored selection of top talent.
Finalize the hiring of a candidate
Found the perfect candidate? Share their details to proceed with the hiring process.
For employers
Train and recruit talents through an all-in-one space.
Discover our solution
Upskilling & reskilling
Enhance your knowledge
with a library of 500+ self-guided courses - SPARK
Promote hard and soft skills
with mentor-led intensive programs - BOOST
Support career progression
with mentor-led training programs - PIVOT
Recruitment
Foster talents
Access qualified candidates all year round, create a job offer with AI, or receive a tailored selection of top talent.
Finalize the hiring of a candidate
Found the perfect candidate? Share their details to proceed with the hiring process.
Break Down and Integrate a Mockup

Table des matières

  • Partie 1

    Breakdown a mockup

    • 1

      Discover the concept of a mockup

    • 2

      Find and open a mockup

    • 3

      Translate visuals to HTML elements

    • 4

      Analyze dimensions and sizing

    • 5

      Breakdown images and fonts

    • Quiz : Mockup and Photoshop basics

  • Partie 2

    Integrate a mockup

    • 1

      Set up basic HTML structure

    • 2

      Add page metadata

    • 3

      Integrate a Bootstrap grid

    • 4

      Understand basic CSS principles

    • 5

      Integrate specific CSS rules

    • 6

      Get some practice integrating a mockup in HTML and CSS

Table des matières

  • Partie 1

    Breakdown a mockup

    • 1

      Discover the concept of a mockup

    • 2

      Find and open a mockup

    • 3

      Translate visuals to HTML elements

    • 4

      Analyze dimensions and sizing

    • 5

      Breakdown images and fonts

    • Quiz : Mockup and Photoshop basics

  • Partie 2

    Integrate a mockup

    • 1

      Set up basic HTML structure

    • 2

      Add page metadata

    • 3

      Integrate a Bootstrap grid

    • 4

      Understand basic CSS principles

    • 5

      Integrate specific CSS rules

    • 6

      Get some practice integrating a mockup in HTML and CSS

Mockup and Photoshop basics

Testez vos connaissances !

Créez un compte gratuitement ou connectez-vous pour suivre ce cours et faire ce quiz.
Créer un compteSe connecter

Question 1

Question 2