-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
463 lines (254 loc) · 24.4 KB
/
index.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
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
<!DOCTYPE html>
<!--[if IEMobile 7 ]><html class="no-js iem7"><![endif]-->
<!--[if lt IE 9]><html class="no-js lte-ie8"><![endif]-->
<!--[if (gt IE 8)|(gt IEMobile 7)|!(IEMobile)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Bert's Blog</title>
<meta name="author" content="Bert Hartmann">
<meta name="description" content="I think a lot about how organizations exist on the internet. I’m not thinking so much about web companies, but rather the organizations that …">
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="canonical" href="http://berthartm.com">
<link href="/favicon.png" rel="icon">
<link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
<script src="/javascripts/modernizr-2.0.js"></script>
<script src="/javascripts/ender.js"></script>
<script src="/javascripts/octopress.js" type="text/javascript"></script>
<link href="/atom.xml" rel="alternate" title="Bert's Blog" type="application/atom+xml">
<!--Fonts from Google's Web font directory at http://google.com/webfonts -->
<link href='http://fonts.googleapis.com/css?family=PT+Serif:regular,italic,bold,bolditalic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=PT+Sans:regular,italic,bold,bolditalic' rel='stylesheet' type='text/css'>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-25195310-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body >
<header role="banner"><hgroup>
<h1><a href="/">Bert's Blog</a></h1>
</hgroup>
</header>
<nav role="navigation"><ul class="subscription" data-subscription="rss">
<li><a href="/atom.xml" rel="subscribe-rss" title="subscribe via RSS">RSS</a></li>
</ul>
<form action="" method="get">
<fieldset role="search">
<input type="hidden" name="q" value="site:berthartm.com" />
<input class="search" type="text" name="q" results="0" placeholder="Search"/>
</fieldset>
</form>
<ul role=main-navigation>
<li><a href="/">Blog</a></li>
<li><a href="/blog/archives">Archives</a></li>
<li><a href="/About">About</a></li>
</ul>
</nav>
<div id="main">
<div id="content">
<div class="blog-index">
<article>
<header>
<h1 class="entry-title"><a href="/blog/2011/12/02/the-web-presence-scale/">The Web Presence Scale</a></h1>
<p class="meta">
<time datetime="2011-12-02T01:16:00-05:00" pubdate>Dec 2<span>nd</span>, 2011</time>
</p>
</header>
<div class="entry-content"><p>I think a lot about how organizations exist on the internet. I’m not thinking so much about web companies, but rather the organizations that exist regardless of the internet or computers. These groups and businesses almost always exist in some form on the internet, and are often concerned with having either “more” presence or a “better” presence on the internet. I think we have an understanding of the quality of a presence, but I’ve been thinking that I don’t really have a good way of expressing quantity of web presence. I think, as a starting point, the quantity scale can be divided into certain layers.</p>
<h3>Level 0: Non-Existant</h3>
<p>The group may be real, but the internet is unaware. This can be fairly hard to achieve for organizations tied to physical locations, but for those that are more transient, is more easily possible.</p>
<h3>Level 1: Existant</h3>
<p>The group has been noticed by Google, foursquare, Yelp, etc. It doesn’t really matter how the information got out there, but now it’s out and in use. Users are able to find out information about the organization, though the org doesn’t necessarily control it.</p>
<h3>Level 2: Intentional</h3>
<p>The group has created their own space on the internet. This can take many forms, like a web page, a facebook page, or anything else that lets them collect information and organize it. It also provides them something to point other people and services to. The key distinction here is that they are now in control of their own data.</p>
<h3>Level 3: Integrated</h3>
<p>This is probably the vaguest stage, but that’s because it’s different for every organization. At this point, some level of core operation has moved to the web. Whether it’s sales, customer support / interaction, marketing, or something else.</p>
<p>Obviously, this doesn’t apply to internet based organizations, or people, who generally exist in different ways. It’s interesting to note that individuals tend to move through the levels in the order of something like 0, 3, 2, 1. Starting off with interactive accounts, then creating some place to organize their digital existance before it gets picked up by other services.</p>
<p>This also, isn’t a checklist or plan for anyone. One level isn’t necessarily better than another. Many organizations exist well at Level 1, and shouldn’t move to Level 2, as doing that poorly can be quite damaging. Also, my local pizza place doesn’t need a website.</p>
<p>I think it means something to transition between these levels. Forcing yourself into Level 1 from non-existance is a big step, as is declaring your own space on the internet, or integrating your business with it. I think it’s important at each step to figure out what this means for the organization. What statement are they making by progressing?</p>
<p>I also wonder what we can do as an industry to not require organizations to have to push to higher levels. If every organization could get by as Level 1, without having to build a custom website, without having to build custom integration, wouldn’t that be better? Does going to a higher level mean that there’s some service that they are missing at the lower ones? If we can figure that out and provide it, wouldn’t that make their lives easier?</p>
</div>
</article>
<article>
<header>
<h1 class="entry-title"><a href="/blog/2011/11/22/lessons-from-the-post-office/">Lessons From the Postal Service</a></h1>
<p class="meta">
<time datetime="2011-11-22T22:36:00-05:00" pubdate>Nov 22<span>nd</span>, 2011</time>
</p>
</header>
<div class="entry-content"><p>With the Post Office having financial troubles, they’re closing many locations. What this means for Hoboken is that we’re losing 3 out of 4 of ours.</p>
<p>What’s interesting about the closing of these offices is the process. Roughly, the process involves surveying the public, having a public hearing, and then a decision is made, and then there’s a waiting period before the office closes.</p>
<p>Having gotten 3 of these surveys, with identical explanitory letters attached, I’ve had time to ponder the inefficiencies of it. Hoboken has 4 post offices for 1.3 square miles. It’s clearly unnecessary. Several people I’ve talked to didn’t even know there was more than one, and these are people who’ve lived less than a block from one of the closing ones.</p>
<p>Reading the letter and survey, it’s clearly not designed for this sort of situation. It’s asking things like how often I visit, what I buy there, and what I use the office for, all of which could be answered by tracking at the office. It also asks if I’m able to make it to my next nearest post office should they close this one. My next nearest being half a mile away (closer than most of the ones being closed). After all this, it explains the process, how long it would be until the decision, and then that there’d be another 2 months or more until the actual closing.</p>
<p>This is all so wasteful. I realize there are good reasons for it, and that the surveys serve a good purpose especially in more rural areas, but there must be some allowance for flexability and reason.</p>
<p>My apologies to those who are truly inconvienienced by the closings because we in Hoboken are so wasteful as to have 4.</p>
</div>
</article>
<article>
<header>
<h1 class="entry-title"><a href="/blog/2011/11/15/whats-the-point-of-html/">What’s the Point of HTML?</a></h1>
<p class="meta">
<time datetime="2011-11-15T22:44:00-05:00" pubdate>Nov 15<span>th</span>, 2011</time>
</p>
</header>
<div class="entry-content"><p>I’m a big fan of code separation and the <a href="http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller">MVC</a> pattern. As we slowly move towards a world where everything is a web app, I think forcing the model of MVC on most frameworks has been the greatest move towards clean code that we’ll see for a while.</p>
<p>But lets look at the View portion of MVC. What is the View for a web app? Most people would say it’s the html file that gets sent back to the browser. This is close to the truth, but clearly breaks down once you start considering javascript. A View shouldn’t be self modifying, able to handle events, etc.</p>
<p>The truth is that web apps don’t run on servers, they run in the browser. The cases are few and far between of useful web apps that don’t require javascript. Once you consider javascript, our MVC paradigm breaks.</p>
<p>The truth is, in the browser, we have our own MVC. In an ideal world, the Model is HTML, the View is CSS, and the Controller is Javascript. In practice, HTML is so ingrained into browser rendering, that it’s impossible to separate from the View. As a Model, HTML documents are rather lacking. No one wants to store anything that’s not being rendered in the HTML structure, as it’s not easy to work with.</p>
<p>Perhaps it’s time to give up on HTML being a source of clean data, and to accept it’s role as part of the view. How then do we achieve proper code separation in our web pages? How do we enable the semantic web when our fundamental form of document is rendering information and not data? The answer is to pull your data from an API. Look at Twitter; Loading up their webpage gives an HTML page with no data. Javascript on the page consumes an API, and passes it into HTML for rendering. If you’re interested in a clean form of the data itself (the Model from which the page is built), you can grab it from the API(In my case: <a href="http://api.twitter.com/1/statuses/user_timeline.json?include_entities=1&include_available_features=1&contributor_details=true&pc=false&include_rts=true&user_id=243506131">http://api.twitter.com/1/statuses/user_timeline.json?include_entities=1&include_available_features=1&contributor_details=true&pc=false&include_rts=true&user_id=243506131</a>).</p>
<p>Looking at HTML this way allows us to not feel guilty about non-semantic divs, and not knowing the right microformat for calendar events.</p>
<p>What we do need to make sure of is that our new html pages don’t lock up data, that there is an API for everything, and that it is publically accessible. After all, people only are scraping your HTML for information if it’s not available in a better form.</p>
</div>
</article>
<article>
<header>
<h1 class="entry-title"><a href="/blog/2011/11/01/in-defense-of-the-back-button/">In Defense of the Back Button</a></h1>
<p class="meta">
<time datetime="2011-11-01T20:56:00-04:00" pubdate>Nov 1<span>st</span>, 2011</time>
</p>
</header>
<div class="entry-content"><p><a href="http://durietz.tumblr.com/post/12131947412/the-android-hardware-buttons-are-broken">Christoffer Du Rietz</a> recently took a jab at the Android hardware buttons. Much has been said on the topic, and I won’t try to contribute more on the subject of Android vs. iOS or whether or not hardware buttons are a good idea. Let’s just leave it at that I’m a nexus one user who likes his phone and I’m excited at what I’ve seen of Ice Cream Sandwich so far.</p>
<p>What I do want to address is a comment he made regarding the back button that “The problem is, that Android hasn’t decided what that it wants the back button to do.” . That statement seems ridiculous to me. I’ll try to explain my reasoning, but first we need to go down a little tangent.</p>
<p>Information Architecture is hard. This is not news to anyone who’s been responsible for laying out the content and navigation of a sizable website, or dealt with making sane and simple user workflows, or even struggled with finding the best outline for a paper they were writing.</p>
<p>Life used to be simpler. You struggled with your mass of information for a while, picked your favorite organizational structure and went with it, for better or worse. This is how we got the Dewey Decimal system, the standard layout for clothing stores (divided men’s / women’s / children, again in each of those sections by style of clothing, and so on). Of course, everything can only be in one place though, so your book that’s a mix of Computer Science and Literature? Someone’s going to have make a choice as to which section of the library it will be in.</p>
<p>Computers solved that problem, right? Now ebooks can exist in both classifications, since they’re digital. Being able to link around the web means we don’t have to follow anyone else’s established hierarchy. I mean, books still have to be on a certain shelf and a shirt on a particular rack, but we can search and shop unlike and find what we’re looking for.</p>
<p>Unfortunately, this is only partly true. We still have two forms of going through content as humans, searching and browsing. Linking and searching work for the searching behavior, but for browsing we still need to have a hierarchy and feel like we know where we are (even when “where we are” exists only as bits on the screen). You’ll notice all the clothing store websites haven’t abandoned their hierarchies. People still like to be able to go “up” from what they’re looking at to all Men’s clothing, or “down” to a particular shirt, or “over” to look at pants instead. What has changed though, is that we now have somethings that can function without hierarchy at all.</p>
<p>Twitter has no strict information hierarchy. It’s not unique in this, but it’s who I’m going to pick on right now. If we were to assign Twitter a hierarchy, it would probably be a very flat and wide one where the user would pick one of a million users, and they would have their tweets and their profile. Not great usability. Twitter works because they can break this model, throw it out the window, and have navigation based on aggregation of a hundred different things. This means there is no “up” or “down” in Twitter. There’s only “back” (and then sometimes “forward”), which are new directions based on the <em>user’s flow</em> instead of the information architecture.</p>
<p>This is what your browser does to allow you some affordance of navigation through the web. Each site (usually) has their hierarchy, but once you break that, it’s back to the browser back button.</p>
<p><strong>So now let’s get back to the point.</strong></p>
<p>Android, tasked with building an OS for a smartphone, has to figure out navigation among many other issues. Apps are much worse than websites when it comes to navigation. Between the myriad of chat programs, things like dropbox, tuners, and other utilities, and other programs on my phone, I’d be hard pressed to figure out a sane hierarchical navigation for half of them. To add to this, Android has a wonderful way to call into different parts of applications using intents, which act as the equivalent of linking to different webpages online.</p>
<p>So, we’re in a model where there’s no guaranteed hierarchy within apps, and a user is able and probable to wander through applications anyway. This means we have to throw out the browsing model (at least from an os perspective, inside apps it may still work) and stick with our navigational concession, the back button.</p>
<p>If understood this way, the back button is entirely consistent. Even in cases where hierarchical navigation still makes sense, I think you’ll find that most of them are similar to something like a mail program. Click one email to view, and then people tend to choose “back” over “up”. How often do you hit the inbox link in gmail?</p>
<p>At this point I feel compelled to call out Facebook on their recent app design, which is the only one I know that willfully breaks this model. Android allows you to override the back button behavior, but recommends against it for consistency reasons (and, hey, why write the code when the os gives it for free?). Facebook launches a user into the newsfeed when they open the app, and hitting the back button takes them to some sort of menu. Back again behaves as expected. I’m not sure what the thought process was here towards breaking the expecation. Unfortunately, there’s discussions as to how to treat the back button in ajax applications as there’s no browser reload between actions for them, so I imagine as that we’ll see more abuses of this type as the tools evolve to change browser behavior.</p>
<p>Thanks to <a href="http://twitter.com/okayrene">@okayrene</a> for helping me refine this.</p>
</div>
</article>
<article>
<header>
<h1 class="entry-title"><a href="/blog/2011/10/25/making-a-useful-business/">Making a Useful Business</a></h1>
<p class="meta">
<time datetime="2011-10-25T21:34:00-04:00" pubdate>Oct 25<span>th</span>, 2011</time>
</p>
</header>
<div class="entry-content"><p>I saw a post on Hacker News recently about a recent batch of graduates from TechStars. There was a comment there lamenting the lack of businesses attacking new problems. Unfortunately, I can’t find the post or comment now, unfortunately, but it’s a thought I’ve heard and shared before, and it’s not unique to any program or group of people.</p>
<p>A lot is said in the startup world about “scratching your own itch”. That is, find a problem that affects you so you’ll be inspired to solve it. A lot of great ideas and businesses have come out of this, but it’s almost come to a point where people don’t know what to solve because a lot of the problems in the life of a typical startup founder have been solved.</p>
<p>A comparison to our lives 10 years ago shows that. We now have much better internet access, more blogging, email sending, hosting, and social media solutions than you can shake a fist at. We even have smartphones so we never need to be without a computer. I’m not arguing that there aren’t improvements to be made in these fields, but rather that a lot of them have been attacked and are 85% solved. Yes, you may be able to do better and make it 90%, but it’s going to be a hard sell.</p>
<p>When I expand my itch scratching to family and friends, I find problems that are screaming for good teams of people to provide any help at all. If you look at any small (or even large) business, you’ll find tons of processes that are annoyingly manual, time consuming, and generally wasteful.</p>
<p>When we started <a href='http://MomnPo.ps'>Mom n Pops</a>, we were scratching our own itch. We found it hard to find things in our neighborhood. What we found was that not only was the consumer side lacking, but that there were no tools on the store side either. Store owners keeping track of things on post-it notes, distributors going store to store taking inventory by hand on paper, and what tools exist are expensive and bad. Theres definitely work to be done here.</p>
<p>My new rule of thumb when I hear ideas is “Who’s life is significantly better because of this?” and, if I’m uninspired with ideas for what I should do, I talk to other people about their jobs. They always know something that can be fixed.</p>
</div>
</article>
<div class="pagination">
<a href="/blog/archives">Blog Archives</a>
</div>
</div>
<aside class="sidebar">
<section>
<h1>Recent Posts</h1>
<ul id="recent_posts">
<li class="post">
<a href="/blog/2011/12/02/the-web-presence-scale/">The Web Presence Scale</a>
</li>
<li class="post">
<a href="/blog/2011/11/22/lessons-from-the-post-office/">Lessons From the Postal Service</a>
</li>
<li class="post">
<a href="/blog/2011/11/15/whats-the-point-of-html/">What’s the point of HTML?</a>
</li>
<li class="post">
<a href="/blog/2011/11/01/in-defense-of-the-back-button/">In defense of the back button</a>
</li>
<li class="post">
<a href="/blog/2011/10/25/making-a-useful-business/">Making a useful business</a>
</li>
</ul>
</section>
<section>
<h1>Latest Tweets</h1>
<ul id="tweets">
<li class="loading">Status updating…</li>
</ul>
<script type="text/javascript">
$.domReady(function(){
getTwitterFeed("BertHartm", 3, false);
});
</script>
<script src="/javascripts/twitter.js" type="text/javascript"> </script>
<a href="http://twitter.com/BertHartm" class="twitter-follow-button" data-width="208px" data-show-count="false">Follow @BertHartm</a>
</section>
<section>
<h1>Github Repos</h1>
<ul id="gh_repos">
<li class="loading">Status updating…</li>
</ul>
<a href="https://github.com/BertHartm">@BertHartm</a> on Github
<script type="text/javascript">
$.domReady(function(){
if (!window.jXHR){
var jxhr = document.createElement('script');
jxhr.type = 'text/javascript';
jxhr.src = '/javascripts/libs/jXHR.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(jxhr, s);
}
github.showRepos({
user: 'BertHartm',
count: 0,
skip_forks: true,
target: '#gh_repos'
});
});
</script>
<script src="/javascripts/github.js" type="text/javascript"> </script>
</section>
<section class="googleplus googleplus-hidden">
<h1>
<a href="https://plus.google.com/117826068757629446294?rel=author">
<img src="http://www.google.com/images/icons/ui/gprofile_button-32.png" width="32" height="32">
Google+
</a>
</h1>
</section>
</aside>
</div>
</div>
<footer role="contentinfo"><p>
Copyright © 2011 - Bert Hartmann -
<span class="credit">Powered by <a href="http://octopress.org">Octopress</a></span>
</p>
</footer>
<script type="text/javascript">
var disqus_shortname = 'berthartm';
var disqus_script = 'count.js';
(function () {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/' + disqus_script;
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
}());
</script>
<script type="text/javascript">
(function() {
var script = document.createElement('script'); script.type = 'text/javascript'; script.async = true;
script.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(script, s);
})();
</script>
<script type="text/javascript">
(function(){
var twitterWidgets = document.createElement('script');
twitterWidgets.type = 'text/javascript';
twitterWidgets.async = true;
twitterWidgets.src = 'http://platform.twitter.com/widgets.js';
document.getElementsByTagName('head')[0].appendChild(twitterWidgets);
})();
</script>
</body>
</html>