Skip to content

Latest commit

 

History

History
59 lines (39 loc) · 2.48 KB

README.md

File metadata and controls

59 lines (39 loc) · 2.48 KB

Hyundai Consumer Awareness

icon of a template Template

More info coming soon.

Features

  • Responsive layout to adapt to different screensizes and devices
  • Separate banners to support Art Direction
  • Progressively enhanced:
    • Background images
    • Web fonts
  • Hover-over effects for video thumbnails and CTAs
  • More info to come

Challenges and Solutions

Coming soon.

Responsive Layouts

To view responsive layouts, there are three options:

  1. View screenshots various screen widths.
  2. Use a web browser's DevTools to simulate different layouts.
  3. Manually resize the browser.

1. Screenshots

The following are screenshots of each template at various screen widths.

320px | 360px | 375px | 414px | 480px | 600px | 768px

2. DevTools

To open the browser's DevTools, press F12 or Control+Shift+I (Windows, Linux) or ⌘+Option+I (macOS).

Note that simulations only give an approximation of the mobile or device user experience while using a web browser.

How to use DevTool: Chrome | Firefox | Microsoft Edge | Safari

3. Resize the browser

Note that using a web browser only gives an approximation of the mobile or device user experience in a web browser.