|
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 |
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 |
![monkeyson2](/images/avatars/43.jpeg) Please 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 |
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 |
![monkeyson2](/images/avatars/43.jpeg) Please 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! ![](/images/smileys/grin.gif)
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. ![](/images/smileys/smile.gif) |
|
[ Log in to reply ] |
|
Peter Howkins |
Message #100057, posted by flibble at 14:23, 15/3/2007, in reply to message #100052 |
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. ![](/images/smileys/smile.gif) 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 |
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 ![](/images/smileys/smile.gif)
If it's still weird then it doesn't matter too much, just pretend each design starts in the top left corner ![](/images/smileys/wink.gif) |
|
[ 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 |
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 ![](/images/smileys/smile.gif) |
|
[ 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 |
![monkeyson2](/images/avatars/43.jpeg) Please 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. ![](/images/smileys/smile.gif) |
|
[ Log in to reply ] |
|
Peter Howkins |
Message #100114, posted by flibble at 13:53, 16/3/2007, in reply to message #100111 |
Posts: 891
|
I'm a doofus! Try the right margin! Oh, ignore the right and bottom completely ![](/images/smileys/smile.gif)
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](/images/avatars/574.png) 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. ![](/images/smileys/grin.gif)
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. ![](/images/smileys/tongue.gif) |
|
[ 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. ![](/images/smileys/tongue.gif) Indeed it is. Just don't mention the show. ![](/images/smileys/tongue.gif) |
|
[ Log in to reply ] |
|
Peter Howkins |
Message #100177, posted by flibble at 21:09, 17/3/2007, in reply to message #100121 |
Posts: 891
|
If you pop along to http://www.marutan.net you'll discover that Peter makes the same mistake. ![](/images/smileys/grin.gif)
that's been broken for about 2 years ![](/images/smileys/smile.gif)
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. ![](/images/smileys/tongue.gif) And that's been broken for 9 year ![](/images/smileys/wink.gif) |
|
[ Log in to reply ] |
|
Peter Howkins |
Message #100756, posted by flibble at 20:26, 25/3/2007, in reply to message #100115 |
Posts: 891
|
First HTML version
13 |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #100847, posted by filecore at 14: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 14:55, 27/3/2007, in reply to message #100847 |
![monkeyson2](/images/avatars/43.jpeg) Please 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 ![wink](/images/smileys/wink.gif) ![Devil](/images/smileys/devil.gif) |
|
[ Log in to reply ] |
|
Peter Howkins |
Message #100849, posted by flibble at 15:14, 27/3/2007, in reply to message #100847 |
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 06:08, 28/3/2007, in reply to message #100848 |
Posts: 3867
|
Maybe he wants it to look right in Oregano 2 ![wink](/images/smileys/wink.gif) ![Devil](/images/smileys/devil.gif) Using an older browser? RISC OS users please click here for an Oregano-compatible version.
![unhappy](/images/smileys/unhappy.gif) |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #100875, posted by filecore at 06: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 10:34, 28/3/2007, in reply to message #100875 |
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](/images/smileys/smile.gif) |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #100926, posted by filecore at 05: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](/images/smileys/smile.gif) 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 08:59, 29/3/2007, in reply to message #100926 |
![VincceH](/images/avatars/574.png) 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](/images/smileys/smile.gif) 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 11:48, 29/3/2007, in reply to message #100926 |
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 11:54, 29/3/2007, in reply to message #100927 |
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](/images/smileys/tongue.gif) |
|
[ Log in to reply ] |
|
Pages (2): 1
> >|
|