• 検索結果がありません。

HTML5プロフェッショナル認定試験 レベル1 ポイント解説セミナー

N/A
N/A
Info
ダウンロード
Protected

Academic year: 2018

シェア "HTML5プロフェッショナル認定試験 レベル1 ポイント解説セミナー"

Copied!
54
0
0

読み込み中.... (全文を見る)

今ダウンロードする ( 54 ページ )

全文

(1)
(2)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

2

認定校

認定資格

合格者

Lv1: 27

Lv2: 5

※

2017

年

6

月現在

(3)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

3

(4)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(5)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

5

HTML4.01

比べ

複雑

処理

容易

文書構

造

明確

書

う

•

動画や音声

ン

扱え

う

•

新

属性

増え

周

機能

強化さ

•

文書構造

表す

増え

明確

文書構造

示す

う

•

様々

API

追加さ

高

機能

持

(6)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(7)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(8)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

8

Lv.1

•

•

•

(9)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(10)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

10

(11)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(12)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(13)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(14)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

14

•

(15)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(16)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

16

•

(17)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(18)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

18

(19)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(20)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

20

•

(21)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(22)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(23)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

23

合否結果

(24)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(25)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

25

⇒

⇒

(26)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(27)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(28)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

28

HTTP

通信

●●

情報ほしい！＆

HTTP

＇

●●

情報あ

！＆

HTTP

ン

＇

開発者

使う

ソ

＆

GET POST

等＇や

コ

＆

200 404

等＇

確認

す

す

(29)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

29

HTTP,HTTPS

違い

https

s

Secure

＝

安全

いう意味

暗号化し

状態

通信し

い

す

運営す

側

し

多少

予算

す

信

性

セキ

向

い

あ

す

検索

ン

ン

今後

https

否

評価

変わ

動

見せ

い

す

入力

い静的

SSL

入す

増え

(30)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

30

DOCTYPE

宣言

文書

ン

HTML

や

XHTML

作成さ

い

示す記述

す

HTML5

ン

書

方

し

あ

す

•

基本形

<!DOCTYPE

＋

1

個以

ペ

＋

HTML

＋

0

個以

ペ

＋

>

•

大文字

文字

問わ

い

•

HTML

含

い

い

い

○

<!doctype

␣

html>

○

<!DOCTYPE

␣

HTML >

×

<!doctype>

※

html

い

(31)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

31

文字コ

指定

<

meta

charset

=

"UTF-8"

>

値

し

utf-8,shift_jis,euc-jp

あ

す

(32)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(33)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

33

セ

E:nth-child(n)

n

E:nth-of-type(n)

E

n

E ~ F

E

F

E > F

E

F

E + F

E

F

E[foo]

foo

E

(34)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

34

nth-child nth-of-type

違い

div p

:nth-child

(

5

){

color

:

red

;

}

div p

:nth-of-type

(

5

){

color

:

red

;

}

<

div

>

<

p

>1

目

p

</

p

>

<

p

>2

目

p

</

p

>

<

p

>3

目

p

</

p

>

<

h6

>

間

h6

</

h6

>

<

p

>

4

目

p

</

p

>

<

p

>5

目

p

</

p

>

<

p

>6

目

p

</

p

>

</

div

>

<

div

>

<

p

>1

目

p

</

p

>

<

p

>2

目

p

</

p

>

<

p

>3

目

p

</

p

>

<

h6

>

間

h6

</

h6

>

<

p

>4

目

p

</

p

>

<

p

>

5

目

p

</

p

>

<

p

>6

目

p

</

p

>

(35)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

35

ン

•

css

実装可能

•

単純

ン

JavaScript

利用す

簡単

実装

•

JavaScript

書

い人

ン

実装

(36)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

36

２

機能

div

{

animation

: name

1s

ease infinite alternate

;

}

@keyframes

name

{

0%

{

width

:

50px

; }

50%

{

width

:

100px

; }

(37)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(38)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

38

セ

ン

コン

ン

HTML5

文書構造

明確

す

追加さ

し

セ

ン

コン

ン

セ

ン

範

定義す

コン

ン

す

あく

構造

表す

目的

使用

避

し

う

(39)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

39

ン

コン

ン

操作

コン

ン

す

＆

記

controls

属性

付

し

場合＇

<

video

controls autoplay poster=

"image.jpg"

>

<

source

src=

"sample.mp4"

>

<

source

src=

"sample.ogv"

>

<

source

src=

"sample.webm"

>

<

p

>

動画

再生す

video

し

必要

す

</

p

>

(40)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(41)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

41

〇

•

URL

一

設定

要

•

1

ソ

管理

ン

ン

容易

△

•

1

ソ

作成す

考慮し

設計

ン

し

い

構築し

く

•

毎

使用し

い

画像

多くあ

場合

数

多く

(42)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

42

css2

大

用

指定す

し

ン

普及さ

あ

機能

強化さ

し

Javascript

対応す

方法

あ

す

使えば

ン

振

分

す

(43)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

43

@media

screen

and

(

max-width

:

320

px

){

幅

320px

以

適用

}

@media

screen

and

(

min-width

:

321

px

)

and

(

max-width

:

768

px

){

幅

321px

以

768px

以

適用

}

@media

screen

and

(

orientation

:

portrait

) {

向

縦

場合

}

@media

screen

and

(

orientation

:

landscape

) {

向

横

場合

}

(44)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

44

1

2

3

1

2

(45)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(46)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

46

ン

ン

ン状態

ン

利用

う

す

キャ

いう仕様

追加さ

し

キャ

コン

し

負荷

軽減し

ン時

動作す

ン

作

可能

(47)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

47

作成

•

一般的

拡張子

appcache

•

文字コ

utf-8

•

1

行目

CACHE MANIFEST

記述

•

セ

ン

分

指定

<

html

manifest

=

sample.appcache"

>

一般的

.htaccess

しく

MIME

text/cache-manifest

あ

指定

(48)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

48

Canvas

系

API

一

し

Canvas API

あ

す

<canvas>

要素

html

配置し

javascript

使用し

形

文

字

描画し色や影

回転させ

可能

す

ンさせ

す

実際

Canvas API

機能

く

javascript

描画自体

繰

返し

実現させ

す

WebGL

＆

3DCG

ン

＇

利用す

(49)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(50)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

50

教材：

LPI-Japan HTML5

認定教材

使う＆

くさ

教材

あ

自分

合

使い

し

う＇

実際

書く：

JS Bin CodePen

即

確認

ビ

使えば捗

す

7

割以

合格

配点

高い＆重要

高い＇部分

重点

(51)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

51

私

未経験

業界

飛び込

Web

詳しく

基本的

知識

浅い

業

務

し

い

し

試験

知識

幅

広

Web

対し

理解

深

し

実務作業

活

せ

知識

身

是非

(52)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(53)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

(54)

© LPI-Japan 2017. All rights reserved. The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/

54

参照

今ダウンロードする ( PDF - 54 ページ - 3.52 MB )

関連したドキュメント

The couplings of the Cahn-Hilliard equation with other basic modelling equations have been proposed in various situations to study complicated phenomena in fluid mechanics involving phase transition

In this section, we establish some uniform-in-time energy estimates of the solu- tion under the condition α − F 3 c 0 &gt; 0, based on which the exponential decay rate of the

Thus the dimension of the problem is reduced by one

In section 2 we present the model in its original form and establish an equivalent formulation using boundary integrals. This is then used to devise a semi-implicit algorithm

The diffusion interaction length relative to the size of the domain is given by a parameter

Theorem 4.8 shows that the addition of the nonlocal term to local diffusion pro- duces similar early pattern results when compared to the pure local case considered in [33].. Lemma

The unique solvability of the problem is established

Kilbas; Conditions of the existence of a classical solution of a Cauchy type problem for the diffusion equation with the Riemann-Liouville partial derivative, Differential Equations,

THE MOMENTS OF THE AREA UNDER REFLECTED

This paper develops a recursion formula for the conditional moments of the area under the absolute value of Brownian bridge given the local time at 0.. The method of power series

1, and ∂ν∂ is the outer normal derivative

The study of the eigenvalue problem when the nonlinear term is placed in the equation, that is when one considers a quasilinear problem of the form −∆ p u = λ|u| p−2 u with

This is also given by the rotation of the Pr¨ufer phaseeıθxE in the spatial coordinatex

Classical Sturm oscillation theory states that the number of oscillations of the fundamental solutions of a regular Sturm-Liouville equation at energy E and over a (possibly

A natural question is whether it is possible to accelerate the spreading by charging the drops and what the influence of the charge is on the shape of the drop [1]

We will study the spreading of a charged microdroplet using the lubrication approximation which assumes that the fluid spreads over a solid surface and that the droplet is thin so