-
Notifications
You must be signed in to change notification settings - Fork 0
/
digest.html
279 lines (268 loc) · 25.3 KB
/
digest.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
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8"/>
<title>Frontend Digest #24</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
font-family: 'Arial', sans-serif;
background-color: #F4F5F7;
}
img {
border: 0;
height: auto;
line-height: 100%;
text-decoration: none;
}
table {
border-collapse: collapse !important;
}
body, #bodyTable, #bodyCell {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
}
#bodyCell {
padding: 20px;
}
#templateContainer {
width: 600px;
}
h1 {
color: #1D1F26;
font-family: 'Arial', sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
line-height: 100%;
letter-spacing: normal;
padding-bottom: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
text-align: left;
text-transform: uppercase;
}
h2 {
color: #34BAED;
font-family: 'Arial', sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
line-height: 100%;
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
text-align: left;
}
h3 {
color: #000000;
font-family: 'Arial', sans-serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
line-height: 100%;
letter-spacing: normal;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
text-align: left;
}
.footerContent a:link, .footerContent a:visited {
color: #606060;
font-weight: normal;
text-decoration: underline;
}
a {
text-decoration: none;
color: #34BAED;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
<!-- <center>-->
<table id="bodyTable" align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" style="background-color: #F4F5F7;">
<tr>
<td id="bodyCell" align="center" valign="top">
<!-- BEGIN TEMPLATE //-->
<table id="templateContainer" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<!-- BEGIN HEADER //-->
<table id="templateHeader" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td valign="top" class="headerContent"><img id="headerImage" src="C:\Users\Egor\projects\frontendDigest\img\main_logo.png" style="width: 600px;"/></td>
</tr>
</table>
<!-- // END HEADER-->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- BEGIN BODY //-->
<table id="templateBody" border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #FFFFFF;">
<tr>
<td valign="top" style="color: #596378; font-family: 'Arial'; font-size: 13px; line-height: 150%; text-align: left;" class="bodyContent">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #FFFFFF; color: #596378; font-size: 13px; font-family: 'Arial';" class="section people">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #1D1F26; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #1D1F26; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">PEOPLE</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #DADDE4; padding-top: 20px; margin-top: 0px;" class="content">
<h3>Matt Mickiewicz</h3><img src="C:\Users\Egor\projects\frontendDigest\img\24\1.jpg" alt=""/>
<div style="font-family: 'Arial',sans-serif;"><p>Мэтт родился в Кракове, Польша. Он создал свой первый сайт в возрасте 14 лет, назывался он Webmaster-Resources.com, который в дальнейшем стал <a href='http://bit.ly/1zTNNOd'>SitePoint.com</a>. В 16 лет он съездил с матерью в Мельбурн, где встретил своего будущего бизнес-партнёра и со-основателя Mark Harbottle. В 16 он уже совершал около 10.000 рекламных сделок между уроками, поэтому он с трудом закончил школу, а в колледж даже не стал поступать.</p><p>В 2008 г. он отделил 99designs от SitePoint, которая выросла в 35млн компанию.</p><p>В 2009 г. Мэтт и Марк аннонсировали <a href='http://bit.ly/1zTNLWF'>Flippa.com</a>, крупнейшую площадку по покупке и продаже веб-сайтов.</p><p>В 2012 г. Мэтт стал сооснователем DeveloperAuction.com (позже был переименован в <a href='http://bit.ly/1pdvAYy'></a>hired.com), выросшей на 2.7 млн.</p><p>В 2011 г. Мэтт вошёл в тридцатку бизнесменов по мнению Forbes и INC, а 2012 – в тридцатку Smart Companies.</p><p>Он часто выступает на конференциях и семинарах по всему миру. На данный момент живёт в Канаде.</p><br/></div>
</div>
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#EBEDF1;color: #596378; font-size: 13px; font-family: 'Arial';" class="section javascript">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #1D1F26; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #1D1F26; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">CSS</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #34BAED; padding-top: 20px; margin-top: 0px;" class="articles">
<h2 style="margin-top: 10px;"><a href="http://bit.ly/XDNWaL">А как пишут CSS на гитхабе?</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Как настоящий верстала, вы наверняка сразу же жмете F12, как только видите симпатичный сайт. Однако Chrome Dev Tools не откроют вам всех тайн.. Именно поэтому Марк Отто взял и выложил всю правду про CSS сайта github.com<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1pdvBMb ">Красивый газетный лэйаут</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Лэйаут типичной печатной газеты очень привлекателен, но можно ли адекватно сверстать его для веба? На легендарном Элистапарте как раз вышла статья об этом.<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD7nx">RTL и прочие ужасы локализации</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Для кого-то может оказаться новостью, что не все языки предполагают письменность слева направо. А ведь жизнь непредсказуемая штука, глобализация идет семимильными шагами, и вот вы уже завтра можете обнаружить себя на проекте у арабского клиента. Говорите, не может быть такого? Ну что ж, почитайте тогда просто для развития про верстку RTL - right to left.<br/>
</div>
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#FFFFFF;color: #596378; font-size: 13px; font-family: 'Arial';" class="section javascript">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #1D1F26; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #1D1F26; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">User Experience</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #34BAED; padding-top: 20px; margin-top: 0px;" class="articles">
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD7ny">Creating distraction-free reading experiences</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Adrian Zumbrunnen написал статью о том, как создавать distraction-free reading experience. С самого начала он проводит аналогию чтения с игрой Flappy Bird. Суть в том, что для того, чтобы набирать в этой игре много очков, надо перестать отвлекаться на сами очки и сфокусироваться на игровом процессе — так у игрока будет больше шансов избежать столкновений с препятствиями. Вот так же и с людьми читающими статью, утверждает автор. Плохая типографика, слишком навязчивая реклама, неуместное использование анимации — все это отвлекает читателя раз за разом и заставляет его врезаться в эту чертову зеленую трубу и начинать все заново.<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD636">Триггеры – «спусковые крючки» принятия решений</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Перевод раздела сайта <a href='http://bit.ly/1pdvBMa'>zurb.com</a> о триггерах. Раздел представляет из себя коллекцию действенных психологических мотиваторов, когнитивных законов и поведенческих паттернов, позволяющий исследовать все возможности решения определённых задач, например, «Что нужно для того, чтобы пользователи захотели зарегистрироваться на сайте или совершить другое нужное нам действие?»<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD7nA">Susan Kare, Iconographer (EG8)</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Интересное выступление от интересного человека. Сьюзан Кэр рисовала первые иконки для Мака в 80-х годах. В своем выступлении она рассказывает о том, как она попала на работу в команду Макинтоша, как рисовала свои знаменитые пиктограммы и затрагивает некоторые ключевые принципы, которыми она руководствовалась в работе.<br/>
</div>
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#EBEDF1;color: #596378; font-size: 13px; font-family: 'Arial';" class="section javascript">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #1D1F26; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #1D1F26; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">Videos</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #34BAED; padding-top: 20px; margin-top: 0px;" class="articles">
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD637">Используем все возможности Chrome DevTools</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Paul Irish расскажет вам как использовать DevTools на полную катушку, в частности, продвинутые техники для профилирования производительности. Рекомендуем к просмотру.<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD7nz">Introduce to node streams</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>В этом небольшом туториале вы увидите как работать с потоками в NodeJS. Лектор расскажет как сделать собственные read, write, и transform потоки.<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD638">Swift for JavaScript Developers</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Swift - новый язык программирования от Apple. Долкадчик начинает с различий и схожести меджу языком Swift и JavaScript, и далее углубится в основыные понятия языков, такие как классы, коллбэки, безопастная типизация<br/>
</div>
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#FFFFFF;color: #596378; font-size: 13px; font-family: 'Arial';" class="section javascript">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #1D1F26; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #1D1F26; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">Interesting</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #34BAED; padding-top: 20px; margin-top: 0px;" class="articles">
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD7nB">СSS3 и мороженное</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>В такие жаркие дни никак не обойтись без мороженного. Советуем вам попробовать новый вкус с CSS3 наполнителем, изготовленного при помощи техники single div.<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1upD639">AngularJS vs EmberJS</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>Небольшой холивар на тему Ангуляр против Эмбер<br/>
<h2 style="margin-top: 10px;"><a href="http://bit.ly/1pdvAYu">3 New JavaScript APIs You May Want to Follow</a></h2>
<div style="font-family: 'Arial',sans-serif;"></div>JavaScript API появляются почти каждую неделю, что же на прошлой неделе появилось нового, на что вам нужно обратить внимание ;)<br/>
</div>
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #34BAED; color: #FFFFFF; font-size: 13px; font-family: 'Arial',sans-serif;" class="section links">
<tr>
<td style="padding-top: 30px; padding-right: 20px; padding-bottom: 30px; padding-left: 20px; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;">
<h1 style="border-bottom: none; color: #FFFFFF; padding-bottom: 0px; margin-bottom: 15px;" class="heading">
<table>
<tr>
<td style="color: #FFFFFF; font-family: 'Arial',sans-serif; font-size: 18px; font-style: normal; font-weight: bold; line-height: 100%; letter-spacing: normal; text-transform: uppercase;">Links</td>
</tr>
</table>
</h1>
<div style="border-top: 1px solid #FFFFFF; padding-top: 20px; margin-top: 0px;" class="content">
<div><a href="http://bit.ly/1pdvBMc" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Дайджест интересных материалов из мира веб-разработки и IT</a></div><br/>
<div><a href="http://bit.ly/1pdvAYv" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Полезные материалы для мобильного разработчика</a></div><br/>
<div><a href="http://bit.ly/1pdvBMd" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Дайджест интересных новостей и материалов из мира PHP</a></div><br/>
<div><a href="http://bit.ly/1pdvAYw" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Контроллеры директив в AngularJS</a></div><br/>
<div><a href="http://bit.ly/1pdvAYx" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» JavaScript to TypeScript — трудности перевода</a></div><br/>
<div><a href="http://bit.ly/1pdvBMe" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Xibalba: A WebGL First Person Shooter</a></div><br/>
<div><a href="http://bit.ly/1pdvAYz" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» The mobile playbook</a></div><br/>
<div><a href="http://bit.ly/1pdvAYA" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» 5 JavaScript APIs to Empower Your Mobile Web Pages</a></div><br/>
<div><a href="http://bit.ly/1pdvBMf" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» AngularJS Unit Testing - For Real, Though</a></div><br/>
<div><a href="http://bit.ly/1pdvAYB" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Eloquent JavaScript, second edition</a></div><br/>
<div><a href="http://bit.ly/1pdvBMg" style="text-decoration: none; color: #FFFFFF; font-family: 'Arial',sans-serif;">» Full Text Search with MongoDB and Node.js</a></div><br/>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- // END BODY-->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- BEGIN FOOTER //-->
<table id="templateFooter" border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #FFFFFF;">
<tr>
<td valign="top" style="color: #C9CDD6; font-family: 'Arial',sans-serif; font-size: 13px; line-height: 150%; padding-top: 30px; padding-right: 20px; padding-left: 20px; padding-bottom: 30px; text-align: left;" class="footerContent">Над проектом трудились:<br/>Координатор проекта - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Siarhei Mikhailau</a><br/>Рубрика PEOPLE - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Veranika Baradzina</a><br/>Рубрика CSS - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Iryna Psianina</a><br/>Рубрика User Expirience - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Kira Bozhkova</a><br/>Рубрика Videos - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Andrei Ivashkevich</a><br/>Рубрика Intresting & Links - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Egor Miasnikov</a><br/>Main logo - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Aliaksandr Hudkou</a><br/>Email templater - <a href="mailto:[email protected]" style="text-decoration: none; color: #34BAED; font-family: 'Arial',sans-serif;">Ihar Daineka</a>
</td>
</tr>
</table>
<!-- // END FOOTER-->
</td>
</tr>
</table>
<!-- // END TEMPLATE-->
</td>
</tr>
</table>
<!-- </center>-->
</body>
</html>