#

# Make a Keynote presentation using HTML

WebSlides is an open source framework for building HTML presentations, landings, and portfolios.

`.bg-apple`

## HTML presentations can be easy

## Features

- ## → Simple Navigation

  with arrow keys and swipe.

- ##
  Permalinks

  Go to a specific slide.

- ##
  Slide Counter

  Current/Total number

- ## 40+ Beautiful Components

  Covers, cards, quotes...

- ##
  Vertical Rhythm

  Use multiples of 8.

- ## 500+ SVG Icons

  Font Awesome Kit.

## WebSlides was made to inspire people.

WebSlides is a wonderful way to showcase your company. All content is for demo purposes only. Images are property of their respective owners.

## WebSlides help you build a culture of excellence.

The art of storytelling. Hypertext, clean code, and beauty as narrative elements. Just essential features and lovely CSS. All content is for demo purposes only.

- Founded 1976
- 524M Subscribers
- Revenue: $16M
- Monthly Growth 64%

- Founded 1976
- 524M Subscribers
- Revenue: $16M
- Monthly Growth 64%
- 6 Offices
- 14K Employees
- $4M EBITDA
- Bank: $76B

## 3,456,789

### iPhone 7 in first 24 hours

## $48 Billion

### Revenue in Q4 2024

## 1,000,000

### We're working to protect up to a million acres of sustainable forest.

##
iPhone 7

3D Touch, 12MP photos, and 4K video.

Every iPhone they have made was built on the same belief. That a phone should be more than a collection of features. That, above all, a phone should be absolutely simple, beautiful, and magical to use.

##
iPhone 7

We worked closely with the very talented people at Acme and created a new website. Content demo.

- Client: Apple (2016)
- Services: Web Design
- Website: apple.com/iphone

- ## Ultra-Fast WiFi

  Faster LTE with the best worldwide roaming.

- ## Two cameras that shoot as one.

  12MP wide angle.

- ## Lifetime Warranty

  We'll fix it or if we can't, we'll replace it.

#
Pay

## Redesigning
Pay

We've been working with the Acme team over the last three months to build a new app.

Case study › Open site ›

## Payments Made Simple

Apple Pay is so easy. Pay with your debit cards and credit cards with just a touch.

### Secure

Your card is never stored. Apple Pay uses a device-specific number and unique transaction code.

### Universal

Apple Pay works with most major credit and debit cards from nearly all banks.

- ## Incredibly fast

  Just hold your iPhone near the reader.

- ## Works with all major banks

  Apple Pay is accepted in restaurants, hotels...

- ## The safer way to pay

  Your card number is never stored.

#
Pay

Use your iPhone to pay securely and easily at over a million store locations and within apps — with a single touch. See where you can use Apple Pay:

> I'm an optimist in the sense that I believe humans are noble and honorable, and some of them are really smart. I have a very optimistic view of individuals.

> Steve Jobs.

> “We see that privacy is a fundamental human right that people have. We are going to do everything that we can to help maintain that trust.”

> Tim Cook, CEO of Apple.

Header .alignright

## Simple CSS Alignments

Put content wherever you want.

### 1/9 left top

Put content wherever you want. Have less. Do more. Create beautiful solutions.

`.slide-top and .content-left`

### 2/9 center top

Apple I was designed and hand-built by Steve Wozniak. Steve Jobs had the idea of selling the computer.

`.slide-top and .content-center`

### 3/9 right top

The Apple II is one of the first highly successful computers.

`.slide-top and .content-right`

### 4/9 left center

The Apple III is a business-oriented personal computer that was intended as the successor to the Apple II series.

`.content-left`

### 5/9 center

Apple Lisa was one of the first personal computers to offer a graphical user interface.

`.content-center`

### 6/9 right center

The Macintosh was the company's first mass-market personal computer featuring a GUI and mouse.

`.content-right`

### 7/9 left bottom

The iBook was a line of laptop computers designed and marketed by Apple Inc. from 1999 to 2006.

`.slide-bottom` and `.content-left`

### 8/9 center bottom

Apple introduced the first generation iPod on October 23, 2001, with the slogan "1,000 songs in your pocket".

`.slide-bottom` and `.content-center`

### 9/9 right bottom

The original iPhone was introduced by Steve Jobs on January 9, 2007. Jobs introduced the iPhone as a combination of three devices.

`.slide-bottom` and `.content-right`

## CSS Animations

Fadein transition to all slides.

    <article id="webslides">
      <section>
        <div class="wrap fadeInUp">
          <h1>Slide</h1>
        </div>
      </section>
    </article>

Just 5 basic animations: .fadeIn, .fadeInUp, .zoomIn, .slideInLeft, and .slideInRight.

## Embedding Media

### YouTube API

Embed videos with loop, autoplay, and muted attributes. The video will automatically play when the slide is loaded.

    <div class="embed">
     <div data-youtube data-youtube-id="CQY3KUR3VzM" data-autoplay ></div>
    </div>

`.embed` (responsive)

## Be Awesome

## Think Different

Overlay: `fullscreen.bg-black > .embed.dark` or .light

# One more thing...

Ag

San Francisco

### The quick brown fox jumps over the lazy dog.

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

1234567890(,.;:?!$&*)

## Start in seconds

120+ prebuilt slides ready to use.

Free Download
Pay what you want.

## 😎

### Thank you!

@WebSlides