PageSourceSearch

http://www.vcarrer.com/

html vcarrer.com collected 2026-10-02 03:43:44 UTC 40,744 bytes, 881 lines download raw bytes

1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2
3<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
4<head>
5  <title>Carrer Blog</title>
6
7    <link href="http://vcarrer.googlepages.com/favicon.png" rel="shortcut icon"/>
8<meta name="description" content="Blog about web programming & web design" />
9<meta name="keywords" content="Mysql, database, javascript, gridview, programming,asp.net,php,cold fusion,sql server" />
10<meta name="p:domain_verify" content="94ccd042aa20fb8eb6ec5028d7a426d0"/>
11<meta name="verify-v1" content="wtPeMftTOYsq745nPKHUos5mX+TrOnQbNJ8sVwcBiXs=" />
12<meta name="msvalidate.01" content="5550065980266AED67AF2AE326236A8B" />
13<link rel="alternate" type="application/rss+xml" title="RSS" href="http://feeds.feedburner.com/CarrerBlog" />
14    
15<!-- Google tag (gtag.js) -->
vendor: 64 bytes, lines 15-16
15
16<script async src="https://www.googletagmanager.com/gtag/js?id=
16G-GYQDJECWTC
vendor: 12 bytes, line 16
16"></script>
17<script>
18  
vendor: 134 bytes, lines 18-22
18window.dataLayer = window.dataLayer || [];
19  function gtag(){dataLayer.push(arguments);}
20  gtag('js', new Date());
21
22  gtag('config', '
22G-GYQDJECWTC
vendor: 4 bytes, line 22
22');
23</script>
23
24    
25  <style type="text/css">
26/* Reset */
27
28body { 
29  margin: 0; line-height: 1.5; 
30}
31
32/* Tables still need 'cellspacing="0"' in the markup. */
33table { border-collapse: separate; border-spacing: 0; }
34caption, th, td { text-align: left; font-weight: normal; }
35table, td, th { vertical-align: middle; }
36
37/* Remove possible quote marks (") from <q>, <blockquote>. */
38blockquote:before, blockquote:after, q:before, q:after { content: ""; }
39blockquote, q { quotes: "" ""; }
40
41/* Remove annoying border on linked images. */
42a img { border: none; }
43
44/* GRID */
45
46
47.main { 
48width:80em;margin:0 auto;text-align:left;  }
49
50.clear {clear:both;}
51
52.dl1,
53.dl2,
54.dl5,
55.dl10,
56.dl15,
57.dl20,
58.dl25,
59.dl30,
60.dl35,
61.dl40,
62.dl45,
63.dl50,
64.dl55,
65.dl60,
66.dl65,
67.dl70,
68.dl75{float:left; display: inline; }
69
70.dr1,
71.dr2,
72.dr5,
73.dr10,
74.dr15,
75.dr20,
76.dr25,
77.dr30,
78.dr35,
79.dr40,
80.dr45,
81.dr50,
82.dr55,
83.dr60,
84.dr65,
85.dr70,
86.dr75
87{float:right; display: inline; }
88
89.dl1, .dr1 {width:1em;}
90.dl2, .dr2 {width:2em;}
91.dl5, .dr5{width:5em;}
92.dl10, .dr10{width:10em;}
93.dl15, .dr15{width:15em;}
94.dl20, .dr20{width:20em;}
95.dl25, .dr25{width:25em;}
96.dl30, .dr30{width:30em;}
97.dl35, .dr35{width:35em;}
98.dl40, .dr40{width:40em;}
99.dl45, .dr45{width:45em;}
100.dl50, .dr50{width:50em;}
101.dl55, .dr55{width:55em;}
102.dl60, .dr60{width:60em;}
103.dl65, .dr65{width:65em;}
104.dl70, .dr70{width:70em;}
105.dl75, .dr75{width:75em;}
106
107
108.ml5{margin-left:5em;}
109.ml10{margin-left:10em;}
110.ml15{margin-left:15em;}
111.ml20{margin-left:20em;}
112.ml25{margin-left:25em;}
113.ml30{margin-left:30em;}
114.ml35{margin-left:35em;}
115.ml40{margin-left:40em;}
116.ml45{margin-left:45em;}
117.ml50{margin-left:50em;}
118.ml55{margin-left:55em;}
119.ml60{margin-left:60em;}
120.ml65{margin-left:65em;}
121.ml70{margin-left:70em;}
122.ml75{margin-left:75em;}
123
124.mr5{margin-right:5em;}
125.mr10{margin-right:10em;}
126.mr15{margin-right:15em;}
127.mr20{margin-right:20em;}
128.mr25{margin-right:25em;}
129.mr30{margin-right:30em;}
130.mr35{margin-right:35em;}
131.mr40{margin-right:40em;}
132.mr45{margin-right:45em;}
133.mr50{margin-right:50em;}
134.mr55{margin-right:55em;}
135.mr60{margin-right:60em;}
136.mr65{margin-right:65em;}
137.mr70{margin-right:70em;}
138.mr75{margin-right:75em;}
139
140.fluid {width:auto;    float:none;}
141div .fluid {padding:0em 0em 0em 0.1em;}
142
143.hp{width:100%;  float:left; }
144
145.clearfix, .main{ display:block;} 
146
147.clearfix:after, .main:after {
148     visibility: hidden;
149     display: block;
150     font-size: 0;
151     content: " ";
152     clear: both;
153     height: 0;
154	 
155     }
156
157/* IE5/MAC hack \*/
158* html .clearfix{ display: inline;  height: 1px;}
159/* close */
160
161/* Typography */
162body { font:75%/1.5em Arial, Helvetica, sans-serif;
163font-size-adjust:none;
164font-style:normal;
165font-variant:normal;
166font-weight:normal;
167 }
168
169p { padding:0 0 1.5em 0em;color:#111; word-spacing:0.03em;   letter-spacing:-0.03em; }
170p img       { float: left; margin: 0 1em 1em 0; padding: 0; }
171p img.right { float: right; margin: 0 0 1em 1em;  }
172
173h1,h2{ font-weight:normal; color: #333; font-family:Georgia, "Times New Roman", serif; letter-spacing: 2px; word-spacing:0.1em;  }
174h3,h4,h5,h6 { font-weight: normal; color: #333; font-family:Georgia, "Times New Roman", serif; }
175
176
177h1 { font-size: 2.2em;  margin-bottom: 0.682em; }
178h2 { font-size: 1.9em;  margin-bottom: 0.79em; }
179h3 { font-size: 1.7em;  margin-bottom: 0.882em; }
180h4 { font-size: 1.4em;  margin-bottom: 1.071em; }
181h5,h6 { font-size: 1.3em;  margin-bottom: 1,154em; }
182
183
184
185li ul, 
186li ol       { margin:0 1.5em; }
187ul, ol      { margin: 0; padding: 10px 0 20px 20px; }
188
189
190dl { margin: 0 0 1.5em 0; }
191dl dt { font-weight: bold; }
192dl dd { margin-left: 1.5em; }
193
194a { color: #035292; text-decoration: none; }
195a:hover { text-decoration: underline; }
196
197
198table { margin-bottom: 1.5em; }
199th {  border-top: 0px solid #ddd; border-bottom: 0px solid #ddd;font-weight: bold; }
200th,td { padding:0 1.5em 0em 1em;}
201tfoot { font-style: italic;  }
202tfoot td  { border-top: 0px solid #ddd;border-bottom: 0px solid #ddd; }
203caption { text-align:center; font-family:Georgia, serif;  }
204
205
206abbr, acronym { border-bottom: 1px dotted #000; }
207address { margin-top: 1.5em; font-style: italic; }
208del { color: #000; }
209
210
211blockquote { padding-left:1.5em; margin: 1.5em; border-left:3px solid #ccc; font-style:italic;  }
212strong { font-weight: bold; }
213em, dfn { font-style: italic; }
214dfn { font-weight: bold; }
215pre, code { margin: 1.5em 0; white-space: pre; }
216pre, code, tt { font: 1em 'lucida console',monospace; line-height: 1.5; } 
217tt { display: block; margin: 1.5em 0; line-height: 1.5; }
218hr {margin-bottom:1.5em;}
219
220/* new */
221.rc {-moz-border-radius: 10px;  -webkit-border-radius: 10px; ; border:1px solid #fff; }
222.drzac { position:relative; right:10px; margin:auto;  margin:auto; display:block; }
223.byline {
224font-family: "Lucida Grande", Tahoma;
225	font-size: 0.865em;
226	font-weight: lighter;
227	font-variant: normal;
228	text-transform: uppercase;
229	color: #666666;
230	letter-spacing: 0.4em;
231	display: block;
232	margin-bottom: 1.734em;
233	padding:0em 0em 0em 1em;
234	}
235
236.byline>p{margin:0; padding: 0 0 20px 0; line-height: 1;}
237
238	span.and{font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
239	font-style: italic;
240	color: #777;
241	}
242 .shadow {
243 
244  background: #fff url(sahdow1.png)  repeat-y  bottom right  ;
245 
246 
247
248
249 padding: 0px 5px 6px 0px; 
250 
251 
252}
253 .shadow1 { position:absolute; top:0px; right:0px;   }
254 .shadow2 { position:absolute; bottom:0px; left:0px;  }
255 
256.ramka {border:1px solid #ccc; padding:0.25em;}
257.tc {text-align:center;}
258.tr {text-align:right;}
259.tl {text-align:left;}
260.b{ font-weight:bold;}
261.pl1{padding-left:1em;}
262.pl2{padding-left:2em;}
263.pl3{padding-left:3em;}
264
265
266.water{color:#5582d1;}
267.earth{color:#4e3e2c;}
268.air{color:#f1fff7;}
269.fire{ color:#ff8a19;}
270 /* drinks food */
271 .wine{color:#4a040a;}
272 .beer{color:#F0C030;}
273 .caffe{color:#473523;}
274 .caffe-cream{color:#b68d3d;}
275 .espresso{color:#2c1901;}
276 .caramel{color:#ab671f;}
277 .chocolate{color:#290200;}
278 .black-pepper{color:#444334;}
279 .pepper-lite{color:#8d8a72;}
280 
281 .lipstick{color:#c20c0c;}
282 .oldbook{font-family:"Book Antiqua","Warnock Pro","Goudy Old Style","Palatino",Georgia,serif;}
283.note{font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:0.9em; color:#333;} 
284
285  .main{width:80em;}
286
287  .gridlines {background:url(grid.png);}
288 h1 + p, h2 + p, h3 + p { text-indent:0; } 
289 .mono + p:first-line {text-align: justify;
290 font-variant: small-caps;
291 text-transform: lowercase;
292 font-weight: 700;
293letter-spacing: 0.1em;
294 }
295.frame {border:1px dotted #ccc; padding:0.25em;}
296.bline {border-bottom:1px dotted #000; margin:0;}
297.bline1 {border-bottom:1px dotted; border-top:1px dotted; margin:0 0 0.3em 0; padding:0 0.1em 0 0.5em; background-color:#FAFAFA;}
298p{font-size:1em; line-height:1.6;}
299h3{color:#111;}
300ul{ list-style-type: circle; list-style-position:outside;}
301.small{font-size:0.35em;margin:0;padding:0;line-height:0;} 
302.medium{font-size:0.9em;margin:0;padding:0;line-height:0; color:#ccc;} 
303.mono{font-family:"Courier New", Courier, monospace;font-size:12px; margin:0}
304#navbar-iframe {
305
306height:0px;
307visibility:hidden;
308display:none;
309} 
310
311  </style>
312
313  <!--[if IE]>
314 
315 <![endif]-->
316
317<link rel="me" href="https://www.blogger.com/profile/04801854386297420021" />
318<meta name='google-adsense-platform-account' content='ca-host-pub-1556223355139109'/>
319<meta name='google-adsense-platform-domain' content='blogspot.com'/>
320
321<!-- data-ad-client=ca-pub-0316081000391490 -->
322<!-- --><style type="text/css">@import url(https://www.blogger.com/static/v1/v-css/navbar/3334278262-classic.css);
323div.b-mobile {display:none;}
324</style>
325
326</head>
327
328<body>
328<script type="text/javascript">
329    function setAttributeOnload(object, attribute, val) {
330      if(window.addEventListener) {
331        window.addEventListener('load',
332          function(){ object[attribute] = val; }, false);
333      } else {
334        window.attachEvent('onload', function(){ object[attribute] = val; });
335      }
336    }
337  </script>
337
338<div id="navbar-iframe-container"></div>
339<script type="text/javascript" src="https://apis.google.com/js/platform.js"></script>
vendor: 1 bytes, line 339
339
340<script type="text/javascript">
341      gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() {
342        if (gapi.iframes && gapi.iframes.getContext) {
343          gapi.iframes.getContext().openChild({
344              url: 'https://www.blogger.com/navbar/20880701?origin\x3dhttp://www.vcarrer.com',
345              where: document.getElementById("navbar-iframe-container"),
346              id: "navbar-iframe"
347          });
348        }
349      });
350    </script>
350
351
352<div class="main gridlines">
353<div class="hp mt2"><h1>{<span class="espresso">Carrer<span> <span class="lipstick">web</span> <span class="pepper-lite">log</span>}      </h1></div>
354<br class="clear" />
355<div class="hp clearfix byline"><p>Blog about web design <span class="and caffe-cream" style="font-size:1.3em;">&</span>  development</p></div>
356
357
358<div class="dl50">
359
360
361<h3 class="bline">GPT-3 and CSS Frameworks</h3>
362
363<p class="mono tl">Tuesday, April 27, 2021  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/4715290044518385658"location.href=https://www.blogger.com/comment/fullpage/post/20880701/4715290044518385658;>1 Comments</a> }</p>
364Recently I gained access to the <a href="https://openai.com/api/">OpenAI GPT-3 API</a>. I tried different things like content creation, code translation and other experiments. One of the amazing things of GPT-3 is the capacity to learn from simple textual examples.<div><br /><div>Programming is one of the most complex and problem solving tasks. But I wasn’t interested in training GPT-3 to program. For me it was more interesting how GPT-3 can speed up some boring repetitive code creation.</div><div><br /></div><div>GPT-3 works great with well structured code that has clear naming logic. I tried to train it to generate layout HTML with clear class syntax.&nbsp;</div><div><br /></div><div>I used my <a href="https://vladocar.github.io/SMART-CSS-GRID/">Smart CSS Grid Framework</a> because it has simple naming logic.
365
366CSS Classes are named from one to twelve because it is a 12 grid system.&nbsp;</div><div><br /></div><div>The logic is the total of each row should be always 12 or something like this 3 + 3 + 4 + 2 = 12</div><div><br /></div><div>The idea was, when I write something like this:&nbsp;</div><div><br /></div><div><b>&nbsp;3 | 3 | 6&nbsp;</b></div><div><br /></div><div>To receive something like this:
367
368<p><b>&lt;div class="three"&gt; &lt;/div&gt; &lt;div class="three"&gt; &lt;/div&gt; &lt;div class="six"&gt; &lt;/div&gt;</b></p>
369
370After a couple examples GPT-3 started to work almost perfectly even with more complex layouts.
371
372<div class="separator" style="clear: both;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-r1rlOJbHs9GPn2LvBCehcXyn7NyTXCWxD2ORHWrIZadBPBGhJjqN9W7DdOVnZG1xqqNNmwG0ckeRozW2jpxoR7dNkInMu9EudAQ0Yqf7ZdLJsc5QrNudSDbjoZ9jAe5ThldPJQ/s1914/GPT-3-and-CSS-Framework.jpg" style="display: block; padding: 1em 0px; text-align: center;"><img alt="GPT3 and CSS Frameworks" border="0" data-original-height="730" data-original-width="1914" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-r1rlOJbHs9GPn2LvBCehcXyn7NyTXCWxD2ORHWrIZadBPBGhJjqN9W7DdOVnZG1xqqNNmwG0ckeRozW2jpxoR7dNkInMu9EudAQ0Yqf7ZdLJsc5QrNudSDbjoZ9jAe5ThldPJQ/s400/GPT-3-and-CSS-Framework.jpg" width="400" /></a></div>
373
374  <p>Here is the text I used to train GPT-3:</p>
375
376
377<script src="https://gist.github.com/vladocar/984cf5be4f511a3351526e97a2291522.js"></script>
377
378
379Important to keep the <b>“temperature” to 0</b>, we don’t want GPT-3 to be creative.&nbsp;</div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9UDalKE0KbuyHZD5R0kVRvgqKH7RUgfl20MhbveEiH7MRLkie1YXndhJOMDq2dvSBs37jH8vZBB99R71nO34TILN6YijFcn-L8SlzNUaSucGDeLlc1r0J6a54n5k1vThhgsBLQQ/s1536/screen-capture-%25282%2529.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="647" data-original-width="1536" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9UDalKE0KbuyHZD5R0kVRvgqKH7RUgfl20MhbveEiH7MRLkie1YXndhJOMDq2dvSBs37jH8vZBB99R71nO34TILN6YijFcn-L8SlzNUaSucGDeLlc1r0J6a54n5k1vThhgsBLQQ/s320/screen-capture-%25282%2529.gif" width="320" /></a></div><br /><div><br /></div><div><br /></div><div>This is a super simple example of how GPT-3 can be used to generate repetitive HTML code. Basically all CSS Frameworks follow certain rules that can be easily used for GPT-3 training.
380 
381<br /><br /><br />
382</div></div>
383
384
385
386
387<h3 class="bline">Don’t use CSS Reset use CSS Set</h3>
388
389<p class="mono tl">Wednesday, June 24, 2020  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/4680933821520654863"location.href=https://www.blogger.com/comment/fullpage/post/20880701/4680933821520654863;>2 Comments</a> }</p>
390CSS Reset is obsolete. It made sense 10 - 15 years ago when we had IE6, Opera, Firefox and they all behaved differently with very different HTML rendering engines. Making web sites back then was a nightmare, we first made it compatible with IE6 and after that we tested them in Firefox and other browsers. Most of the websites used HTML table tags to make the layout. CSS layouts with float were only for the bravest. For every IE browser we had a special layout hack, if the layout wasn’t px perfect it would brake. Probably the worst thing was that there were no browser profiling tools. So everything was based on trial and error.<br />
391<br />
392In those chaotic times CSS Reset was born and it was loved by everyone. It served as a bridge gap between various browsers. Everyone used CSS Reset, it became so popular that people forgot why it was implemented in the first place. The main debate between web designers was what kind of CSS reset we should use. Advising against use of CSS reset was considered CSS blasphemy.<br />
393<br />
394What is the purpose of CSS reset today, in the chromium dominated browsers market? <br />
395<br />
396Just as a reminder, Chrome used Apple's open source WebKit browser engine to later create the Blink browser engine. So, Safari and Chrome have the same origins.<br />
397<br />
398Chromium (Chrome, Edge, Opera, Brave, Vivaldi) + Safari have total browser domination. Firefox has only 8% market share in the desktop/laptop market.<br />
399<br />
400In addition, the differences between Firefox, Chromium and Safari are negligible.<br />
401<br />
402Conclusion: CSS Reset is obsolete.<br />
403<br />
404What you may not know also, is that every browser has its own default CSS. So there’s no need to reset something that is already set with the default styling.<br />
405<br />
406Let's take some random HTML element like H1 tag. Often we make the mistake to define the same element over and over. First H1 element is defined by the browser default CSS then it’s reseted in the CSS Reset and it’s set many times over before it's rendered.<br />
407<br />
408My suggestion is to set the HTML elements once and try to stick with that setting. Always minimise the number of element settings and resettings.<br />
409<br />
410Make your own default.css where you define colors, dimensions, round corners and all the important HMTL elements that you are planning to use. If you do not plan to use the H6 tag or some form or table tags don’t put them in your defaut.css.<br />
411<br />
412Here is my take on this problem:<br />
413<br />
414It’s called Basic.css and it sets the common styles without resetting anything. It’s also ultra-light, at less than 1 Kb.<br />
415<br />
416Take a look.<br />
417<br />
418<a href="https://vladocar.github.io/Basic.css/">https://vladocar.github.io/Basic.css/</a><br />
419<br />
420<br />
421
422
423
424
425
426<h3 class="bline">One Page 2020 Calendar Print Version</h3>
427
428<p class="mono tl">Wednesday, January 22, 2020  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/8817345120330953708"location.href=https://www.blogger.com/comment/fullpage/post/20880701/8817345120330953708;>0 Comments</a> }</p>
429I really liked the idea of the <a href="https://davebakker.io/onepagecalendar/">One Page 2020 Calendar</a>
429. I decided to make my own printed version.<br />
430<br />
431So I did just that:<br />
432<br />
433<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAepj0HIkXA99m1UvkoGBKnPhLNoxjFardjjT4ODUio8XIjYe8JEFGKPJq1omC9G9VD4prz3xzft-yTLZRVkS6E-PhCV76cR1YJCaMe5sPd3ABAKuMRMC30Czc49nhdQq7n0l56A/s1600/One+Page+Calendar+2020.png" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAepj0HIkXA99m1UvkoGBKnPhLNoxjFardjjT4ODUio8XIjYe8JEFGKPJq1omC9G9VD4prz3xzft-yTLZRVkS6E-PhCV76cR1YJCaMe5sPd3ABAKuMRMC30Czc49nhdQq7n0l56A/s320/One+Page+Calendar+2020.png" width="320" height="153" data-original-width="1162" data-original-height="557" /></a><br />
434<br />
435You can download the Calendar <a href="https://www.dropbox.com/s/7xk4wtt1zle083i/One%20Page%202020%20Calendar.pdf?dl=0">in .pdf version here</a>.  <br />
436<br />
437<br />
438
439
440
441
442
443<h3 class="bline">3 CLI tools based on Node.js</h3>
444
445<p class="mono tl">Monday, January 21, 2019  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/1514612169023401537"location.href=https://www.blogger.com/comment/fullpage/post/20880701/1514612169023401537;>0 Comments</a> }</p>
446<h3>screenshoteer</h3><br />
447Node.js based CLI for making website screenshots and mobile emulations. It can export the results in .png or .pdf. It uses puppeteer(Headless Chrome).<br />
448<br />
449For the install:<br />
450<br />
451npm i -g screenshoteer<br />
452<br />
453Demo:<br />
454<br />
455screenshoteer  --url https://www.example.com<br />
456<br />
457<a href="https://github.com/vladocar/screenshoteer">https://github.com/vladocar/screenshoteer</a><br />
458<br />
459<br />
460<h3>keywords-extract</h3><br />
461Command line tool for keyword extraction. This Node.js project works mainly with two node modules "node-readability" that filters only the main text clearing the noise from the main text and "gramophone" module that filters the keywords from the texts.<br />
462<br />
463Install:<br />
464<br />
465npm i -g keywordsextract<br />
466<br />
467Demo:<br />
468<br />
469keywordsextract --url https://en.wikipedia.org/wiki/Search_engine_optimization --n 3,4<br />
470<br />
471<a href="https://github.com/vladocar/keywordsextract">https://github.com/vladocar/keywordsextract</a><br />
472<br />
473<h3>PDFSave</h3><br />
474PDFSave uses node-readability for clearing all non essential content. Later with pdfkit converts the HTML to lightweight PDF. PDFSave is text only, it doesn't save images or other multimedia content.<br />
475<br />
476Install:<br />
477<br />
478npm i -g pdfsave<br />
479<br />
480Demo:<br />
481<br />
482pdfsave --url https://www.lipsum.com<br />
483<br />
484<br />
485<a href="https://github.com/vladocar/PDFSave">https://github.com/vladocar/PDFSave</a><br />
486<br />
487<br />
488
489
490
491
492
493<h3 class="bline">Scribble Font for Prototyping & Wireframing</h3>
494
495<p class="mono tl">Wednesday, October 17, 2018  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/4142579597642471155"location.href=https://www.blogger.com/comment/fullpage/post/20880701/4142579597642471155;>0 Comments</a> }</p>
496I needed better solution for making Lorem Ipsum Text when I was making low fidelity wireframes.  <br />
497<br />
498That is why I made Scribble - Free Font for making wireframes.<br />
499<br />
500Here is the demo:<br />
501<br />
502<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwFlbXNo-7o5u54ih8xCiPurbCgCoR9cF7t1IUOqmcgwa18RqOHre0xgyJiwE5KGinqbYwlJsFO6_hgZwdCdB4uD5Pd7lTiUFXOBxKZnmBpWh7Ba9ds7_NcmGTM7F-M_GJUZjHgQ/s1600/Demo.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="600" data-original-width="600" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwFlbXNo-7o5u54ih8xCiPurbCgCoR9cF7t1IUOqmcgwa18RqOHre0xgyJiwE5KGinqbYwlJsFO6_hgZwdCdB4uD5Pd7lTiUFXOBxKZnmBpWh7Ba9ds7_NcmGTM7F-M_GJUZjHgQ/s320/Demo.png" width="320" /></a></div><br />
503<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil4NqOGz9KYjISIppLXoJLXTpriq-ICKwVCgG1dCKPI9z55TdhL_CI1aSPbIjSiDHi96j8KoXE42RvDA3aojKgJxdJy2jToFXS7h0JCKLfqwirUKneZUPUjjp66O61sq71-FKj0A/s1600/Demo-Scribble1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="600" data-original-width="800" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil4NqOGz9KYjISIppLXoJLXTpriq-ICKwVCgG1dCKPI9z55TdhL_CI1aSPbIjSiDHi96j8KoXE42RvDA3aojKgJxdJy2jToFXS7h0JCKLfqwirUKneZUPUjjp66O61sq71-FKj0A/s320/Demo-Scribble1.png" width="320" /></a></div><br />
504<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDT7cROWvN0snCYtnUvVItP1tZwiq66jBN-KZ7Q2mKfqvie_UH5FUrxW79g9AS25Yudfv8GJbQCY2uAER00EcaSa4oGCUgVdk9ccsRb_-ZGInnufckdAjGf48w0W50Cjf0rsKdyg/s1600/Demo-Scribble.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="490" data-original-width="980" height="160" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDT7cROWvN0snCYtnUvVItP1tZwiq66jBN-KZ7Q2mKfqvie_UH5FUrxW79g9AS25Yudfv8GJbQCY2uAER00EcaSa4oGCUgVdk9ccsRb_-ZGInnufckdAjGf48w0W50Cjf0rsKdyg/s320/Demo-Scribble.png" width="320" /></a></div><br />
505You can download Scribble for free on GitHub:<br />
506<br />
507<a href="https://github.com/vladocar/Scribble-Font">https://github.com/vladocar/Scribble-Font</a><br />
508<br />
509<br>
510<a href="https://www.designinspiration.info/free-fonts-for-lo-fi-wireframing/">Some other useful fonts for low fidelity wireframing</a>
511<br />
512<br />
513
514
515
516
517
518<h3 class="bline">ramd.js - Small JavaScript library for making TODO-like web apps</h3>
519
520<p class="mono tl">Monday, July 16, 2018  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/3490345796951660826"location.href=https://www.blogger.com/comment/fullpage/post/20880701/3490345796951660826;>0 Comments</a> }</p>
521Few weeks ago I made <a href="https://github.com/vladocar/Minimal-Notes">Minimal Notes</a> - TODO like web app made with Vue.js. Vue.js is great but it felt like overkill using that huge framework for making that simple app. Frameworks like React, Vue or Anuglar are great but we rarely use their full potential. Sometimes we need simple tool for making simple project.<br />
522<br />
523I decided to make small JS library for doing just that, simple tool for making TODO-like web apps.<br />
524<br />
525I'm taking about RAMD.js or Render - Add - Modify, Delete simple JS library for making web TODO projects. It is only 0.65 Kb minified and compressed.<br />
526<br />
527It is based around "simplified virtual DOM" that is  JavaScript Object listing the essential element properties. It is internal database that can be managed or stored locally or on the server.<br />
528You can use RAMD.js for making  “list” applications and you can save the "simplified virtual DOM" in the browser or on the server. All is made with simple JavaScript functions that you can modify and personalise. <br />
529<br />
530You can find ramd.js here:<br />
531<br />
532<a href="https://github.com/vladocar/ramd.js">https://github.com/vladocar/ramd.js</a><br />
533<br />
534<br><br />
535
536
537
538
539
540<h3 class="bline">Katana.scss - CSS Layout System made with Flexbox</h3>
541
542<p class="mono tl">Monday, June 04, 2018  { <a  href="https://www.blogger.com/comment/fullpage/post/20880701/299127854995742277"location.href=https://www.blogger.com/comment/fullpage/post/20880701/299127854995742277;>0 Comments</a> }</p>
543After my latest CSS project <a href="https://vladocar.github.io/flexy/">Flexy</a> I was inspired to do CSS Layout system that is even more dynamic. What better way to make CSS dynamic then SASS. That is how the project Katana was born.<br />
544<br />
545Katana is ultra minimal CSS Framework made with few lines of SASS. Default parameters are: 12 columns, 15px margin and 94% main width. But you can personalise anything, just change the default numbers. <br />
546<br />
547So you have super dynamic layout system with 20 lines of .scss.<br />
548<br />
549Enjoy!<br />
550<br />
551You can find Katana on GitHub:<br />
552<br />
553<br />
554<a href="https://vladocar.github.io/Katana/">https://vladocar.github.io/Katana/</a><br />
555<br />
556or<br />
557<br />
558<a href="https://github.com/vladocar/Katana">https://github.com/vladocar/Katana</a><br />
559<br />
560<br />
561<br>
562
563
564
565</div>
566<div class="dl30">
567<div class="dl25 pl3">
568<p style="top:12px;margin-left:150px; display:block; position:absolute;">  <a href="http://feeds.feedburner.com/CarrerBlog"><img src="http://www.handdrawnicons.com/images/RSS.png" class="right" alt="RSS Icon" /></a><a href="http://twitter.com/vladocar"><img src="http://www.handdrawnicons.com/images/Twitter.png" alt="Twitter icon" class="right" /></a>
569<a href="http://dribbble.com/vladocar"><img src="http://www.handdrawnicons.com/images/Dribbble.png" alt="Twitter icon" class="right" /></a>
570<a href="https://github.com/vladocar"><img src="http://www.handdrawnicons.com/images/GitHub1.png" alt="Twitter icon" class="right" /></a>
571</p>
572	<h3 class="tr bline1 oldbook">  About Me<span class="mono small"> <<< </span></h3>
573   <p> Name: Vladimir Carrer <br />
574vladocar [at] gmail.com <br />
575    Location: Verona, Italy <br />
576
577I'm a web designer, developer, teacher, speaker, generally web addicted  <a href="http://www.blogger.com/profile/04801854386297420021">...</a>
578</p>
579	
580
581	
582	
583		<h3 class="tr bline1 oldbook">My projects<span class="mono small"> <<< </span></h3>
584    <ul class="gridlines">
585<li><a href="https://www.aipromptsdirectory.com/">AI Prompt Directory</a></li>
586<li><a href="http://www.handdrawnicons.com/">Hand Drawn Icons</a></li>
587    	<li><a href="https://www.designinspiration.info">Font Design Inspiration</a></li>
588      <li><a href="http://fontpairings.com">Font Pairings</a></li>
589      <li><a href="https://www.joysvg.com">Free SVG Cut File</a></li>
590      <li><a href="https://www.upcomingnfts.info">Upcoming NFT projects</a></li>
591      <li><a href="https://www.distuts.com">Discord Tutorials</a></li>
592      <li><a href="https://www.freesublimationdesign.com">Free Sublimation Designs</a></li>
593    	
594<li><a href="https://www.techfeed.info/">Tech Feed</a></li>
595<li><a href="http://code.google.com/p/mysql-lite-administrator/">MySQL Lite Administrator</a></li>
596<li><a href="http://code.google.com/p/quark-php/">Quark Mini PHP CMS</a></li>
597<li><a href="http://code.google.com/p/formy-css-framework/">Formy - CSS Form Framework</a></li>
598<li><a href="http://code.google.com/p/emastic">Emastic - CSS Framework</a></li>
599<li><a href="http://code.google.com/p/malo">Malo - CSS Library</a></li>
600<li>
600<a href="http://code.google.com/p/the-golden-grid/">The Golden Grid</a></li>
601<li><a href="http://www.vcarrer.com/2009/06/1-line-css-grid-framework.html">1 line CSS Grid Framework</a></li>
602<li><a href="https://github.com/vladocar/Two-Lines-CSS-Framework">Two Lines CSS Framework</a></li>
603<li><a href="http://code.google.com/p/child-selector-css-system/">Child Selector System - CSS Framework</a></li>
604<li><a href="http://code.google.com/p/better-web-readability-project/">Better Web Readability Project</a></li>
605<li><a href="http://code.google.com/p/azbuka/">Azbuka - CSS Typographical Base Rendering Library</a></li>
606<li><a href="http://code.google.com/p/clipr/">ClipR - bookmarklet for better reading</a></li>
607<li><a href="http://code.google.com/p/css3-action-framework/">CSS3 Action Framework </a></li>
608<li><a href="http://github.com/vladocar/CSS-Mini-Reset">CSS Mini Reset</a></li>
609<li><a href="http://github.com/vladocar/HTML5-Mini-Template">HTML5 Mini Template</a></li>
610<li><a href="https://github.com/vladocar/CSS-Mobile-Reset">CSS Mobile Reset</a></li>
611<li><a href="https://github.com/vladocar/picoCSS">picoCSS - JavaScript Framework</a></li>
612<li><a href="https://github.com/vladocar/HTML-Lorem-Ipsum-Crash-Test">HTML Lorem Ipsum Crash Test</a></li>
613<li><a href="https://github.com/vladocar/AutoObjectDocumentation">Object Auto Documentation - JavaScript</a></li>
614<li><a href="https://github.com/vladocar/o---JS-Library-for-Object-Manipulation">o - JS Library for Object Manipulation</a></li>
615<li><a href="https://github.com/vladocar/Foxy-CSS-Framework">Foxy - CSS Framework</a></li>
616<li><a href="http://www.tumblr.com/theme/17806">Tumblr Free Theme - Better Readability Project</a></li>
617<li><a href="https://github.com/vladocar/Box-CSS-Framework">Box - CSS Framework</a></li>
618<li><a href="https://vladocar.github.io/SMART-CSS-GRID/">SMART CSS GRID</a></li>
619<li><a href="https://vladocar.github.io/nanoJS/">nanoJS - Minimal JS DOM Library</a></li>
620<li><a href="https://vladocar.github.io/flexy/">Flexy CSS Framework</a></li>
621<li><a href="https://vladocar.github.io/Katana/">Katana is CSS Layout System made with Flexbox</a></li>
622<li><a href="https://github.com/vladocar/CSS-Micro-Reset">Micro CSS Reset</a></li>
623<li><a href="https://vladocar.github.io/60gs/">60 Grid System</a></li>
624<li><a href="https://vladocar.github.io/Simple-Button/">Simple CSS Button</a></li>
625<li><a href="https://github.com/vladocar/ramd.js">ramd.js JavaScript library for making web applications.</a></li>
626<li><a href="https://github.com/vladocar/Minimal-Notes">Minimal Notes web app build with Vue.js</a></li>
627<li><a href="https://github.com/vladocar/Scribble-Font">Scribble Font for Prototyping & Wireframing</a></li>
628<li><a href="https://vladocar.github.io/Flex-One/">Flex One - 1 CSS Class System</a></li>
629<li><a href="https://vladocar.github.io/floaty/">Floaty - CSS Float Based Layout System</a></li>
630<li><a href="https://vladocar.github.io/infinity-css-grid/">Infinity CSS Grid</a></li>
631
632<li><a href="https://github.com/vladocar/PDFSave">CLI Convert websites into readable PDFs</a></li>
633<li><a href="https://github.com/vladocar/keywordsextract">keywords-extract - CLI tool, extract keywords from any web page.</a></li>
634<li><a href="https://github.com/vladocar/screenshoteer">screenshoteer - Make website screenshots and mobile emulations from the command line.</a></li>
635<li><a href="https://github.com/vladocar/Basic.css">Basic.css -  Classless CSS Starter File</a></li>
636  </ul>
637
638  <h3 class="tr bline1 oldbook"><span class="medium">§§</span>Previous Posts<span class="mono small"> <<< </span></h3>
639    <ul class="gridlines">
640    
641        <li><a href="http://www.vcarrer.com/2021/04/gpt-3-and-css-frameworks.html">GPT-3 and CSS Frameworks</a></li>
642     
643        <li><a href="http://www.vcarrer.com/2020/06/dont-use-css-reset-use-css-set.html">Don&rsquo;t use CSS Reset use CSS Set</a></li>
644     
645        <li><a href="http://www.vcarrer.com/2020/01/one-page-2020-calendar-print-version.html">One Page 2020 Calendar Print Version</a></li>
646     
647        <li><a href="http://www.vcarrer.com/2019/01/3-cli-tools-based-on-nodejs.html">3 CLI tools based on Node.js</a></li>
648     
649        <li><a href="http://www.vcarrer.com/2018/10/scribble-font-for-prototyping.html">Scribble Font for Prototyping &amp; Wireframing</a></li>
650     
651        <li><a href="http://www.vcarrer.com/2018/07/ramdjs-small-javascript-library-for.html">
651ramd.js - Small JavaScript library for making TODO...</a></li>
652     
653        <li><a href="http://www.vcarrer.com/2018/06/katanascss-css-layout-system-made-with.html">Katana.scss - CSS Layout System made with Flexbox</a></li>
654     
655        <li><a href="http://www.vcarrer.com/2018/05/flexy-css-framework.html">Flexy CSS Framework</a></li>
656     
657        <li><a href="http://www.vcarrer.com/2018/05/nanojs-javascript-for-dom-manipulation.html">nanoJS - JavaScript for DOM manipulation</a></li>
658     
659        <li><a href="http://www.vcarrer.com/2018/05/smart-css-grid.html">SMART CSS GRID</a></li>
660     
661  </ul>
662<div class="dl25">
663<a href="http://www.handdrawnicons.com"><img src="http://www.handdrawnicons.com/images/banner-hand-drawn-icons.png" style="border:1px solid #ccc; margin-bottom:10px" alt="Hand Drawn Icons"/></a>
664</div>
665
666
667<div class="dl25">
668<a href="https://www.amazon.com/dp/B01H27TZXG" target="_blank"><img width="300px" border="0" src="https://images-na.ssl-images-amazon.com/images/I/71cWiN%2BH3VL._UX466_.jpg" ></a>
669</div>
670<div class="dl25">
671<a href="https://www.amazon.com/dp/B01J61E7DO" target="_blank"><img width="300px" border="0" src="https://images-na.ssl-images-amazon.com/images/I/812edvZ3UeL._UL1500_.jpg" ></a>
672</div>
673
674<div class="clear">&nbsp;</div>
675	
676
677  <h3 class="tr bline1 oldbook"><span class="medium">§</span>Archives<span class="mono small"> <<< </span></h3>
678    <ul class="gridlines">
679   	  
680    	<li><a href="http://www.vcarrer.com/2006/05/">May 2006</a></li>
681	  
682    	<li><a href="http://www.vcarrer.com/2006/06/">June 2006</a></li>
683	  
684    	<li><a href="http://www.vcarrer.com/2006/07/">July 2006</a></li>
685	  
686    	<li><a href="http://www.vcarrer.com/2006/08/">August 2006</a></li>
687	  
688    	<li><a href="http://www.vcarrer.com/2006/09/">September 2006</a></li>
689	  
690    	<li><a href="http://www.vcarrer.com/2006/10/">October 2006</a></li>
691	  
692    	<li><a href="http://www.vcarrer.com/2007/01/">January 2007</a></li>
693	  
694    	<li><a href="http://www.vcarrer.com/2007/02/">February 2007</a></li>
695	  
696    	<li><a href="http://www.vcarrer.com/2007/10/">October 2007</a></li>
697	  
698    	<li><a href="http://www.vcarrer.com/2008/04/">April 2008</a></li>
699	  
700    	<li><a href="http://www.vcarrer.com/2008/06/">June 2008</a></li>
701	  
702    	<li><a href="http://www.vcarrer.com/2008/07/">July 2008</a></li>
703	  
704    	<li><a href="http://www.vcarrer.com/2008/08/">August 2008</a></li>
705	  
706    	<li><a href="http://www.vcarrer.com/2008/09/">September 2008</a></li>
707	  
708    	<li><a href="http://www.vcarrer.com/2008/11/">November 2008</a></li>
709	  
710    	<li><a href="http://www.vcarrer.com/2008/12/">December 2008</a></li>
711	  
712    	<li><a href="http://www.vcarrer.com/2009/01/">January 2009</a></li>
713	  
714    	<li><a href="http://www.vcarrer.com/2009/02/">February 2009</a></li>
715	  
716    	<li><a href="http://www.vcarrer.com/2009/03/">March 2009</a></li>
717	  
718    	<li><a href="http://www.vcarrer.com/2009/04/">April 2009</a></li>
719	  
720    	<li><a href="http://www.vcarrer.com/2009/05/">May 2009</a></li>
721	  
722    	<li><a href="http://www.vcarrer.com/2009/06/">June 2009</a></li>
723	  
724    	<li><a href="http://www.vcarrer.com/2009/08/">August 2009</a></li>
725	  
726    	<li><a href="http://www.vcarrer.com/2009/09/">September 2009</a></li>
727	  
728    	<li><a href="http://www.vcarrer.com/2009/10/">October 2009</a></li>
729	  
730    	<li><a href="http://www.vcarrer.com/2009/11/">November 2009</a></li>
731	  
732    	<li><a href="http://www.vcarrer.com/2009/12/">December 2009</a></li>
733	  
734    	<li><a href="http://www.vcarrer.com/2010/01/">January 2010</a></li>
735	  
736    	<li><a href="http://www.vcarrer.com/2010/02/">February 2010</a></li>
737	  
738    	<li><a href="http://www.vcarrer.com/2010/03/">March 2010</a></li>
739	  
740    	<li><a href="http://www.vcarrer.com/2010/04/">April 2010</a></li>
741	  
742    	<li><a href="http://www.vcarrer.com/2010/05/">May 2010</a></li>
743	  
744    	<li><a href="http://www.vcarrer.com/2010/06/">June 2010</a></li>
745	  
746    	<li><a href="http://www.vcarrer.com/2010/07/">July 2010</a></li>
747	  
748    	<li><a href="http://www.vcarrer.com/2010/08/">August 2010</a></li>
749	  
750    	<li><a href="http://www.vcarrer.com/2010/09/">September 2010</a></li>
751	  
752    	<li><a href="http://www.vcarrer.com/2010/10/">October 2010</a></li>
753	  
754    	<li><a href="http://www.vcarrer.com/2010/11/">November 2010</a></li>
755	  
756    	<li><a href="http://www.vcarrer.com/2010/12/">December 2010</a></li>
757	  
758    	<li><a href="http://www.vcarrer.com/2011/01/">January 2011</a></li>
759	  
760    	<li><a href="http://www.vcarrer.com/2011/02/">February 2011</a></li>
761	  
762    	<li><a href="http://www.vcarrer.com/2011/03/">March 2011</a></li>
763	  
764    	<li><a href="http://www.vcarrer.com/2011/04/">April 2011</a></li>
765	  
766    	<li><a href="http://www.vcarrer.com/2011/05/">May 2011</a></li>
767	  
768    	<li><a href="http://www.vcarrer.com/2011/06/">June 2011</a></li>
769	  
770    	<li><a href="http://www.vcarrer.com/2011/07/">July 2011</a></li>
771	  
772    	<li><a href="http://www.vcarrer.com/2011/08/">August 2011</a></li>
773	  
774    	<li><a href="http://www.vcarrer.com/2011/09/">September 2011</a></li>
775	  
776    	<li><a href="http://www.vcarrer.com/2011/10/">October 2011</a></li>
777	  
778    	<li><a href="http://www.vcarrer.com/2011/11/">November 2011</a></li>
779	  
780    	<li><a href="http://www.vcarrer.com/2011/12/">December 2011</a></li>
781	  
782    	<li><a href="http://www.vcarrer.com/2012/01/">January 2012</a></li>
783	  
784    	<li><a href="http://www.vcarrer.com/2012/02/">February 2012</a></li>
785	  
786    	<li><a href="http://www.vcarrer.com/2012/03/">March 2012</a></li>
787	  
788    	<li><a href="http://www.vcarrer.com/2012/04/">April 2012</a></li>
789	  
790    	<li><a href="http://www.vcarrer.com/2012/06/">June 2012</a></li>
791	  
792    	<li><a href="http://www.vcarrer.com/2012/08/">August 2012</a></li>
793	  
794    	<li><a href="http://www.vcarrer.com/2012/11/">November 2012</a></li>
795	  
796    	<li><a href="http://www.vcarrer.com/2013/01/">January 2013</a></li>
797	  
798    	<li><a href="http://www.vcarrer.com/2013/03/">March 2013</a></li>
799	  
800    	<li><a href="http://www.vcarrer.com/2013/06/">June 2013</a></li>
801	  
802    	<li><a href="http://www.vcarrer.com/2013/10/">October 2013</a></li>
803	  
804    	<li><a href="http://www.vcarrer.com/2013/11/">November 2013</a></li>
805	  
806    	<li><a href="http://www.vcarrer.com/2014/03/">March 2014</a></li>
807	  
808    	<li><a href="http://www.vcarrer.com/2014/09/">September 2014</a></li>
809	  
810    	<li><a href="http://www.vcarrer.com/2014/10/">October 2014</a></li>
811	  
812    	<li><a href="http://www.vcarrer.com/2015/11/">November 2015</a></li>
813	  
814    	<li><a href="http://www.vcarrer.com/2018/03/">March 2018</a></li>
815	  
816    	<li><a href="http://www.vcarrer.com/2018/05/">May 2018</a></li>
817	  
818    	<li><a href="http://www.vcarrer.com/2018/06/">June 2018</a></li>
819	  
820    	<li><a href="http://www.vcarrer.com/2018/07/">July 2018</a></li>
821	  
822    	<li><a href="http://www.vcarrer.com/2018/10/">October 2018</a></li>
823	  
824    	<li><a href="http://www.vcarrer.com/2019/01/">
824January 2019</a></li>
825	  
826    	<li><a href="http://www.vcarrer.com/2020/01/">January 2020</a></li>
827	  
828    	<li><a href="http://www.vcarrer.com/2020/06/">June 2020</a></li>
829	  
830    	<li><a href="http://www.vcarrer.com/2021/04/">April 2021</a></li>
831	  
832
833  </ul>
834  
835
836	
837	
838
839		<h3 class="tr bline1 oldbook">Other Profiles <span class="mono small"><<< </span></h3>
840    <ul class="gridlines">
841    	<li><a href="http://twitter.com/vladocar">Twitter</a></li>
842<li><a href="https://github.com/vladocar">GitHub</a></li>
843<li><a href="http://dribbble.com/vladocar">Dribbble</a></li>
844<li><a href="http://dzone.com/users/vladocar">Dzone</a></li>
845<li><a href="https://plus.google.com/100906093071985825940/posts">Google + </a></li>
846<li><a href="http://www.flickr.com/photos/vladocar/">Flickr</a></li>
847
848
849  </ul>
850
851<a href="http://www.linkedin.com/in/vladocar?goback=%2Esrp_1_1206380747789_in" ><img src="http://www.linkedin.com/img/webpromo/btn_myprofile_160x33.gif" width="160" height="33" border="0" alt="View Vladimir Carrer's profile on LinkedIn"></a>
852 
853<br />
854
855	<p><a href="http://www.dzone.com/aboutmvb"><img src="http://www.dzone.com/sites/all/files/big-mvbbutton.png" /></a></p>
856
857
858<script type="text/javascript"><!--
859google_ad_client = "ca-pub-0316081000391490";
860google_ad_host = "pub-1556223355139109";
861/* vcarrer */
862google_ad_slot = "0929188486";
863google_ad_width = 234;
864google_ad_height = 60;
865//-->
866</script>
vendor: 1 bytes, line 866
866
867<script type="text/javascript"
868src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
869</script>
869
870	</div>
871	
872</div>
873	
874	
875
876
877<div class="hp "><p class="pepper-lite tc">Content is licensed under a Creative Commons Public Domain License  </p></div>
878</div>
879
880</body>
881</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.