The new forums will be named Coin Return (based on the most recent vote)! You can check on the status and timeline of the transition to the new forums here.
The Guiding Principles and New Rules document is now in effect.
Just sitewhoring, no worries! (New Design)
Piggo
Registered User regular
Registered User regular
I'm currently working on my website, which i'm very happy with but need a bit of a hand if thats okay. I want to make sure that it works in the main browsers. I on a mac and it seems fine on firefox and safari, but im worried ie is going to display it weirdly.
I would also like design crits, its quite easy to change stuff so i'm very open to suggestions.
So you know what its supposed to look like;
The site is rosscubbon.com
Thanks!
I would also like design crits, its quite easy to change stuff so i'm very open to suggestions.
So you know what its supposed to look like;
The site is rosscubbon.com
Thanks!
Piggo on
0
Posts
#2: All that text on the right is one long column in IE7
#3: Why does it look like it was made in 2000-2003? CSS is the thing now. It's no longer necessary to squish everything together in tables. It's using divs, but not in a way that makes using them better than using tables.
I like the look, it seems fairly clean, but you might want to spend some time working on scalability.
MKR I thought i was using divs and css correctly. I know i've used alot of divs buts thats because i was trying to get it to resize properly. The site was designed to be scalable but its obviously not working properly yet. How should i be using them?
Im going to have to go on a windows computer and try and figure out why the sizing is messing up and the text column as well.
Oh and it asked you to install quicktime because the middle column has a quicktime movie in it.
You missed my point - if it's going to ask me to install something, it needs to be explained what the page wants to show me somewhere on the page so I can assess whether or not it's worth installing it just to view a video.
"MKR I thought i was using divs and css correctly. I know i've used alot of divs buts thats because i was trying to get it to resize properly. The site was designed to be scalable but its obviously not working properly yet. How should i be using them?"
Oh, they're syntactically correct, but you could just as easily have done it with tables. The point is that CSS allows you to open a page up a bit, but you have everything squished together. It's very prison-like. Go use archive.org to look at any long-running website. See how they're bunched together and under 800x600? The technology of the times necessitated that, but now we can have nice, open pages.
Okay, when i start creating the rest of the site the main page won't have any quicktime stuff, and ill put a note about it. I hadn't considered that aspect as i thought that quicktime was common, but i obviously should have.
The page does scale, but yes the 3 columns are fixed. I will have a play around with using a more scalable design for those parts as well.
Thanks for the help by the way, much appreciated.
"Fixed" and "scalable" are mutually exclusive.
Edit: Look at my site. See how everything scales up and down cleanly as you size the browser (down to a certain point)? That's scalable.
Yeah i understand what you mean. I had tried to make the site scale, the silver bar stays centered vertically and while the columns stay fixed the bar will extend to the right, with the gray diagonal lines always staying right at the edge. I will make the columns scale as well now, as it would be nicer if everything does.
EDIT; The final column now scales, and I think it looks quite nice. It should also help fix the weird tiny column thing people were seeing. Quick link.
Okay, first I don't know why MKR is giving so much advice here. Your (MKR) website is not very good. Your content is everywhere, there's no borders, boxes, or lines to separate anything, you have few colors, one of which only exists on your minuscule banner, and your whole page has no margins. Piggo, I'm not sure you should take all your advice from him.
Also, who doesn't have quicktime? that's one of the plugins that people generally just use and don't ask questions about. Lots of web pages have introductory Flash videos, are you saying they should start with introductory text telling you why you should have flash? No. Just get quicktime like all internet-users do. And wasn't the explanation text there from the beginning anyways?
Now on to the advice:
- The gray box with content in it runs into the right side of the screen, making the viewer think there's more content in that direction. If there's not, it's just confusing. You should find some way to stop the viewer from assuming this. Definitely more of a margin on the right side of the text would help.
- You have too much space on the bottom of the page. You should fill up the whole page. Bigger text would work, yours is small, and if other pages have more/larger content, then it should be fine. I hope you plan on doing DIVs with independent scroll bars if your content grows too large. If You can't fill the grey box at all, then center your content vertically.
- Your links are too small vertically. Your making a whole divider of space for them, but they're all in one corner. Either make them bigger, or outline them in a box, move the text to the left, and put the movie on the right. Again, fill your page, blank space is useless.
- You need a more exciting banner. The banner you have on the side is boring and bland, it's blornd. If you made that video, I'm sure you can find some graphic way of making the text better, or mixing the text with some sort of elements in order to make it more exciting.
- Your page doesn't work on a resolution lower than 1024x768. That's not good. Not everyone has big monitors nowadays. The way I did this with my school's website was center everything, and make sure everything could be seen easily in 800x600, but still look good in higher resolutions.
That's all I can think of so far. You don't have anything else for me to look at yet. I'd say with that video you should have included more colors, or something...it's awesome, but it's missing some last little element that I can't exactly describe. Like if the objects/people that went by were moving that would have helped (like video instead of pictures moving) but that would have been really hard.
And thanks for the crits on the video as well! Wasn't expecting that! As a bit of background; the site is going to be used as a portfolio as im studying graphics at the moment at uni, i've just finished my first year and that was the last thing i made. So it was the most obvious choice to use as content for the test page.
Quick redesign idea. The main gray area should then be able to scale for all resolutions, a lot less space is wasted and it allows me to type as much or as little as i want. Not done anything to the logo yet, still thinking about that.
So what is this site about? It'll be easier to give advice if we know who you're designing for. :P
As for the new design, awesome. I wasn't going to suggest a vertical layout because I thought what you had was original and new. I hesitated showing my own site design (www.northcoastprep.org) because it uses that same design. I think you can make it work though, and it's a good start. The space is used a lot better now.
Now to move on to pointers that are more nitpicky than totally constructive...
I'd say make the video a tad smaller and give the text a little space...but this actually depends on how big the content your showing is going to be on average. So say the top area is where the image/video is, and the bottom is where the text is. If there's going to be a lot of text, I'd say there should be a scroll box on the bottom for the text, and it should be a little larger in comparison to the content in the upper area, but not by all that much...basically, this:
Resized and moved stuff, basically just a balancing issue. Also thought you might want to move your title, but it's a matter of preference, it's really not necessary. Keeping it where it is gives your page more of an individual look, and I'd keep any element that can do that. I'm also suggesting some sort of stylized box around the video/content on the top, but that's just something I'd do again. also, I think the banner could benefit from a border/box with some sort of graphic content as I mentioned earlier, but you mentioned you were thinking about that.
These are all just random suggestions based on where I would go if this were my page. Only take to heart something you think would further the personal image you want to create, since this is your portfolio site. Though at the same time you have to keep the "customer" interested, so lot of different opinions helps. Anyways, keep it up. This layout is a step up in terms of convenience of use and usage of space.
Yeah i liked the idea of doing a horizontal layout, but i think it is going to be easier doing it as a standard vertical design.
Thanks for all this, greatly apericated. I'm going to take the mock up and your crits and make it into a proper page and then go from there.
The appearance of my site is completely intentional - I like minimalistic. I used it as an example of scalability, not style, and it does scale. The advice is still valid.
I have only made two pages at the moment, the front page, and the redesigned page you have seen previously. Just click on the big image on the front page to get to that one.
The logo at the top with the red background is going to change for each page to fit with the content on it. When i create a few more pages you will see this in effect.
If you have any other comments or crits i'm still open to suggestions. Hope you like it!
www.rosscubbon.com
When I see your site, I'm all too aware that I'm looking at a website. Everything is boxed in, and the boxes contain boxes. I (or rather the viewer) needs to be fooled or wowed in order to enjoy my stay at the hotel cubbon. Your motion graphics and logo work is very good, and I see no reason not to use that for your website's design direction.
here's something I came up with:
Also, if you want your banner to change, don' change themes. In fact, don't change colors. It's disorienting to a fresh viewer to see the banner change from red to blue - it feels like they left your site. Maybe move the text around change the background, but make sure it stays in the same style: I.E. communist china colors. Or whatever color scheme you end up choosing.
I would also change your title font. It looks like a clip art font pasted on compared to the background you used. I would expect it to look similar in style and font to the text that is spattered about the banner, like where it says "to save these lives" on an upward angle on the right side. A pure black font would probably blend too much into the banner, but at least keep it similar to the grainy, non-straight edged font used in the banner. The polished gray/silver gradient just does not do it to me on the grungy, red and black background.