forked from larryhynes/nojpeg
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathnojpegnl.html
183 lines (150 loc) · 6.84 KB
/
nojpegnl.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
<!doctype html>
<html lang="NL">
<head>
<meta charset="utf-8">
<title>NoJPEG</title>
<meta name="description" content="NoJPEG.org – Waarom je geen JPEG voor je logo wilt gebruiken…">
<meta name="author" content="Jasper van der Meer">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="reveal/css/reveal.min.css">
<link rel="stylesheet" href="reveal/css/theme/nojpeg.css" id="theme">
<!-- Printing and PDF exports -->
<script>
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = window.location.search.match( /print-pdf/gi ) ? 'reveal/css/print/pdf.css' : 'reveal/css/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
</script>
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="apple-mobile-web-app-title" content="NoJPEG">
<meta name="application-name" content="NoJPEG">
<meta name="theme-color" content="#ffffff">
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section>
<h1>NoJPEG</h1>
<h3>Waarom je geen JPEG voor je logo wilt gebruiken.</h3>
<p>Heb je je ooit afgevraagd waarom grafisch vormgevers om een EPS bestand blijven vragen?</p>
<p>Je kunt de → toets gebruiken om door te gaan of klik op het kleine blauwe driehoekje onderaan.</p>
<p><a href="nojpegcz.html">Česky</a>,
<a href="nojpegptpt.html">Português</a>,
<a href="nojpegpt.html">Português Brasileiro</a>,
<a href="nojpegit.html">Italiano</a>,
<a href="nojpeges.html">Español</a>,
<a href="nojpegfr.html">Francais</a>,
<a href="nojpeggl.html">Galego</a>,
<a href="nojpegca.html">Català</a>,
<a href="nojpeg.html">English</a>,
<a href="nojpegru.html">Русский</a>,
<a href="nojpegtr.html">Türkçe</a>.</p>
</section>
<section>
<h2>Dus we hebben een logo…</h2>
<img src="img/NoJPEG.jpg" width="400" height="267" alt="NoJPEG">
<p>En het is een JPEG bestand.</p>
<p class="fragment">Dus het heeft een ingebouwde witte achtergrond.</p>
<p class="fragment">Dat is niet cool.</p>
</section>
<section>
<h2>Wij willen geen witte achtergrond</h2>
<img src="img/slide.jpg" width="400" height="267" alt="Slide">
<p>Ik bedoel, wat als we ons logo op een gekleurde achtergrond willen gebruiken?</p>
<p class="fragment">Juist, dan zitten we met dat witte vlak erachter.</p>
</section>
<section>
<h2>Wat gebeurt er als we een EPS bestand gebruiken?</h2>
<img src="img/slide2.jpg" width="400" height="267" alt="Slide2">
<p>Ta-da! Geen witte achtergrond.</p>
<p class="fragment">Maar wacht – Er is meer!</p>
</section>
<section>
<h2>Wat gebeurt er als we een JPEG vergroten?</h2>
<img src="img/pixeljpeg.jpg" width="400" height="267" alt="Pixellated JPEG">
<p>Dan wordt het wazig, korrelig en vreselijk!</p>
</section>
<section>
<h2>en als we een EPS bestand vergroten?</h2>
<img src="img/slide3.jpg" width="400" height="267" alt="Slide3">
<p>Ta-da! We kunnen een EPS bestand <i>eindeloos</i> vergroten en het zal scherp en helder blijven.</p>
</section>
<section>
<h2>Nog een nadeel van het gebruik van JPEG</h2>
<img src="img/NoJPEG_compressed.jpg" alt="compressed JPEG">
<p>Omdat JPEG een “lossy” compressieformaat is, bestaat er de mogelijkheid tot kwaliteitsverlies in je werk.</p>
</section>
<section>
<h2>“Maar ik kan een EPS bestand niet openen!”</h2>
<p>Ja, dat klopt. EPS bestanden zijn best wel een professioneel bestandsformaat en de kans bestaat dat je hem niet kunt openen.</p>
<p>(Maar troost je in de gedachte dat elke ontwerper, drukker, grafisch vormgever en webdesigner dat wel kan.)</p>
<p>Dus wat doen we?</p>
</section>
<section>
<h2>Mogen wij even voorstellen…</h2>
<img src="img/png.jpg" width="400" height="267" alt="PNG">
<p>PNG bestanden. 't Is net een JPEG, dus je kunt ze gebruiken in je interne bestanden, presentaties, enz.</p>
<p class="fragment">Maar zonder witte achtergrond – Yay!</p>
</section>
<section>
<h2>“Dus je zegt eigenlijk dat we twee bestanden nodig hebben?”</h2>
<p>Ja.</p>
<ol>
<li>Een EPS bestand voor drukkers, ontwerpers, grafisch vormgevers en andere professionals</li>
<li>een PNG bestand voor intern gebruik, presentaties, enz.</li>
</ol>
</section>
<section>
<h2>Geloof je me niet?</h2>
<p>Laten we aan Twitter vragen hoe zij het doen.</p>
<img src="img/twitter.png" alt="Twitter">
<p>EPS en PNG. (En die gasten zijn slim.)</p>
</section>
<section>
<h2>Het zit een beetje ingewikkelder in elkaar als dat deze presentatie het je voorschotelt</h2>
<p>Maar negeer dat maar voor nu. Zorg er gewoon voor dat je een <i>vector</i> EPS bestand en een PNG bestand met een <i>transparents</i> achtergrond hebt voor je logo.</p>
<p>Je bent er helemaal klaar voor – Veel plezier!</p>
</section>
<section>
<h2>Andere opties om te bekijken…</h2>
<p>Zowel het SVG als het PDF formaat kunnen gebruikt worden om je identiteit in zowel print als web te beheren… Vraag je grafisch vormgever naar meer details.</p>
<p>(Dit betekent overigens <i>niet</i> dat je een JPEG bestand in een Word document kunt stoppen en het op kunt slaan als PDF.)</p>
</section>
<section>
<h1>Credits</h1>
<p>Uitvoering door <a href="http://larryhynes.com/about.html">Larry Hynes</a>.</p>
<p>Ontwikkeld met behulp van de oppermachtige <a href="http://lab.hakim.se/reveal-js/#/">Reveal.js</a>.</p>
<p>Geïnspireerd door <a href="http://no-www.org/">no-www.org</a>.</p>
<p>Met bedankjes aan <a href="https://twitter.com/joffley">@joffley</a>, <a href="https://twitter.com/bjango">@bjango</a>, <a href="https://twitter.com/jescalan">@jescalan</a>, <a href="https://twitter.com/arnauvp">@arnauvp</a> en Al Haigh voor opmerkingen en suggesties.</p>
<p>Waarom draag je niet iets bij via <a href="https://github.com/larryhynes/nojpeg">GitHub</a>?</p>
</section>
</div>
</div>
<script src="reveal/lib/js/head.min.js"></script>
<script src="reveal/js/reveal.min.js"></script>
<script>
// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
history: true,
transition: 'convex',
// Optional libraries used to extend on reveal.js
dependencies: [
{ src: 'reveal/lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'reveal/plugin/zoom-js/zoom.js', async: true },
]
});
</script>
</body>
</html>