Editor.html
7.62 KB
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
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="generator" content=
"HTML Tidy for Mac OS X (vers 31 October 2006 - Apple Inc. build 13), see www.w3.org" />
<meta name="Author" content="Tim Berners-Lee" />
<title>
Tim Berners-Lee - Editing User Interface
</title>
<meta http-equiv="Content-Type" content="text/html" />
<link href="di.css" rel="stylesheet" type="text/css" />
</head>
<body bgcolor="#DDFFDD" text="#000000">
<p>
<a href="../Overview.html"><img alt="W3C" border="0" src=
"w3c_home.gif" /></a>
</p>
<address>
Tim Berners-Lee
<p>
Date: April 1998, updated 9/97
</p>
<p>
Status: personal view. Editing status: Italic text is
rough. Requires complete edit and possibly massaging, but
content is basically there.
</p>
<p>
Audience: Those people who asked what I meant by a
consistent user interface and then said, "Don't just say
it, write it down!". For software developers in the hope
that some of this will come true. This has worked
before. I'm a bit embarassed, as everyone has pet ideas
about how the UI is frustrating, and listening to them can
be tedious, I know! Perhaps this is why I haven't written
this down before.
</p>
<p>
Contributions: Examples from Dan Connolly of what needs to
be easy.
</p>
</address>
<p>
<a href="Overview.html">Up to Design Issues</a>
</p>
<h3>
Web Architecture: 6
</h3>
<p>
See also <a href="../Talks/9702ComNet/slide1.htm">ComNet 97
talk</a>.
</p>
<hr />
<h1>
Cleaning up the User Interface 2: Hypertext editing
</h1>
<p>
Tim BL 3 April 1998
</p>
<p>
If you think surfing hypertext is cool, that's because you
haven't tried writing it. If you have found your
bookmarks/favorites have become a more and more important
part of your life, that's because you have learned to put up
with the simplest form of hypertext editing there is as a
compromise. If you are using a really intuitive hypertext
editor, then tell me about it.
</p>
<h2>
Hypertext editing
</h2>
<p>
The Web is universal and so should be able to encompass
everything across the range from the very rough scribbled
idea on the back of a virtual envelope to a beautifully
polished work of art.
</p>
<p>
Somewhere near the "draft" end of the scale is its use a
hypertext communal or personal notebook which is very close
to a major original use of the Web in 1990. In this mode I
can browse over notes made by people in my group, and rapidly
contribute new ideas.
</p>
<p>
I'm editing this now on a pretty intuitive editor. AOLPress
is may not be a top of the line pape layout tool but it can
do some of the things which my original "WorldWideWeb"
program could do. I wouldn't say that either of these
programs was the ideal interface, but if you look also at
things like KMS and Doug Engelbart's interface, you see that
for all the fancy HTML we have nowadays, there is some
immediacy we have lost.
</p>
<p>
Here are some things I would like to be able to do very
rapidly. Dan Connolly suggested a click count as a way of
measuring the effort, with 10 clicks penalty when you have to
think of a filename or anchor ID.
</p>
<h2>
Imagine there's no mode, imagine there's no location
</h2>
<p>
A first assumption, by the way, is that you have modeless
interface in which browsing and editing are not separate
functions. If to edit a page, you have to switch from
browsing mode to editing mode, then you have lost already. If
you have had to switch to edit mode, and think of a local
filename in which to save the file, then you have lost
doubly, If you have had to answer lots of difficult questions
about where to save absolute or relative links, you have lost
yet again and probably messed up the file already! You should
not have to think about "where" things are.
</p>
<h2>
Make a link
</h2>
<p>
In WorldWideWeb, you had to
</p>
<ul>
<li>Select the target phrase
</li>
<li>Hit "command/M" to mark where you were, (Which generated
an anchor with a made up name, and remembered it);
</li>
<li>Switch to the document to contain the link if different;
</li>
<li>select the text to be linked;
</li>
<li>Hit "Command/L" to make the link
</li>
</ul>
<p>
In AOLPress, I can do the same thing except the "Mark"
function consists of three steps: Press the "anchor" button,
hit return to accept the program's suggested anchor name, and
then hit the "copy URL" button.
</p>
<p>
In a drag-and drop world, every window should have an icon
for the document it holds which can be dragged to make a
link. (Later versions of NeXTStep had this with alt/click on
the titlebar).
</p>
<h2>
Make a new linked node - Annotate
</h2>
<p>
In WorldWide Web, this was deliberately easy:
</p>
<ul>
<li>Select a phrase
</li>
<li>Hit "Command/N". (A new node is created)
</li>
<li>Think of a filename in response to the "SaveAs" dialog
box :-(
</li>
</ul>
<p>
The new node would be created from a template which could set
up to have your signature at the bottom, etc. The original
phrase was automatically linked to the new node. The cursor
was left ready for you to type in what you'd just thought of.
</p>
<p>
In a world with PICS servers, then a neat operation is to
annotate a page you don't have access to:
</p>
<ul>
<li>Create a new node somewhere where you have write access
</li>
<li>Create a PICS label with a pointer to it
</li>
<li>Store the PICS label on the label server as a label about
the annotated node.
</li>
</ul>
<p>
The XML LINK work will allow, we hope, a link to be made into
the middle of an existing unwritable document with some hope
of reliability.
</p>
<p>
Here are a few other operations which would be very useful
when you really use hypertext as a thinking tool.
</p>
<h2>
<a name="Excerpt" id="Excerpt">Excerpt</a>
</h2>
<p>
Dan is always asking for this and doing it by hand. I have
never seen an editor which will do it automatically (though
Dan has found some <a href="../2000/08/eb58">javascript
hacks</a> that work pretty well).
</p>
<ul>
<li>Copy to the clipboard a BLOCKQUOTE with inside it a copy
of the selected text, linked back to the original document
from which it came. Make the link to an existing anchor in
the document if one is there, or else a new one if one can be
made, or else the document as a whole failing that.
</li>
</ul>
<h2>
Insert an image
</h2>
<p>
It's always nice to be able to grab a screen shot or a video
frame and insert it into the minutes you are taking of a
meeting -- but how many keystrokes does it take?
</p>
<hr />
<p>
<a href="UI.html">Back to User Interface 1</a>; <a href=
"Overview.html">Up to Design Issues</a>
</p>
<address>
TimBL, Apr 1998<br />
$Id: Editor.html,v 1.12 2009/08/27 21:38:06 timbl Exp $
</address>
</body>
</html>