Friday 2nd March 2007

As you can tell, the site’s had a lick of paint! Everything should be working OK now, so if you come across anything that looks broken, or that doesn’t work as you expect, do let me know (and tell me which web browser and operating system you’re using).

I’d been hoping to redesign the site for most of last year but somehow 2006 zipped by and I only got started on the project when I had some work fall through over Christmas and New Year.

The site has grown a lot over the past few years and despite occasional tweaks I felt it was getting a little unwieldy and could do with some reorganisation. I was also increasingly dissatisfied with the design and wanted to spruce it up with a look that will hopefully see us through the years to come. There are one or two rough edges I’d like to sort out when time allows, but it’s 99% done for now.

Although I’ve rebuilt things from the ground up there are no new features yet — I’ve just reorganised and redesigned the existing material. However, I have several ideas for interesting new things to add, and this will hopefully be easier with the new site.

So, I hope you like it — let me know if I’ve unwittingly removed something you relied on!

51 Comments

language hat   Link to this

I hate to say it, but it looks awful to me. I don't know, however, whether I'm seeing your design or some travesty caused by browser interference or temporary glitch. I'm using Firefox 1.0.7 and seeing this:

Skip navigation
The Diary of Samuel Pepys

Daily entries from the 17th century London diary

* The Diary
* Encyclopedia
* In-Depth Articles
* Recent Activity
* Site News
* About

* Diary Archive
* The story so far

...looking like something out of the '90s (er, the 1990s, that is, but if they'd had web design in the 1690s...). Is that how it's supposed to look?

language hat   Link to this

Hmm, the comment I just posted has one word per line in tiny type, centered, so I assume something isn't working right!

Conrad   Link to this

Phil,

Congratulations on the new format, it looks very professional.

I was wondering if the page, as I see it, was as others see it. I've got two areas, one on each side of the page, a blank light green colour & about a fifth of the screen width.

I run Mozilla Firefox.

Best regards,
Conrad

Phil Gyford   Link to this

Hmm, the first thing I can think of that might be causing problems is if your browser has cached the stylesheet for the old site.

Go to this URL and then click the Refresh/Reload button in your browser: http://www.pepysdiary.com/style/default/global.css

Then try viewing the site again.

Terry   Link to this

Well done Phil, this new format looks really good.

I see it the same as you Conrad. I'm using Microsoft Internet Explorer.

I like it a lot. :-)

Dan Jenkins   Link to this

Tis looking good. The font be a tad small at my settings, but my browser (Mozilla) remedies that in a keystroke. (The problem be mine, not thine.)

At first glance I thought the white (well, palely-colored) space was too much. At a second look, I find it reads very well.

Good job, Phil!
Thanks for all your efforts!

My day simply is not complete without Pepys.

Paul Chapin   Link to this

Phil, after my initial surprise I decided I like the new format fine, it will just take a few days to get used to it.

One thing I do miss, and hope there's some way of restoring, is an analogue to the "Recently posted annotations" feature and the "New" flags in the old format. I always like to see new annotations to earlier entries, but it's a drag to have to go through the entries one by one to see if they have anything new added. And I'm not sure how we would find new annotations on linked names, places, etc.

Paul Chapin   Link to this

Whoops, scratch second paragraph of my previous comment, I just found the "Recent Activity" tab. Should have explored a little further before complaining.

Nix   Link to this

Looks wonderful to me. I haven't commented much lately, having fallen behind due to travel and a business crunch, but I'm catching up -- the new design came as an unexpected treat when I logged on this evening.

jeannine   Link to this

Phil

This is amazing -looks wonderful! A lovely surprise.

Michael Robinson   Link to this

Phil -- looks wonderful. Congratulations

"... as good in all respects as ever I saw in my life." SP

Will be interesting to see if a change in typographical form -- the absence of bold type for the first line, which used to make it appear to be a heading -- changes anything in our style of entries over time.

Like LanguageHat a little shocked at first -- had to use your link above to re-load the cached stylesheet, am using Firefox 2.0.0.2. (Loaded easily and fine in IE)

Jesse   Link to this

For all the wonderful work you've done it may be a bit churlish to complain so please forgive me.

The right hand side has (or seems to have in comparison) a lot of wasted space that makes the text harder to read. For the daily entries, you've got an Encyclopedia tab on top, do we really need the Encyclopedia menu repeated ad-infinitum down the right hand side punctuated by blocks of large empty space?

Looking at the right hand side of this page (IE7 1280 x 1024) there's also 33% empty space. The content, to me, looks like a supermarket reciept. Not the easiest of reads.

Hope you don't censor all my comments after this.

jean-paul buquet   Link to this

What a (nice) surprise! Works like a charm with Safari 2.0.4 in Tiger 10.4.8 (what would Pepys make of that observation?!). Love the colors palette and Pepys at the top...
i agree with Jesse, the margins are much much too wide for my taste, they scream "Waste of space!".
But i know how indebted i am for your wonderful work and your dedication: so, even if you were to make the columns narrower, i would still rush here every day, and be happy! Thank you Phil.

Mary   Link to this

As always, many thanks to Phil for all the work that he puts into this site. The new look is certainly smart. That said, I have to agree with the other commentators who regret that 'waste of space' at the right-hand side of the page.

Phil Gyford   Link to this

Thanks for the kind comments everyone.

I agree with you all about the relative width of the columns. One reason the right-hand column is so wide is that I have some ideas for new features and these will be placed there.

I had thought about making the right-hand column narrower, at least until I got round to adding new stuff that required the width, but I decided to stop fiddling with the site and just launch it!

But, although all that empty space seems "wasted", if it was made smaller there isn't any more information that could be put in the main column -- it would just mean making the main text a little bigger and giving it more space. Not a bad thing, but it means we're not losing anything at the moment.

And Jesse -- to be honest I kind of agree with you about having the Encyclopedia links next to every diary entry; it seems a bit unnecessary. This was added fairly soon after the site first launched to make it obvious to people where to look for more information before asking questions in the annotations. Some people have since said they still find it useful, so I'm happy to keep it there for now, at least until I come up with something more interesting or useful to replace it...

Lawrence   Link to this

Bit of difficulty to start with, but working fine, looks good, but I think it will need a little getting use to! Thanks for all your hard time consuming work Phil.

Alan Bedford   Link to this

Phil -

The fix worked for me and now I can see the site in Firefox (2.0.0.2) as you intended. Thanks to Michael Robinson for the heads-up.

language hat   Link to this

Looks fantastic now that I can see it -- thanks!

Ira   Link to this

I use IE and like the new site appearance, but I often print out the daily entry and annotations and read the hard copy. Printing today led to everything on 1 page (rather than the more usual 3 to 5 pages) with a very small font size, making it very difficult to read. Any suggestions would be greatly appreciated.

Bradford   Link to this

Very handsome indeed. I was tickled by what L. Hat also saw---all the annotations one word to a line like poetry written on adding machine paper. I am using Mozilla 1.5.0.10, which just updated in the last day or two (and is acting somewhat weirdly elsewhere---anyone know why?---but fine here).
Well-chosen color-scheme, and salutary to have Mr. Pepys's face scoping you out every time you chastise or praise him.

Bradford   Link to this

Now, with IE6 (I wouldn't touch 7 on a bet), everything just as good---except that the subtitle "Daily entries from the 17th century London diary" may be practically invisible against its black background, depending on one's setting for monitor contrast. Maybe if "The Diary" were a rich gold, and the subtitle the color "The Diary" is now?
Yrs, the Armchair Programmer

Ian Mathers   Link to this

I've got a Mac Firefox 1.5.0.10, and it looks great to me at this point. Really nice redesign, and I nice surprise when I came by today.

Phil Gyford   Link to this

Ira - sorry about the printing problem. Looking at the layout of the site for printing is on my to do list but I haven't reached it yet. I'll try and fix it as soon as I can.

wisteria53   Link to this

I've also been with you since the beginning - with the occasional post - and the redesign looks great on the Opera browser (v9.10). Well done and thanks for all your hard work Phil.

ex alta aqua   Link to this

monstruosus!

J A Gioia   Link to this

Looks smashing. Great job!

language hat   Link to this

OK, now I've got another problem. I may be suffering from another bout of what my wife calls Male Pattern Blindness ("Honey, where's the mayonnaise?" "Right there in front of you on the shelf."), but I can't find any way to tell which comments are new since I last visited. Since my normal way of using the site is to go to Recent Comments and work my way up from the last thread with new comments, this is a serious problem. Is there some marker I'm missing? If not, please add one!

Sinclair   Link to this

The new site does not appear to work very well with Firefox; the comments are in 6(?) point type and the menu appears between each entry.

Terry F   Link to this

Folks will need to get used to going to "Recent Activity" to catch the latest annotes.

One nifty feature of the Diary's new format is the links to the preceding/following day to the right of "Post an annotation." Very thoughtful.

Like Bradford, I find the site head does not read well with either IE 6 or Firefox 1.5. Very close scrutiny reveals "The Diary of Samuel Pepys." Is there more text?

Lurker   Link to this

Gah! Boy did you give me a nasty shock when I loaded this site after a long absence! I thought I'd misspelled the URI and got one of those DNS squatters!

Dan Jenkins   Link to this

I am quite happy with the new design, though I was quite startled to see it at first.

I find the new design easier to use and read. Recent Activity is wonderful - as I had never realized there was a way to track new comments other than re-reading each of the last days comments to see what was added. Of course, this says more for my inattention to the old site's capabilities than anything. :-)

At first I thought it too narrow, but I realize I can read faster in a narrower format. (One of the reasons that newspapers are laid out in narrow columns, if I recollect right.) So, that works well for me too.

Those two features have increased my enjoyment of the site. Thank you for your efforts, Phil. Wonderful work!

As some have had problems, I did some testing of my own, as I have access to quite a few different platforms and browsers. It works well for me in all of them. Details below...

I have opened it in Mozilla 1.7.12, Internet Explorer 6.0, Firefox 1.5 and 2.0, all under Windows, Safari on the Mac, Konqueror 3.3 and Epiphany under Linux, text-mode Lynx and Links under Linux also works surprisingly well (that is astounding for far too many websites). My screen reader does a fair job of rendering the site, not that I use it that often. I find it rare to have a site make much sense with my eyes are closed; the new design works, albeit the links appear to be on the time of the annotation of all things.

Great job!

I have had no issues at all on any of these platforms, for what it's worth. (Well, Konqueror does not display apostrophes right, but I know that's a problem with the character set on that system and the age of Konqueror, not any problem of yours).

Carl Wickstrom   Link to this

Congratulations on doing the world, and the USA, a good service by posting the Diary. I preferred the old format in its use of the whole screen from left to right, This skinny vertical column doesn't feel right, and I haven't the computer chops to stretch out the horizontal the way I like. I can use this Apple computer with Safari browser to use the Edit up top to increase the font size 2X, which feels better. You could have 1/5 the horizontal devoted to linky links, but let me have 4/5 of the horizontal devoted to Sam. It feels better if I could see the whole paragraph and grok the whole thing at once.
I ws going to give away my Encyclopedia Britannica of 1966 to a school, until I read the Classic Encyclopedia of 1911 linkylink about the Duke of Monmouth. I shall keep my 1966 Encyclopedia, as it comes from the Golden Age when people had vocabularies of 25,000 words and used them all.
Carl Wickstrom near Boston Mass USA
PS I first read Samuel in the library at MIT years ago, an English professor had given his Compleat Pepys to the library, to be discovered by only the most penitent and worthy students.

Guest   Link to this

Following up on language hat's 3/4 4:14 post:
The new site renders pretty well in Firefox 2.0.0.2, except that ALL links show up in the color for "visited links", making it impossible to tell which links have or have not been visited before.

Nate   Link to this

I'm using the latest version of Firefox. When I view the comments I find one word per line in a very small font. Since there are so many comments I imagine that others have reported this but since I cannot read them ...

MissAnn   Link to this

Well done, I think it's great, a surprise at first, but great nonetheless. Gold star for Phil.

Paul Chapin   Link to this

For Language Hat, Guest, and others with the same question:
There is a large asterisk beside the header for each annotation in the "Recent Activity" tab. For the ones you haven't seen yet, the asterisk is bold; for the others, it is grey. It doesn't always get it quite right, but the same was true of the "New" flags in the old system.
At least that's how it works on my browser (IE7); don't know if others work the same way.

Phil Gyford   Link to this

Thanks Paul, for pointing that out before I could. I realise it's not immediately obvious, but I hoped that (a) having it in the same position as the 'NEW' markers before would help people spot it and (b) a look at the Recent Activity page would give the game away. If it's a bit problem I can change the asterisks for something less attractive but more practical!

For anyone still having problems with tiny, tiny text then go to this URL and then click the Refresh/Reload button in your browser: http://www.pepysdiary.com/style/default/global.css Then return to the site and all will be well.

For those who find the main column too narrow... in the previous design the main column width was a bit less than 64% of the total window width. In the new design the total width is fixed at 750 pixels (so it fits on an 800 pixel wide screen) and the main column's width is about 470 pixels, which is 63% of the total window width.

The logic behind fixing the total width, rather than have it expand to the full width of the window, is that it's generally thought that having 65-80 characters on a line is optimal for reading -- any longer and it's easier for the eye to get "lost" on the way back from the end of the line to the beginning of the next.

GrahamT   Link to this

I *think* I like it. I did like the old, clean, layout with its Google like simple style, but this is OK too. I would prefer to see the text window a bit wider - the longer passages look very daunting when squeezed down the page.
Everything seems to work OK: Firefox 2.0.0.2 on Windows XP Pro.

William   Link to this

Well done. Looks great. Thank you.

... just one minor thing... It looks like you have taken a font and automatically emboldened it (drawn a line around the edge) for the masthead. This isn't allowed in the world of typography, and looks clumsy to me. It would be better without the outline. Or have I just imagined it?

Those of you whining about the column width, it can't be any wider or the line length would be too great and you'd start to have trouble finding the next line. If anything it should be slightly narrower, but you have generous leading so it's okay.

Phil Gyford   Link to this

William, I think you've just imagined the masthead font, or your browser is rendering it strangely. The masthead text is set in bold Georgia text, and it's up to the web browser and operating system as to how that looks (some look better than others).

Dan Jenkins   Link to this

Phil, Could you not use percentages rather than fixed column widths and get the same effect? In other words, the middle column be "63%" rather than "470." For those who use/need lower resolutions, then the page would scale, but still get the overall effect you want, albeit with less text on each line. For those who use higher resolutions, more text would fit in the larger column, but, as a percentage of the screen, the column width would remain the same. I realize this does void the intent of getting 65-80 characters per line, which is reasonable. So, perhaps this idea is self-defeating. Well, I'll throw it out anyways, for what it's worth.

Phil Gyford   Link to this

Part of the reason I went with the fixed width (like most other websites that contain a lot of text) is that it's possible to set the width to something reasonable for reading.

It also makes certain aspects of doing the design easier, because one knows how much space there is -- for some elements it can get very difficult to make things work for any width. And the process was already difficult enough as it was!

Phil Gyford   Link to this

Oh, and I've also now made the main column slightly wider, as mentioned in the next post: http://www.pepysdiary.com/about/archive/2007/03...

dirk   Link to this

I'm with GrahamT...

I'd grown rather fond of the clean cut "old" style, but this new one has a nice "homely" feeling to it (less white space?). The colums is narrower (and yes more daunting with long entries).

Nevertheless I appreciate the work Phil has put into it. Thank you, Phil.

jdon   Link to this

PHIL ...
I like the new design, especially the narrow column. I was having the problem you noted about my eyeballs losing their place when scanning back and forth ... very annoying. The width you chose seems to be about right.
I also like the font... simpler is always better. Font size can be set in most browsers to some extent [as I have done in Firefox 2.0.9].
Why have I never noticed the recent activity button before !!! Praise the Lord !!!
I haven't missed a day since I found this site over a year ago. Thank you for one of the best on the web !!!

Phil Gyford   Link to this

The Recent Activity link wasn't very obvious on the old site and one of the things I wanted to do with the new version was make it more obvious -- I'm glad it worked for you jdon!

Bradford   Link to this

(Picking up comments from 4 March diary postings):
Serif or sans-serif: which is more legible? That depends on the individual typeface and user, and the specific task at hand. Arial is harder to read than Times Roman, ugly though the latter is; yet Arial is often the choice by default because it appears first on many typeface lists. Rockwell cannot be beat for clarity, but can become wearing at length, while the elegance of Lucida Casual or Trebuchet can distract from what's being said. (You don't agree? The point is proved.) By readily enabling readers to distinguish between Pepys's words and those of his annotators, Phil has struck a golden mean.
Computer users who deal extensively with text, online and off, might wish to darken their monitors slightly more than the visually-oriented user; and those fated to work with WORD might investigate the application which enables you (either online or by download) to sharpen and clarify type to match the specs of your particular set-up: Google "Microsoft ClearType."

Bill Dew   Link to this

Brilliant!
Safari 2.0.4 no problems at all (as we'd expect with Macs .... ).
I agree with Phil, the narrower column is much easier to read.
Many thanks for keeping this the best blog on the planet.

IronRoads   Link to this

Regarding the Language Hat, Paul, Phil, Guest discussion:

Recent activity, asterisks and all, does seem to work well once you get used to it, but the one-color links (which don't change color when you follow them) make it hard to tell which days I've read.

I always seem to be a few days behind in my reading (hangs head in shame) but don't want to miss any days, so I mostly read through the archive. I use the followed-link color to keep track of where I left off.

Can anyone suggest a quick-and-simple (like me)way to keep track of where I am? The add-and-delete bookmarks approach is just too complicated for my simple mind.

Many thanks.

Phil Gyford   Link to this

I'm going to remedy the link colour situation. It was an oversight on my part that I didn't do this. It's increasingly common for sites to only have a single link colour (which I think is a bad idea) and I guess I've got used to it. I'll try and find the time over the next few days to find suitable colours.

IronRoads   Link to this

Subtle, but it works.

Many thanks Phil.

(and a belated thanks for the last few years
of daily awesomeness)

Log in to post a comment.

If you don't have an account, then register here.