forked from larryhynes/nojpeg
-
Notifications
You must be signed in to change notification settings - Fork 0
/
nojpegptpt.html
173 lines (140 loc) · 7.28 KB
/
nojpegptpt.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
<!doctype html>
<html lang="EN">
<head>
<meta charset="utf-8">
<title>NoJPEG</title>
<meta name="description" content="NoJPEG.org – Porque é que não quer utilizar um JPEG para o seu logotipo">
<meta name="author" content="António Pinto">
<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>NãoJPEG</h1>
<h3>Porque é que não deve de utilizar ficheiros JPEG no seu logotipo.</h3>
<p>Alguma vez pensou porque é que os designers estão sempre a pedir pelo ficheiro EPS?</p>
<p>Utilize a tecla de seta →, ou clique no botão azul lá em baixo.</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="nojpegnl.html">Nederlands</a>, <a href="nojpegru.html">Русский</a>, <a href="nojpegtr.html">Türkçe</a>.</p>
</section>
<section>
<h2>Então temos um logotipo...</h2>
<img src="img/NoJPEG.jpg" width="400" height="267" alt="NoJPEG">
<p>E é um ficheiro JPEG.</p>
<p class="fragment">Então tem um fundo branco.</p>
<p class="fragment">O que não é bom.</p>
</section>
<section>
<h2>Nós não queremos um fundo branco.</h2>
<img src="img/slide.jpg" width="400" height="267" alt="Slide">
<p>Quero dizer. E se pretendermos utilizar o logotipo num fundo colorido?</p>
<p class="fragment">Yep, estamos presos ao fundo branco do logotipo.</p>
</section>
<section>
<h2>O que acontecia com um ficheiro EPS?</h2>
<img src="img/slide2.jpg" width="400" height="267" alt="Slide2">
<p>Ta-da! Sem fundo branco.</p>
<p class="fragment">Espere! Há mais!</p>
</section>
<section>
<h2>O que acontece se aumentar um ficheiro JPEG?</h2>
<img src="img/pixeljpeg.jpg" width="400" height="267" alt="Pixellated JPEG">
<p>fica desfocado e horrível!</p>
</section>
<section>
<h2>E se aumentar um ficheiro EPS?</h2>
<img src="img/slide3.jpg" width="400" height="267" alt="Slide3">
<p>Ta-da! Podemos aumentar um ficheiro EPS <i>infinitamente</i> que irá manter-se nítido e claro.</p>
</section>
<section>
<h2>Outro problema do ficheiro JPEG</h2>
<img src="img/NoJPEG_compressed.jpg" alt="compressed JPEG">
<p>Devido ao JPEG ser um ficheiro com um formato de compressão “lossy”, pode perder qualidade no seu logotipo.</p>
</section>
<section>
<h2>“Mas eu não consigo visualizar um ficheiro EPS!”</h2>
<p>É verdade. Os ficheiros EPS são uma espécie de formato Profissional. É possível que não o consiga abrir.</p>
<p>(Mas fique descansado que todos os designers, gráficas, e programadores web conseguem abrir o ficheiro)</p>
<p>Então o que fazemos?</p>
</section>
<section>
<h2>Diga olá aos...</h2>
<img src="img/png.jpg" width="400" height="267" alt="PNG">
<p>Ficheiros PNG. Tal como o JPEG pode abrir, visualizar e utilizar nos seus ficheiros internos, apresentações, etc.</p>
<p class="fragment">E sem fundos brancos – Yay!</p>
</section>
<section>
<h2>“Então, está a dizer que eu necessito de dois ficheiros de logotipo?”</h2>
<p>Sim.</p>
<ol>
<li>Um ficheiro EPS para designers, gráficas e outros profissionais</li>
<li>Um ficheiro PNG para utilização interna, apresentações, etc.</li>
</ol>
</section>
<section>
<h2>Não acredita em mim?</h2>
<p>Vamos perguntar ao Twitter como é que eles fazem.</p>
<img src="img/twitter.png" alt="Twitter">
<p>EPS e PNG. (E são pessoas inteligentes.)</p>
</section>
<section>
<h2>Isto é um pouco mais técnico do que esta apresentação faz parecer.</h2>
<p>Mas não se preocupe com isso tudo por agora. Certifique-se apenas de que tem o seu logotipo em um ficheiro <i>vectorial</i> EPS e um PNG com fundo <i>transparente</i>.</p>
<p>E pronto! Divirta-se</p>
</section>
<section>
<h2>Outras opções a considerar...</h2>
<p>Tanto ficheiros SVG e PDF são formatos que podem ser utilizados com eficiência para gerir a sua entidade online e impressa... pergunte ao seu designer favorito por detalhes.</p>
<p>(Isto <i>não</i> significa que pode por um ficheiro JPEG num documento Word e guarda-lo como PDF.)</p>
</section>
<section>
<h1>Créditos</h1>
<p>Trazido até si por <a href="http://larryhynes.com/about.html">Larry Hynes</a>.</p>
<p>Criado com o único e poderoso <a href="http://lab.hakim.se/reveal-js/#/">Reveal.js</a>.</p>
<p>Inspirado por <a href="http://no-www.org/">no-www.org</a>.</p>
<p>Agradecimentos a<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> e Al Haigh pelo feedback e sugestões.</p>
<p>Envolva-se em <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>