log in | register | forums
Show:
Go:
Forums
Username:

Password:

User accounts
Register new account
Forgot password
Forum stats
List of members
Search the forums

Advanced search
Recent discussions
- WROCC March 2024 meeting o... Hughes and Peter Richmond (News:1)
- Rougol March 2024 meeting on monday with Bernard Boase (News:)
- Drag'n'Drop 13i2 edition reviewed (News:)
- South-West Show 2024 talks (News:4)
- February 2024 News Summary (News:1)
- Next developer fireside chat (News:)
- DDE31d released (News:)
- South-West Show 2024 Report (News:)
- South-West Show 2024 in pictures (News:)
- Big NVMe news for the RISC OS at the South-West Show (News:)
Latest postings RSS Feeds
RSS 2.0 | 1.0 | 0.9
Atom 0.3
Misc RDF | CDF
 
View on Mastodon
@www.iconbar.com@rss-parrot.net
Site Search
 
Article archives
The Icon Bar: The Playpen: Endless website redesign
 
  Endless website redesign
  This is a long thread. Click here to view the threaded list.
 
Peter Howkins Message #100045, posted by flibble at 13:45, 15/3/2007
flibble

Posts: 891
Not for the first time I'm having a go redesigning my website. Can anyone with a better eye for style than me give these mockups a critique?

Last time I came up with a design 3, used it for 6 months, then went back to the original from about 2000 0

This time I thought I'd worry more about the design first and code the html once I had something I liked, here are 3 mockups of ideas.


4
5
6 (with a temp fake logo)

And two recolours of test 5, to see if purple was any better.
7
8

They could all do with more detailing, but I thought I'd see what people liked about the general ones before picking one.
  ^[ Log in to reply ]
 
Phil Mellor Message #100046, posted by monkeyson2 at 13:51, 15/3/2007, in reply to message #100045
monkeyson2Please don't let them make me be a monkey butler

Posts: 12380
I like 5 and 7 lots.

The spacing and font sizes are nicely balanced (although I'd like to see how they look with the Marutan and header links lining up with the main text instead of the the main box)

Hate 4.

0 and 3 would look neater if the padding was reasonable and consistent (some boxes look very cramped, but none of them match).
  ^[ Log in to reply ]
 
Peter Howkins Message #100051, posted by flibble at 14:05, 15/3/2007, in reply to message #100046
flibble

Posts: 891
I like 5 and 7 lots.

The spacing and font sizes are nicely balanced (although I'd like to see how they look with the Marutan and header links lining up with the main text instead of the the main box)
Like this? 9
  ^[ Log in to reply ]
 
Phil Mellor Message #100052, posted by monkeyson2 at 14:07, 15/3/2007, in reply to message #100051
monkeyson2Please don't let them make me be a monkey butler

Posts: 12380
I like 5 and 7 lots.

The spacing and font sizes are nicely balanced (although I'd like to see how they look with the Marutan and header links lining up with the main text instead of the the main box)
Like this? 9
Me like!

The dividers between your header links could be clearer too. You could use a different colour for the | bars, or use those little stars, or add some more of the same horizontal padding, or something.
  ^[ Log in to reply ]
 
Peter Howkins Message #100057, posted by flibble at 14:23, 15/3/2007, in reply to message #100052
flibble

Posts: 891
The dividers between your header links could be clearer too. You could use a different colour for the | bars, or use those little stars, or add some more of the same horizontal padding, or something.
10
  ^[ Log in to reply ]
 
Colin Cartmell-Browne Message #100081, posted by Col at 08:33, 16/3/2007, in reply to message #100057
Member
Posts: 89
Quite like 10 but on designs 4 onwards there's quite a bit of white space to the left (at least there is on IE6 on my works pc.

Regards
Col

[Edited by Col at 10:17, 16/3/2007]
  ^[ Log in to reply ]
 
Peter Howkins Message #100088, posted by flibble at 11:07, 16/3/2007, in reply to message #100081
flibble

Posts: 891
Quite like 10 but on designs 4 onwards there's quite a bit of white space to the left (at least there is on IE6 on my works pc.
Try now, I've added some more margin hackery on to it, though I've not got ie6 here to test with ... only 7, 5.5, 5, 4 and 3

If it's still weird then it doesn't matter too much, just pretend each design starts in the top left corner
  ^[ Log in to reply ]
 
Colin Cartmell-Browne Message #100104, posted by Col at 12:25, 16/3/2007, in reply to message #100088
Member
Posts: 89
Tried- and I'm afraid its still the same.
  ^[ Log in to reply ]
 
Peter Howkins Message #100107, posted by flibble at 12:46, 16/3/2007, in reply to message #100104
flibble

Posts: 891
Test 4 isn't trimmed right to the edges but 5, 6, 7, 8, 9 and 10 are.

Is there any chance you could do me a screenshot, because it's likely I'll want to get rid of the margin on the final page as well as the mockup
  ^[ Log in to reply ]
 
richard cheng Message #100108, posted by richcheng at 13:20, 16/3/2007, in reply to message #100107

Posts: 655
There's no left margin on IE6 on my work computer.
  ^[ Log in to reply ]
 
richard cheng Message #100109, posted by richcheng at 13:21, 16/3/2007, in reply to message #100108

Posts: 655
Could this be a job for BrowserCam!
  ^[ Log in to reply ]
 
Colin Cartmell-Browne Message #100110, posted by Col at 13:24, 16/3/2007, in reply to message #100107
Member
Posts: 89
I can do a screenshot- daft question though,how do I get that shot to you? (I could post here but how?)

[Edited by Col at 13:24, 16/3/2007]
  ^[ Log in to reply ]
 
Colin Cartmell-Browne Message #100111, posted by Col at 13:37, 16/3/2007, in reply to message #100108
Member
Posts: 89
I'm a doofus! Try the right margin!
  ^[ Log in to reply ]
 
Phil Mellor Message #100113, posted by monkeyson2 at 13:51, 16/3/2007, in reply to message #100111
monkeyson2Please don't let them make me be a monkey butler

Posts: 12380
I'm a doofus! Try the right margin!
The space to the right and below is perfectly normal - Peter's only posting screenshots, he hasn't written the HTML yet.
  ^[ Log in to reply ]
 
Peter Howkins Message #100114, posted by flibble at 13:53, 16/3/2007, in reply to message #100111
flibble

Posts: 891
I'm a doofus! Try the right margin!
Oh, ignore the right and bottom completely

These are just fixed width PNG images of designs that I would make full page width when converting into HTML.

In other news, an experiment with background texture and more detail lines.

11
  ^[ Log in to reply ]
 
Colin Cartmell-Browne Message #100115, posted by Col at 13:58, 16/3/2007, in reply to message #100114
Member
Posts: 89
Ok sorry about the mistake. God only knows how I managed to confuse my left from my right.

11 looks good.
  ^[ Log in to reply ]
 
VinceH Message #100121, posted by VincceH at 18:36, 16/3/2007, in reply to message #100115
VincceH
Lowering the tone since the dawn of time

Posts: 1600
God only knows how I managed to confuse my left from my right.
If you pop along to http://www.marutan.net you'll discover that Peter makes the same mistake.

Mind you, he also seems to think that alt.tv.babylon5 is 'the' Babylon 5 newsgroup, while anyone with any sense knows that alt.babylon5.uk is, in fact, THE Babylon 5 newsgroup.
  ^[ Log in to reply ]
 
Steve C Message #100129, posted by Steve at 21:31, 16/3/2007, in reply to message #100121
Member
Posts: 95

Mind you, he also seems to think that alt.tv.babylon5 is 'the' Babylon 5 newsgroup, while anyone with any sense knows that alt.babylon5.uk is, in fact, THE Babylon 5 newsgroup.
Indeed it is. Just don't mention the show.
  ^[ Log in to reply ]
 
Peter Howkins Message #100177, posted by flibble at 21:09, 17/3/2007, in reply to message #100121
flibble

Posts: 891
If you pop along to http://www.marutan.net you'll discover that Peter makes the same mistake.
that's been broken for about 2 years


Mind you, he also seems to think that alt.tv.babylon5 is 'the' Babylon 5 newsgroup, while anyone with any sense knows that alt.babylon5.uk is, in fact, THE Babylon 5 newsgroup.
And that's been broken for 9 year
  ^[ Log in to reply ]
 
Peter Howkins Message #100756, posted by flibble at 19:26, 25/3/2007, in reply to message #100115
flibble

Posts: 891
First HTML version

13
  ^[ Log in to reply ]
 
Jason Togneri Message #100847, posted by filecore at 13:52, 27/3/2007, in reply to message #100756

Posts: 3867
<style type="text/css">
<!--
* {
font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* Netscape 4 doesn't support * for all elements */
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
}


*.serif {
font-family: Times New Roman, Times, serif;
}

/* Netscape 4 doesn't support * for all elements */
span.serif, td.serif {
font-family: Times New Roman, Times, serif;
}

a {
text-decoration: none;
color: #F3F565;
}
-->
</style>


Inline? Haven't you ever heard of properly marked-up HTML supplemented by an external CSS stylesheet? That's what they've been focusing on for most of this millennium - www.csszengarden.com, for example, or www.w3schools.com

[Edited by filecore at 14:53, 27/3/2007]
  ^[ Log in to reply ]
 
Phil Mellor Message #100848, posted by monkeyson2 at 13:55, 27/3/2007, in reply to message #100847
monkeyson2Please don't let them make me be a monkey butler

Posts: 12380
Inline? Haven't you ever heard of properly marked-up HTML supplemented by an external CSS stylesheet? That's what they've been focusing on for most of this millennium - www.csszengarden.com, for example, or www.w3schools.com
Maybe he wants it to look right in Oregano 2 winkDevil
  ^[ Log in to reply ]
 
Peter Howkins Message #100849, posted by flibble at 14:14, 27/3/2007, in reply to message #100847
flibble

Posts: 891
Inline? Haven't you ever heard of properly marked-up HTML supplemented by an external CSS stylesheet?
Yes.

I haven't yet decided on how much to code in CSS as opposed to old fashioned (works in crusty browsers) HTML. Once I figure out a better split I'll refactor it.

[Edited by flibble at 15:14, 27/3/2007]
  ^[ Log in to reply ]
 
Jason Togneri Message #100874, posted by filecore at 05:08, 28/3/2007, in reply to message #100848

Posts: 3867
Maybe he wants it to look right in Oregano 2 winkDevil
Using an older browser? RISC OS users please click here for an Oregano-compatible version.

unhappy
  ^[ Log in to reply ]
 
Jason Togneri Message #100875, posted by filecore at 05:11, 28/3/2007, in reply to message #100849

Posts: 3867
I haven't yet decided on how much to code in CSS as opposed to old fashioned (works in crusty browsers) HTML. Once I figure out a better split I'll refactor it.
But in that last example layout, which I quoted, you're already coding in CSS - you're just using the CSS inline rather than called from a seperate document! So even if you're only using CSS for styling and not for layout, still, why not load it from outside? Then it's still easy to hard-code the page in HTML and change the look and feel of it through font sizes and colours. It's just neater from the server/development/updating side.
  ^[ Log in to reply ]
 
Matthew Somerville Message #100885, posted by Matthew at 09:34, 28/3/2007, in reply to message #100875
Matthew

Posts: 520
But in that last example layout, which I quoted, you're already coding in CSS - you're just using the CSS inline rather than called from a seperate document!
I often do this. It's much easier for me to be able to change things in one document and see the results instantly when developing. I don't see why someone's development method should concern you? smile
  ^[ Log in to reply ]
 
Jason Togneri Message #100926, posted by filecore at 04:54, 29/3/2007, in reply to message #100885

Posts: 3867
It's much easier for me to be able to change things in one document and see the results instantly when developing.
Yes. That one document is called a cascading style sheet ;-)

I don't see why someone's development method should concern you? smile
If it wasn't intended to concern me, then why was it posted in, or all places, The Playpen?
  ^[ Log in to reply ]
 
VinceH Message #100927, posted by VincceH at 07:59, 29/3/2007, in reply to message #100926
VincceH
Lowering the tone since the dawn of time

Posts: 1600
It's much easier for me to be able to change things in one document and see the results instantly when developing.
Yes. That one document is called a cascading style sheet ;-)
Not necessarily - and particularly in the early stages, where as well as change the style sheet, you might want to add styles for something, and have to change the html so that something uses that style, giving it a class or id. Having both in the same document while initially designing saves switching documents to make changes, and changing/saving both.

I don't see why someone's development method should concern you? smile
If it wasn't intended to concern me, then why was it posted in, or all places, The Playpen?
I think he was after thoughts on the page as rendered, not the underlying HTML/CSS.

And, in true jumping-on-the-bandwagon style:

http://www.softrock.co.uk/newdesign.html
  ^[ Log in to reply ]
 
Peter Howkins Message #100937, posted by flibble at 10:48, 29/3/2007, in reply to message #100926
flibble

Posts: 891
It's much easier for me to be able to change things in one document and see the results instantly when developing.
Yes. That one document is called a cascading style sheet ;-)
I think I'll worry about people that browse the web with a browser before I try to please those that browse in a text editor.
  ^[ Log in to reply ]
 
Andrew Poole Message #100938, posted by andypoole at 10:54, 29/3/2007, in reply to message #100927
andypoole
Mouse enthusiast
Web
Twitter

Posts: 5558
And, in true jumping-on-the-bandwagon style:

http://www.softrock.co.uk/newdesign.html
Am I the only person here who isn't redesigning my website at the moment? tongue
  ^[ Log in to reply ]
 
Pages (2): 1 > >|

The Icon Bar: The Playpen: Endless website redesign