Front End Development Research & Evidence-Based Practice 5 — Questions and Answers
Question 1: What does 'Largest Contentful Paint' (LCP) measure and what is the 'good' threshold per Google?
- Time for all images to load; under 3 seconds
- Time for the largest visible content element to render; under 2.5 seconds (Correct answer)
- Time for the DOM to be fully parsed; under 1 second
- Time for JavaScript execution; under 5 seconds
Correct answer: Time for the largest visible content element to render; under 2.5 seconds
LCP measures when the largest content element (image, video, or text block) becomes visible; Google considers under 2.5 seconds 'good' for Core Web Vitals.
Question 2: In UX research, what distinguishes 'formative' research from 'summative' research?
- Formative uses surveys; summative uses interviews
- Formative informs design decisions during development; summative evaluates a finished product against benchmarks (Correct answer)
- Formative tests back-end APIs; summative tests front-end UI
- Formative is qualitative; summative is always quantitative
Correct answer: Formative informs design decisions during development; summative evaluates a finished product against benchmarks
Formative research shapes the design process (e.g., early usability tests), while summative research measures the outcome of a completed design against defined success metrics.
Question 3: What is a 'heatmap' in front-end analytics research and what does it reveal?
- A server performance chart showing CPU temperature over time
- A visual overlay showing aggregate user interaction patterns like clicks, taps, and scroll depth (Correct answer)
- A color-coded CSS specificity chart
- A map of API endpoint response times
Correct answer: A visual overlay showing aggregate user interaction patterns like clicks, taps, and scroll depth
Heatmaps aggregate thousands of user interactions into a color-coded visualization revealing which areas attract clicks, attention, or scroll engagement.
Question 4: What research principle does the 'F-pattern' eye-tracking finding inform for front-end layout design?
- Users prefer floating navigation menus
- Users scan web pages in an F-shaped pattern, so critical content should be placed in the top and left areas (Correct answer)
- Forms should be organized in an F-shape for better completion rates
- JavaScript should be loaded in an F-pattern for performance
Correct answer: Users scan web pages in an F-shaped pattern, so critical content should be placed in the top and left areas
Nielsen Norman Group's eye-tracking research revealed users scan text content in an F-shaped pattern, making the top rows and left edge prime locations for important information.
Question 5: What is the 'jobs-to-be-done' (JTBD) framework used for in front-end product research?
- Assigning development tasks in a sprint backlog
- Understanding the underlying goal or problem a user is trying to solve when they use a product (Correct answer)
- Defining CI/CD pipeline job configurations
- Documenting browser compatibility job requirements
Correct answer: Understanding the underlying goal or problem a user is trying to solve when they use a product
JTBD shifts focus from user demographics to the functional and emotional goals ('jobs') users are trying to accomplish, leading to more user-centered design decisions.
Question 6: What does 'multivariate testing' offer over standard A/B testing in front-end optimization?
- It tests across multiple browsers simultaneously
- It tests multiple variables simultaneously to find the best-performing combination of elements (Correct answer)
- It is faster because it requires fewer users
- It does not require statistical analysis to interpret results
Correct answer: It tests multiple variables simultaneously to find the best-performing combination of elements
Multivariate testing varies multiple page elements at once (e.g., headline, image, and CTA button color), revealing which combination of changes produces the best outcome.
Question 7: Which accessibility research standard provides guidelines for making web content perceivable, operable, understandable, and robust?
- HTTP/2 specification
- Web Content Accessibility Guidelines (WCAG) (Correct answer)
- Ecma International ECMAScript standard
- W3C CSS Snapshot
Correct answer: Web Content Accessibility Guidelines (WCAG)
WCAG, published by the W3C, is the internationally recognized standard organized around four principles (POUR) that define accessible web content.
Front End Development Research & Evidence-Based Practice 5
What does 'Largest Contentful Paint' (LCP) measure and what is the 'good' threshold per Google?