The Web Is Here To Stay (Maybe)

@KuraFire

Presentate

The Web Is Here To Stay

(Maybe)

Faruk Ateş is a Person (^^)

I make things

You probably make things, too

I am not a great
JavaScript developer

Many successful things
are not more innovative, but…

More empathetic

Web Standards [Project]

FACE: CSS animations (with a dash of JavaScript)

What's new in Modernizr 3?

Everything, and nothing! (Useful, eh?)

Still the same approach

if (Modernizr.geolocation) {
  // geolocation is supported
}
else {
  // geolocation is *not* supported
}

And also in CSS:

<button class="glossy">Click Me!</button>
.glossy {
  background: url("img/glossybg.png");
}

.cssgradients .glossy {
  background-image: linear-gradient(top, #555, #333);
}

All test names are harmonized

Modernizr.lowercaseandnomorehyphens

All tests are equal

No more community-detects; faster than Modernizr.addTest

Use it locally or on a server

// modernizr.json
{
  "classPrefix": "my-"
  "options": ["load", "html5printshiv"],
  "tests": ["audio", "video", "cssgradients"]
}
npm install -g modernizr
modernizr modernizr.json > modernizr.custom.js

Callbacks for async tests!

Modernizr.on('flash', function( result ) {
  if (result) {
   // the browser has flash
  } else {
    // the browser does not have flash
  }
});

Modernizr 3: bonus

Touch Events, Pointer Events, and CSS Pointer Events

(No more unreliable Modernizr.touch)

DON'T use the development version in production

(Or maybe ever)

Feedback? Send Pull Requests!

The Web’s Childhood

Web ← Idea ← Synapses connecting neurons

Ideas ← Humans (Not exclusive IP)

Humans ← Natural Resources

Natural Resources ← The Universe

The Universe ← God(s)?

The Universe ← Nothing?

The Universe ← ……Rule 34?

Intergalactic Porn!

The Web is like an organism

State of the Web

Technology + Humanity

Spec writers, OSS creators

It’s gotten much better

Specifications are much better these days

OSS is…well…

The Web’s Adolescence

There are lots of
simplistic arguments…

“This JavaScript library is the best!"
“No, this one!"

One CSS file to rule them all!

Should you buy/use product X?

“Yes” and “No” are terrible answers to this question

Should you buy/use product X?

“It depends on your needs! These are pros, these are cons“

The Web is growing up

“Mac vs. PC?” Who cares!?

(Don’t be someone who does)

Android vs. iPhone vs. Windows Phone

FIGHT!

“That’s a nice wheel you have there. I’m gonna make a better one! It'll do exactly the same.”

UI Libraries

20~ popular ones

There is value in diversity of choice

But more value in depth

Great documentation & examples

Open Source project README’s

Getting the basics right

Work with the DOM?

Know your HTML Semantics & Accessibility!

<div tabindex="0" class="NewAnnotations DossierComments">
  <div class="tkCommentsDCP">
    <form class="tkActiveTextarea">
      <textarea placeholder="Add new comment..." class=""></textarea>
    </form>
    <div class="commentBtn">
      <li tabindex="0" role="button" title="Add comment" class="btn iconDisabled button button--primary">
        <a class="icon "></a>
        <span class="button__label">Add comment</span>
      </li>
    </div>
  </div>
</div>

Bad HTML & CSS will break
the user experience

Front-end development is a holistic discipline

Gold Rush to Web Applications

Don’t Hijack Browser Behaviors

(Unless you really, really know what you’re doing)

<!-- This is terrible: -->
<span aria-role="button" role="button" id="nav-home" tabindex="0">
    <i class="icon icon-home"></i>
</span>

<!-- This is much better: -->
<a href="/" id="nav-home">
    <i class="icon icon-home"></i>
    <span class="label">Home</span>
</a>

Make HTML and CSS
work for you

Native semantic elements are quite capable

The Web’s Third Act

Facebook Instant Articles

Are we bad developers?

(Or are we dancer?)

The blame goes both ways

Content Blockers

Content Blockers are a
human-oriented solution

Quick, find someone to blame for this predicament!

“JavaScript tools are bad/evil/the devil. Don't use tools!”

We all have a responsibility

Don't [Fix] The Comments

Moderation + Oversight
+ Technology + Design

Be opinionated when
making tools

Make products to help people become better

If we don't put humanity in our

PRODUCTS

we slowly kill it in our

USERS

“Inclusive” does not mean bland or generic

Meritocracy

[In a Meritocracy] “there is an obsession with quantification, test-scoring, and qualifications.”

— Michael Young, 1958

We can’t properly define “merit”

(without being omniscient)

Our idea of “merit" is myopic

The best at one thing but the worst at another cancels itself out
Closing thought

So… The Web. What’s happening to it?

Liked this talk? Share it!

  •   / 72

Published on , Last updated:

Share this presentation