I've seen the future

It's in my browser

#1

Why?

  • The web
  • The open web platform
  • The web community

A little bit of history

Internet

vs.

Web

The early days

  • 1960s - ARPANET is created
  • 1972 - e-mail is created
  • 1974 - the Internet is born

1988: The Web is born

Sir Tim Berners-Lee

Lesson #1

Documents

What is a document?

Documents are structured, semantic representations of text, images and hyperlinks

What is HTML?

HyperText Markup Language

HTML example

<h1>Bestseller</h1>
<h2>Shop fashion clothes</h2>
<p>
    Welcome to the bestseller.com website. 
    You can contact us through the 
    <a href="http://www.bestseller.com/contact">
        contact page
    </a>.
</p>

Anatomy of an element

<h1>Bestseller</h1>

opening tag

closing tag

content

https://developer.mozilla.org/en-US/docs/Web/HTML/Element

Attributes

<h1 class="subbrand">JJ Premium</h1>

attribute

Global Attributes

  • class
  • data-*
  • id
  • style
  • tabindex
  • title

Tag specific Attributes

<a href="...">A link</a>

<input type="text">

Void elements

Void elements are elements that cannot carry any content

<br> or <br />

<input> or <input />

<br></br>

<input></input>

Normal elements

<h1></h1>

<h1 />

Separation of concerns

HTML

CSS

Javascript

Content

Presentation

Logic

Practice time

http://codepen.io

Write the following blog page on codepen.io

Title

APPRENTICE EDUCATION TURNS 10

Author

<your name>

Published at

Wednesday, 18/11 18:00

Image

http://about.bestseller.com/~/media/11468FFE186A423BAD62E6A0F3DCB8E3.jpg

Throughout the years, 152 buying apprentices, 126 sales apprentices and 793 store apprentices have completed the unique BESTSELLER education programme – a setup giving the trainers and teachers the opportunity to create courses that are highly relevant and directed specifically towards working in BESTSELLER.

Besides giving the apprentices the best possible education, this setup helps ensure that apprentices are more likely to stay with BESTSELLER after they have finished their education. The statistics show that 98 of the 152 buying apprentices and 58 of 126 sales apprentices are still working in the BESTSELLER organisation today. 

Text

Link to original article

http://www.about.bestseller.com/News/2014/11/APPRENTICE-EDUCATION-TURNS-10.aspx

Summary

  • The web is a huge collection of connected documents
  • HTML is used to describe what the content is about and not what the content looks like
  • HTML is easy to learn but hard to master

The end

See you next time

I've see the future, it's in my browser

By Nikos Zinas

Made with Slides.com

I've see the future, it's in my browser

Series of courses for the non-developers, #1

  • 1,083

More from Nikos Zinas