[Wikitech-l] Proposed new layout

Toby Bartels toby+wikipedia at math.ucr.edu
Sat Jun 28 11:52:22 UTC 2003


I wrote in part:

>Tarquin wrote:

>>Here's my rough version of a new layout.
>>It's not too radical a departure from what we have, but I think it is 
>>much clearer, particularly for newcomers.

>I like having "Wikipedia" right at the top.
>And I like the separation between article links and Wikipedia links.

And then I made a bunch of suggestions.

So now I've implemented my suggestions in the attached files.

I don't know CSS, and writing this involved more CSS
than I had ever dealt with in the rest of my life combined.
So I didn't figure out how the rules (or rather, border lines) work.
Tarquin's don't work right on all browsers anyway,
so I'm not going to worry about it now,
since he'll doubtless come up with something new.

Otherwise, the attached is what /I/ like. ^_^


-- Toby
-------------- next part --------------
body.encyclopedia {
	background: white
	}
body.meta {
	background: #ffffdd
	}
body {
	margin: 0px;
	padding: 0px;
	}
form.inline {
	display: inline;
	}

/* ********************************** TOPBAR */
#topbar {
	border-bottom: solid 1px black;
        padding-bottom: 4px;
	}
/* common to all 3 topbar blocks */
#topbar div.navbox {
	/*
	background-color: #eef;
	background-color: #f8f8f8;
	*/
	padding: 0px 4px;
	margin: 0px;
	}
div.navbox {
	font-size: 0.9em;
	}
h1.sitename {
	padding-top: 0;
	margin-top: 0;
	padding-bottom: 0;
	margin-bottom: 0; 
	font-size: 2.2em;
	}
p.subtitle {
	padding: 0em 1em;
	margin: 0em;
	color: #723;
	}
#topbar div#header {
	padding-bottom: 2px;
	}
#topbar div#search {
	}
#topbar div#sitelinks {
	padding-bottom: 2px;
	}

div.spacer {
	clear: both;
	}
div.row span.left {
	float: left;
	text-align: left;
	width: 49%;
	}
div.row span.right {
	float: right;
	text-align: right;
	width: 49%;
	}

/* ********************************* CONTENT */
#content {
	top: 0px;
	margin: 0px;
	/*
	padding: 0px 5px 0px;
	position: relative;
	*/
	}
a.interwiki, a.external {
	color: #3366BB;
	}
a.printable {
	text-decoration: underline;
	}
a.stub {
	color: #772233;
	text-decoration: none;
	}
h1.pagetitle {
	padding-top: 0;
	margin-top: 0;
	padding-bottom: 0;
	margin-bottom: 0;
	font-size: 2em;
	}
h2 {
	font-size: 125%;
	}
h2, h3, h4, h5, h6 {
	margin-bottom: 0;
	}
h3 {
	font-size: 112.5%;
	}
h4 {
	font-size: 106.25%;
	}
h5 {
	font-size: 103.125%;
	}
h6 {
	font-size: 100%;
	}
p.languages , p.actions {
	padding: 0em 1em;
	margin: 0em;
	font-size: 0.9em;
	color: #723;
	}
p.languages {
	font-style: italic;
	}
#article {
	padding: 4px 4px;
	}

/* ********************************* quickbar */
#quickbar-left , #quickbar-right {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 148px;
	padding: 0px;
	visibility: visible;
	z-index: 99;
	}
#quickbar-left {
	left: 0px;
	border-right: 1px solid black;
	}
#quickbar-right {
	right: 0px;
	border-left: 1px solid black;
	}
.quickbarsection {
	padding: 6px;
	border-bottom: 1px solid black;
	}
/* ********************************** QUICKBAR DEPENDENCIES */
#content {
	margin-left: 148px;
	}
-------------- next part --------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>Paddington station - Wikipedia</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">
<meta name="robots" content="index,follow">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="stylesheet" href="Toby.css">
<script type="text/javascript" src="/style/wikibits.js"></script>
<style type="text/css" media="screen"><!--
a.stub, a.new, a.internal, a.external { text-decoration: none; }
a.new { color: #CC2200; }
//--></style>
</head>

<body class="encyclopedia">

<div id="content">

<div id="topbar">
<!-- ************************************* topbar -->
<div class="navbox" id="header">
 <h1 class="sitename">Wikipedia</h1>
 <p class="subtitle">The free encyclopedia</p>
 <div class="spacer"></div>
</div>
<div class="navbox" id="search">
 <div class="row" id="searchrow">
  <span class="left"><form id="specialpages" method="get" class="inline" action="http://www.wikipedia.org/w/redirect.phtml"><select name="wpDropdown">
   <option value="Special:Specialpages">Special pages</option>
   <option value="Special:Preferences">Set my user preferences</option>
   <option value="Special:Watchlist">My watchlist</option>
   <option value="Special:Recentchanges">Recently updated pages</option>
   <option value="Special:Upload">Upload image files</option>
   <option value="Special:Imagelist">Image list</option>
   <option value="Special:Listusers">Registered users</option>
   <option value="Special:Statistics">Site statistics</option>
   <option value="Special:Randompage">Random article</option>
   <option value="Special:Lonelypages">Orphaned articles</option>
   <option value="Special:Unusedimages">Orphaned images</option>
   <option value="Special:Popularpages">Popular articles</option>
   <option value="Special:Wantedpages">Most wanted articles</option>
   <option value="Special:Shortpages">Short articles</option>
   <option value="Special:Longpages">Long articles</option>
   <option value="Special:Newpages">Newly created articles</option>
   <option value="Special:Ancientpages">Oldest articles</option>
   <option value="Special:Intl">Interlanguage links</option>
   <option value="Special:Allpages">All pages by title</option>
   <option value="Special:Ipblocklist">Blocked IP addresses</option>
   <option value="Special:Maintenance">Maintenance page</option>
   <option value="Special:Booksources">External book sources</option>
   <option value="Special:Blockip">Block an IP address</option>
   <option value="Special:Asksql">Query the database</option>
   <option value="Special:Undelete">Restore deleted pages</option>
  </select><input type="submit" value="Go" name="redirect"></form></span>
  <span class="right"><form name="search" class="inline" method="get" action="/w/wiki.phtml"><input type="text" name="search" size="19" value=""><input type="submit" name="go" value="Go"> <input type="submit" value="Search"></form></span>
 </div>
 <div class="spacer"></div>
</div>
<div class="navbox" id="sitelinks">
 <div class="row" id="sitelinksrow">
  <span class="left"><a href="/wiki/Main_Page" class="internal" title="Main Page">Main Page</a> | <a href="/wiki/Special:Recentchanges" class="internal" title="Special:Recentchanges">Recent changes</a> | <a href="/wiki/Wikipedia:Help" class="internal" title="Wikipedia:Help">Help</a></span>
  <span class="right"><a href="/wiki/User:Toby_Bartels" class="internal" title="User:Toby Bartels">Toby Bartels</a> (<a href="/wiki/User_talk:Toby_Bartels" class="internal" title="User talk:Toby Bartels">Talk</a>) | <a href="/w/wiki.phtml?title=Special:Userlogout&returnto=Paddington_station" class="internal" title="Special:Userlogout">Log out</a> | <a href="/wiki/Special:Preferences" class="internal" title="Special:Preferences">Preferences</a></span>
 </div>
 <div class="spacer"></div>
</div>
<!-- ************************************* topbar -->
</div>

<div id="article">
<!-- ************************************* article -->
<div class="spacer"></div>
<p class="actions"><a href="/w/wiki.phtml?title=Paddington_station&printable=yes" class="internal" title="Paddington station">Printable version</a> | <a href="/w/wiki.phtml?title=Paddington_station&action=edit" class="internal" title="Paddington station">Edit this page</a> | <a href="/w/wiki.phtml?title=Paddington_station&action=history" class="internal" title="Paddington station">Page history</a></p>
<p class="languages">Other languages: <a href="http://da.wikipedia.org/wiki/Speciel:Recentchanges" class="external" title="da:Speciel:Recentchanges">Dansk</a> | <a href="http://de.wikipedia.org/wiki/Spezial:Recentchanges" class="external" title="de:Spezial:Recentchanges">Deutsch</a> | <a href="http://es.wikipedia.org/wiki/Cambios_Recientes" class="external" title="es:Cambios Recientes">Espa?ol</a> | <a href="http://eo.wikipedia.org/wiki/Lastaj_Sxangxoj" class="external" title="eo:Lastaj Sxangxoj">Esperanto</a> | <a href="http://fr.wikipedia.org/wiki/RecentChanges" class="external" title="fr:RecentChanges">Fran?ais</a> | <a href="http://it.wikipedia.com/wiki.cgi?RecentChanges" class="external" title="it:RecentChanges">Italiano</a> | <a href="http://ja.wikipedia.org/wiki/%E7%89%B9%E5%88%A5:Recentchanges" class="external" title="ja:">日本語 (Nihongo)</a> | <a href="http://la.wikipedia.com/wiki.cgi?Recent_Changes" class="external" title="la:Recent Changes">Latina</a> | <a href="http://nl.wikipedia.org/wiki/Speciaal:Recentchanges" class="external" title="nl:Speciaal:Recentchanges">Nederlands</a> | <a href="http://pl.wikipedia.org/wiki/Ostatnie_zmiany" class="external" title="pl:Ostatnie zmiany">Polski</a> | <a href="http://pt.wikipedia.com/wiki.cgi?RecentChanges" class="external" title="pt:RecentChanges">Portugu?s</a> | <a href="http://ru.wikipedia.org/wiki/Special:Recentchanges" class="external" title="ru:Special:Recentchanges">Русский (Russkij)</a> | <a href="http://sv.wikipedia.org/wiki/NyligenSkrivnaSidor" class="external" title="sv:NyligenSkrivnaSidor">Svenska</a> | <a href="http://zh.wikipedia.org/wiki/Special:Recentchanges" class="external" title="zh:Special:Recentchanges">中文 (Zhongwen)</a></p>
<h1 class="pagetitle">Paddington station</h1>
<p><strong>Paddington station</strong> or <strong>London Paddington</strong> is the name of a major
<a href="/wiki/Railway" class='internal' title="Railway">railway</a> <a href="/wiki/Train_station" class='internal' title="Train station">station</a> in the <a href="/wiki/Paddington%2C_London%2C_England" class='internal' title="Paddington, London, England">Paddington</a> area of 
<a href="/wiki/London" class='internal' title="London">London</a>, which is the London terminus for long distance trains to the West 
of England and South Wales and some West London commuter services. Stops on 
several lines of the <a href="/wiki/London_Underground" class='internal' title="London Underground">London Underground</a> are also part of the station 
complex: the <a href="/wiki/Hammersmith_%26_City_Line" class='internal' title="Hammersmith & City Line">Hammersmith & City Line</a> at a surface station on the north 
side of the station and parallel with it; the <a href="/wiki/District_Line" class='internal' title="District Line">District Line</a> and 
<a href="/wiki/Circle_Line" class='internal' title="Circle Line">Circle Line</a> in a cutting in front of the station and perpendicular
to it, and the <a href="/wiki/Bakerloo_Line" class='internal' title="Bakerloo Line">Bakerloo Line</a> in deep-level tubes below the station.
<p>
<h2>History</h2>
<p>
The first station to open in the Paddington area was a temporary terminus for
the <a href="/wiki/Great_Western_Railway" class='internal' title="Great Western Railway">Great Western Railway</a> on the west side of Bishop's Bridge Road. The
first GWR services from London to Taplow, near Maidenhead, ran from here in
1838. After the opening of the main station in 1854, this became the site of
the goods yard. After years of dereliction, it is now being redeveloped as a mixed residential and business area called "Paddington Central".
<p>
The main Paddington station between Bishops Bridge Road and Praed Street was
opened in 1854. It was designed by <a href="/wiki/Isambard_Kingdom_Brunel" class='internal' title="Isambard Kingdom Brunel">Isambard Kingdom Brunel</a>, though much of
the architectural detailing was by his associate <a href="/w/wiki.phtml?title=Matthew_Digby_Wyatt&action=edit" class='new' title="Matthew Digby Wyatt">Matthew Digby Wyatt</a>. The Great Western Hotel was built in front of it in 1868-74 by P. C. Hardwick. The
station was substantially enlarged in 1906-15.
<p>
In 1863 the Metropolitan Railway opened the first underground railway, running
from Paddington to Farringdon. Its line emerged from the tunnels at a station
(known for many years as <strong>Bishop's Road</strong>) on the north side of the mainline
station, with a connection to the GWR mainline which allowed it to run regular
services onto the GWR's Hammersmith branch. From the 1930s until the late 1960s
the <a href="/wiki/Metropolitan_Line" class='internal' title="Metropolitan Line">Metropolitan Line</a> and GWR suburban services shared a group of four <a href="/wiki/Railway_platform" class='internal' title="Railway platform">platforms</a>, but
the Underground is now entirely separate and forms Paddington station on the
Hammersmith & City Line.
<p>
In 1868 the Metropolitan Railway opened a new branch to Kensington, with a station
called <strong>Praed Street</strong> in a cutting across that street from
the mainline station. This station is now Paddington station on the Circle and District
Lines. It is linked to the mainline station and the Bakerloo line by a footway that
passes underneath Praed Street and the Great Western Hotel.
<p>
The deep-level Baker Street and Waterloo Railway - now the Bakerloo Line -
arrived in 1913, with platforms underneath the mainline station.
<p>
<h2> Trivia </h2>
<p>
The children's book character <a href="/wiki/Paddington_Bear" class='internal' title="Paddington Bear">Paddington Bear</a> was named after Paddington station.
<br clear=all>
<!-- ************************************* article -->
</div>

</div><!-- id="content" -->

<div id="quickbar-left">
<!-- ************************************* quickbar -->
<div class="quickbarsection">
 <a href="/wiki/Main_Page"><img border="0" src="http://www.wikipedia.org/upload/wiki.png" alt="[Main Page]"></a>
</div>
<div class="quickbarsection">
 <a href="/wiki/Main_Page" class="internal" title="Main Page">Main Page</a><br>
 <a href="/wiki/Special:Recentchanges" class="internal" title="Special:Recentchanges">Recent changes</a><br>
 <a href="/wiki/Special:Randompage" class="internal" title="Special:Randompage">Random page</a><br>
 <a href="/wiki/Special:Watchlist" class="internal" title="Special:Watchlist">My watchlist</a><br>
 <a href="/w/wiki.phtml?title=Special:Contributions&target=Toby_Bartels" class="internal" title="Special:Contributions">My contributions</a><br>
 <a href="/wiki/Current_events" class="internal" title="Current events">Current events</a>
</div>
<div class="quickbarsection">
 <strong><a href="/w/wiki.phtml?title=Paddington_station&action=edit" class="internal" title="Paddington station">Edit this page</a></strong><br>
 <a href="/w/wiki.phtml?title=Paddington_station&action=watch" class="internal" title="Paddington station">Watch this page</a><br>
 <a href="/w/wiki.phtml?title=Special:Movepage&target=Paddington_station" class="internal" title="Special:Movepage">Move this page</a><br>
 <a href="/w/wiki.phtml?title=Paddington_station&action=delete" class="internal" title="Paddington station">Delete this page</a><br>
 <a href="/w/wiki.phtml?title=Paddington_station&action=protect" class="internal" title="Paddington station">Protect this page</a><br>
 <a href="/wiki/Talk:Paddington_station" class="internal" title="Talk:Paddington station">Discuss this page</a><br>
 <a href="/w/wiki.phtml?title=Paddington_station&action=history" class="internal" title="Paddington station">Page history</a><br>
 <a href="/w/wiki.phtml?title=Special:Whatlinkshere&target=Paddington_station" class="internal" title="Special:Whatlinkshere">What links here</a><br>
 <a href="/w/wiki.phtml?title=Special:Recentchangeslinked&target=Paddington_station" class="internal" title="Special:Recentchangeslinked">Related changes</a>
</div>
<div class="quickbarsection">
 <a href="/wiki/Special:Upload" class="internal" title="Special:Upload">Upload file</a><br>
 <a href="/wiki/Special:Specialpages" class="internal" title="Special:Specialpages">Special pages</a><br>
 <a href="/wiki/Wikipedia:Bug_reports" class="internal" title="Wikipedia:Bug reports">Bug reports</a>
</div>
<!-- ************************************* quickbar -->
</div>

</body>
</html>


More information about the Wikitech-l mailing list