WorldWideWeb

The idea of hypertext preceded the Www past decades. Simply nearly all hypertext systems worked on local files. Tim Berners-Lee wanted to create a organization that would piece of work across networks so that people could link from a file on one machine to another file on another motorcar.

WorldWideWeb wasn't merely a programme for browsing files. It was a browser and editor. The introductory text reads:

HyperMedia Browser/Editor, An excercise in global information availability past Tim Berners-Lee

Today it's hard to imagine that web browsers might also be used to create web pages. Information technology turned out that people were quite happy to write HTML by manus—something that Tim Berners-Lee and colleagues never expected. They thought that some kind of user interface would be needed for making web pages and links. That'south what the WorldWideWeb browser provided. You could open up a document in one window and "marker" it. Then, in a document in another window, you could create a link to the marked page.

You'll find every bit you utilize the WorldWideWeb browser that you need to double-click links to open up them. That'southward because a single click was used for editing.

Browsing

The user interface of the WorldWideWeb browser somewhat blurred the lines between documents on your ain estimator and documents out on the network. To "browse" straight to a certificate out on the network, you need to know its URL. But you can't but type that URL into an accost bar; there is no address bar. Instead you have to follow a sequence of steps:

  1. From the "WorldWideWeb" menu, select "Document".
  2. At present from the newly-opened "Document" menu, select "Open up from full document reference".
  3. Blazon the URL into the field marked "reference".
  4. Press the "Open up" button

In one case you lot've got a spider web-based document (or web page, as nosotros would say today) open up in WorldWideWeb, you tin navigate by double-clicking on links. Every link yous double-click will open in a new window.

Linking

At its eye, WorldWideWeb is a discussion processor …but with links. And merely as y'all can use a discussion processor purely for reading documents, the real fun comes when you lot write your own. Particularly when you lot throw hyperlinks into the mix.

To create a document:

  1. From the "WorldWideWeb" menu, select "New File..."
  2. Type the name of the file you want to create e.1000. example.html
  3. In the boilerplate document, click on the heading to edit. Same with the text.

Once you lot've got a document written, it'south time to turn from regular text into hypertext:

  1. From the "WorldWideWeb" menu, select "Links"
  2. To link to another certificate, you demand to take that other certificate open in another window. Click on its championship bar to focus information technology.
  3. With that document in focus, select "Mark all" from the "Links" menu.
  4. Now switch back to your example.html certificate and highlight the text you want to be a link.
  5. From the "Links" menu, select "Link to marked".

Y'all tin even relieve your new document on to your hard bulldoze. Click on "Save a copy offline" under the "Documents" carte du jour.

In one case you've downloaded the file to your computer, you lot can open it up with a text editor to see what the HTML would have looked like.

Editing

To edit any document, whether it's ane you created, or a folio on the www:

  1. Click on the text you desire edit.
  2. Edit it.

That's it.

If y'all desire to continue a copy of the edited certificate, choose "Save a copy offline" from the "Documents" menu.

Components

Here is a collection of HTML-based components recreating the original Next interface. Experience free to grab, view-source, etc, to use for your own projects.

Colour Palette

  • #000
  • #555
  • #AAA
  • #FFF

Class Elements

Inputs

Fieldsets

Buttons

In the example of buttons, there'southward no standard for paddings. The push must friction match the width/acme of the parent, and so all buttons of the same group are of the same width/height.

Simple button

Prototype Buttons

Panels

Width and height properties must exist divers locally.

Console

Content goes hither; it can be a webview, group of buttons, forms...

Agile Console

Content goes here; information technology can exist a webview, group of buttons, forms...

WebView

Width and height backdrop must be defined locally.

Omnia sol temperat Purus et subtilis
Novo mundo reserat
Faciem Aprilis
Ad amorem properat
Animus herilis
Et iocundis imperat
Deus puerilis
Et iocundis imperat
Deus puerilis

Ama me fideliter
Fidem meam nota
De corde totaliter
Et Ex mente tota
Ama me fideliter
Fidem meam nota
De corde totaliter
Et Ex mente tota

Rerum tanta novitas
In sollmenti vere
Et veris auctoritas
Iubet nos gaudere
Vices prebet solitas
Et in tuo vere
Fides est et probitas
Tuum retinere
Fides est et probitas
Tuum retinere

General UI Elements

Divisions

Open URL

Open using hypertext reference

Navigation

Info Dialog

Info

HyperMedia Browser/Editor

An excercise in global data availability

Version one.0
Alpha only

by Tim Berners-Lee

Copyright 1990, 91 Distribution restricted: ask for terms. Test VERSION ONLY

HyperText:
Text which is non constrained to be linear.

HyperMedia:
Information which is non constrained linear... or to be text.

This is the first version of the NextStep WorldWideWeb application like the libWWW Library.
Information technology tin can pick up hypertext information from files in a number of formats, from local files, from remote files using NFS or bearding FTP, from hypertext servers by name or keyword search, and from internet news.
Hypertext files may be edited, and links made from hypertext files to other files or any other information.

For more help, employ "Help" from the menu. If that doesn't work, then your awarding has been incompletely installed.

If you have any comments or accept bugs, delight mail timbl@info.cern.ch quoting the version number (higher up).

Style Editor

Fashion Editor