SITE REVIEW: quantumcloud.com

  • quantumcloud
  • Proficient
  • Proficient
  • User avatar
  • Joined: May 11, 2004
  • Posts: 456
  • Loc: Dhaka, Bangladesh
  • Status: Offline

Post June 21st, 2004, 6:39 am

rtm223,

Quote:
Never ever ever use px for specifying font sizes. Ever. Always use % or em's, your site should wrap text and be designed so that people with poor eyesight can easilly cahnge font size.



For the link font size, I have one of two options. I can change the links from text to image. That would add at least 20 kbs extra if I want a hover effect with the primary links only. Or I can keep them as is, hoping that 90% of my users using IE And the rest 5% with mozilla or others keep their default font size setting unchanged. A significant portion of overall traffic comes from Bangladesh visitors. And trust me, 99.9999% of them use IE and use a dial up connection. So I decided to go with the text instead of images.

But I think, I will change the actual content's font size to em.


Quote:
Gotta agree here. "Standards compliance" and "cross browser" seem to be seen as dirty words by a lot of web designers. They aren't, and IMHO it displays a lack of professionalism and a lack of care in your work.


I agree with you. However, I think, sometimes it is hard to please just about 100% people. I feel guilty but justified that I had to sacrifice may be, 2% of viewers for a look that I wanted.

Quote:
However i didn't like where the right-hand fixed thing floating in the middle of the screen, it seems like it would look better at the bottom of the screen, fixed there....


I will work on a different background. And let you know.

Quote:
Secondly I don't like the way your left links hover in Moz. I definately don't like the way they hover with JS off! JS should be sprinkled over the top, stuff should still look nice with it off, even if it doesn't look perfect.


Umm...what's wrong when JS is off. I tested with JS off, and except for the hover color falling into default, there does not seem to be any change. The JS only changes the color. It's the same fader JS used in Ozzu also.

Quote:
I understand the reasons for the forum links being there, but it looks rather unprofessional. and why does this:Quote:
Last few topics from Programming, Web design, Multimedia Discussion forum :
need to be there, right in the middle of your page, before the scope of our services bit?? I would suggest just some small text links at the very bottom of the page, thats all you need to get crawled.


The last few topics coming to the 1st page to feed google fresh content on its every visit. It gives the impression of the page being updated on a regular basis. But you are right at least they should be placed below everything else.
And with so many comments about the forum links, think I will move them sooner than I thought.

Quote:
"Site Map" does not give a site map of the site, it goes to the forum.


No it does not. But it's exclusivey for google also(for now).

Quote:
You say you have tried to reduce the code, but just by glancing through your markup, I found quite a few examples of these:
Code:
<div align="right"></div>

Code:
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
I have no idea what these are supposed to do,



I had no idea either. Seems like a glitch in dreamweaver. I first did the site in Dreamweaver MX 2003. Then switched to MX 2004, a few days ago. Perhaps, that's what caused those characters.

Quote:
You have about 5 instances of this style on a div, which is perfect for whacking a class on. In fact, you would do better to scrap all of them, as it is only being used for links. An unordered list would be much more appropriate.


Good suggestion.

Quote:
but is far from perfect. There are a lot of ways that your site could be improved in all sorts of directions.


Why, sure. That is why I appreciate all your opinions so much! :)
Web development company : quantumcloud

Web design company : web.com.bd
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post June 21st, 2004, 6:39 am

  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post June 21st, 2004, 7:04 am

quantumcloud wrote:
For the link font size, I have one of two options. I can change the links from text to image. That would add at least 20 kbs extra if I want a hover effect with the primary links only.

Rubish, you could specify a percentage and make the little box stretch with all of no effort at all, make a top and bottom images and have a repeating background to join them up. It also means you can add an extra link without having to faff with redoing all of your graphics and code etc.

Quote:
I feel guilty but justified that I had to sacrifice may be, 2% of viewers for a look that I wanted.

2% of viewers would account for the users of NSN4,5,6 and IE4. I'm happy for these people to suffer too. You're talking about 15-20% of people on the internet. Your site could be made to work with all but really bad browsers, with minimal hassle. And should, as it's supposed to be a proffesional site.

Quote:
Umm...what's wrong when JS is off. I tested with JS off, and except for the hover color falling into default

Thats what i didn't like, the fact that your hover effect is entirely done in JS. I would have at least specified a hover color in css for non-js type people (stats suggest 10% of people) because the bright blue clashes like hell. Look at ozzu's links, they hover nicely with JS turned off.

Quote:
I had no idea either. Seems like a glitch in dreamweaver. I first did the site in Dreamweaver MX 2003. Then switched to MX 2004, a few days ago. Perhaps, that's what caused those characters.

Tip of the day for dreamweaver users: move your mouse approx 1 inch to the right and 2 inches down from the top left corner of the screen, and click the button that looks like:
<center>Image</center>
That should solve all of your dreamweaver "glitch" problems :wink:
CSS website design tutorials
  • quantumcloud
  • Proficient
  • Proficient
  • User avatar
  • Joined: May 11, 2004
  • Posts: 456
  • Loc: Dhaka, Bangladesh
  • Status: Offline

Post June 21st, 2004, 8:33 am

Quote:
Rubish, you could specify a percentage and make the little box stretch with all of no effort at all, make a top and bottom images and have a repeating background to join them up. It also means you can add an extra link without having to faff with redoing all of your graphics and code etc.


Actually, the problem is not so simple and rubish either. To do such a thing would require some big changes on the top graphics. The left box menu cannot have a repeatable background for buttons. It will lose the effect. And its much more than that too. Its about how the entire page is designed.

But when I do the next version of QC I will keep all these in mind.

Quote:
2% of viewers would account for the users of NSN4,5,6 and IE4. I'm happy for these people to suffer too. You're talking about 15-20% of people on the internet.


I have not read any statistics other than my server one. Here is the top 10 browsers from last 15 days:

144886 79.20% 79275 15037 1153888000 | Mozilla/4.*
17465 9.55% 1104 98 10263126 | Mozilla/3.*
9566 5.23% 7810 1102 68757976 | Mozilla/5.*
5663 3.10% 5181 5181 176280784 | msnbot/0.*
258 0.14% 22 0 69958568 | NetAnts/1.*
1112 0.61% 928 926 24453072 | Googlebot/2.*
891 0.49% 151 151 6047149 | http://www.almaden.ibm.com/cs/crawler [c01]
146 0.08% 0 0 27928264 | DA 5.*
138 0.08% 0 0 7750908 | DA 7.*
469 0.26% 446 36 2396561 0.15% | Opera/7.*


Mozilla/4.* is IE 5.0 or higher. Such as this:
54825 29.97% 26942 5608 520971392 32.12% | Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)

Mozilla/5.* is Firefox and such.

Mozilla 3.0 is something like this:
Mozilla/3.0 [en] (AWV2.30r)
Mozilla/3.0 (INGRID/3.0 MT; webcrawler@NOSPAMexperimental.net; http://aanmelden.ilse.nl/?aanmeld_mode=webhints)
Mozilla/3.0 [en] (AWV2.30r)

I Don't know what kind of browser those are.


Exclude about 10-12% from msn, google and other bots. There is maybe 3% at the most from all browsers together that may make the site look bad. I can expect at least half of the firefox users would be using the default font size.

Quote:
Thats what i didn't like, the fact that your hover effect is entirely done in JS. I would have at least specified a hover color in css for non-js type people (stats suggest 10% of people) because the bright blue clashes like hell. Look at ozzu's links, they hover nicely with JS turned off.


Good suggestion.

Quote:
Tip of the day for dreamweaver users: move your mouse approx 1 inch to the right and 2 inches down from the top left corner of the screen, and click the button that looks like:


May be that's why. I always use code view at top. Design view at bottom.

However, from Commands-Apply source formatting and Clean up html took care of such problems.
Web development company : quantumcloud

Web design company : web.com.bd
  • quietside
  • Newbie
  • Newbie
  • User avatar
  • Joined: Jun 21, 2004
  • Posts: 12
  • Loc: TAMPA, FLORIDA
  • Status: Offline

Post June 21st, 2004, 11:14 am

INteresting.. to say the least... :)
  • quantumcloud
  • Proficient
  • Proficient
  • User avatar
  • Joined: May 11, 2004
  • Posts: 456
  • Loc: Dhaka, Bangladesh
  • Status: Offline

Post June 22nd, 2004, 6:22 am

Well, I have made a few changes. Can I get a second opinion, please?
Web development company : quantumcloud

Web design company : web.com.bd
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post June 22nd, 2004, 7:10 am

Well I personnally think the restructuring of information works better. the links to the left (at the very bottom seem a <i>little</i> odd, but they won't influence anyones "first impressions" if you see what I mean.

I like the coloured border on the images, I will be keeping that in "ye olde bag of nifty tricks". The swapping of colours works nicely. Next challenge: make the text fade one way and the underline fade the other :D only kidding, although you could do it.

I would still add a css property for the text color on hover, although this will cause the "flash" of white you sometimes see here, so there are pros and cons and I understand if you want to avoid that.

I really don't get why the fade script doesn't work in Mozilla/FF. It does on ozzu, although it throws errors, which suggests it is slightly unstable. I keep meaning to look at why that is and fix it (in the generic script - just cos), but have not got round to it yet. There is definately something dodgey about that script......

Um, the image. Um um. I quite liked it before.... What I was meaning to say was that the previous one had a kind of flat bottom and I was suggesting that you just put the background image position lower down, so the bottom was near the bottom of the screen..... I didn't mean to change it completely :oops: but it is your site so it's up to you, both images look good IMHO.
CSS website design tutorials
  • quantumcloud
  • Proficient
  • Proficient
  • User avatar
  • Joined: May 11, 2004
  • Posts: 456
  • Loc: Dhaka, Bangladesh
  • Status: Offline

Post June 24th, 2004, 4:49 am

Thanks rtm223. I fixed the font sizes also. In IE if the font size is increased from view only the main contents' font size will grow big. Can't do anything about firefox. Since it does not care about pixel and em and just arbitrarily increases all text sizes.

Quote:
I like the coloured border on the images,


Umm...what image? Remember no image was used for any link.


Quote:
I would still add a css property for the text color on hover, although this will cause the "flash" of white you sometimes see here, so there are pros and cons and I understand if you want to avoid that.


I think, I did. here is the CSS for link hover:

Code: [ Select ]
a.special:link{
color: #cc6600;    
border-width: 1px;
border-top: 0px;
border-left: 0px;
border-right: 0px;
border-bottom: 1px;
border-color: #cccccc;
border-style: solid;
margin-left: 5px;
margin-right: 5px;
margin-top: 1px;
margin-bottom: 1px;
FONT-SIZE: 10pt;
FONT-FAMILY: times new roman;
letter-spacing: 0.00em;
font-weight: normal;
font-style: normal;
text-decoration: none}
  1. a.special:link{
  2. color: #cc6600;    
  3. border-width: 1px;
  4. border-top: 0px;
  5. border-left: 0px;
  6. border-right: 0px;
  7. border-bottom: 1px;
  8. border-color: #cccccc;
  9. border-style: solid;
  10. margin-left: 5px;
  11. margin-right: 5px;
  12. margin-top: 1px;
  13. margin-bottom: 1px;
  14. FONT-SIZE: 10pt;
  15. FONT-FAMILY: times new roman;
  16. letter-spacing: 0.00em;
  17. font-weight: normal;
  18. font-style: normal;
  19. text-decoration: none}


Quote:
I keep meaning to look at why that is and fix it (in the generic script - just cos), but have not got round to it yet


Please let me know when you do.

Quote:
Um, the image. Um um. I quite liked it before.... What I was meaning to say was that the previous one had a kind of flat bottom and I was suggesting that you just put the background image position lower down, so the bottom was near the bottom of the screen..... I didn't mean to change it completely but it is your site so it's up to you, both images look good IMHO.


I tried bringing that down but it was not looking good and the bg image size was getting too big. So I brought out the trusted Bryce after about an year and made some globes with shadows. I saw such image used by Google and quite liked that. I think this works better. Gives a nice 3d effect.
Web development company : quantumcloud

Web design company : web.com.bd
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post June 24th, 2004, 5:11 am

quantumcloud wrote:
Quote:
I like the coloured border on the images,


Umm...what image? Remember no image was used for any link.

Ok, my bad, i meant to say links.... Sometimes my hands type independantly of my brain - I think the word "link" and my fingers say "image". No idea why, it just happens to me :oops:

Quote:
I think, I did. here is the CSS for link hover:

Code: [ Select ]
a.special:link{
color: #cc6600;    
border-width: 1px;
border-top: 0px;
border-left: 0px;
border-right: 0px;
border-bottom: 1px;
border-color: #cccccc;
border-style: solid;
margin-left: 5px;
margin-right: 5px;
margin-top: 1px;
margin-bottom: 1px;
FONT-SIZE: 10pt;
FONT-FAMILY: times new roman;
letter-spacing: 0.00em;
font-weight: normal;
font-style: normal;
text-decoration: none}
  1. a.special:link{
  2. color: #cc6600;    
  3. border-width: 1px;
  4. border-top: 0px;
  5. border-left: 0px;
  6. border-right: 0px;
  7. border-bottom: 1px;
  8. border-color: #cccccc;
  9. border-style: solid;
  10. margin-left: 5px;
  11. margin-right: 5px;
  12. margin-top: 1px;
  13. margin-bottom: 1px;
  14. FONT-SIZE: 10pt;
  15. FONT-FAMILY: times new roman;
  16. letter-spacing: 0.00em;
  17. font-weight: normal;
  18. font-style: normal;
  19. text-decoration: none}


In firefox with js off the border changes but the font colour doesn't. I don't know about IE i cant find the disable javascript button lol.
Thats the link default style, the hover will be something like:
Code: [ Select ]
a.special:link:hover{
}
  1. a.special:link:hover{
  2. }

Then add a color to that. But, like I said, this will sometimes cause a flash of colour before the fade, so it's entirely up to you whether or not this is acceptable or even worth doing.

I'll probably post the fixed code here when it's done, seeing as so many people use it. About the image - as long as you are happy with how it looks then everything is good :wink:
CSS website design tutorials
  • quantumcloud
  • Proficient
  • Proficient
  • User avatar
  • Joined: May 11, 2004
  • Posts: 456
  • Loc: Dhaka, Bangladesh
  • Status: Offline

Post June 24th, 2004, 5:36 am

Sorry I posted the CSS for link. But I actually did the same with the hover too.

Quote:
a.special:hover{color: #cc6600;
border-width: 1px;
border-top: 0px;
border-left: 0px;
border-right: 0px;
border-bottom: 1px;
border-color: #cc6600;
border-style: solid;
margin-left: 5px;
margin-right: 5px;
margin-top: 1px;
margin-bottom: 1px;
FONT-SIZE: 10pt;
FONT-FAMILY: times new roman;
letter-spacing: 0.00em;
font-weight: normal;
font-style: normal;
text-decoration: none}


But lol, this time the mistake is mine. I defined the link and hover color as the same. :oops:
Web development company : quantumcloud

Web design company : web.com.bd
  • ProgramMax
  • Newbie
  • Newbie
  • No Avatar
  • Joined: Jun 24, 2004
  • Posts: 12
  • Status: Offline

Post June 24th, 2004, 8:59 am

It seems you intentionally hid the links to the forums. This makes sense because forums don't come accross as being all that professional. However when I found the links I felt kinda like it was a lame attempt at hiding it.

I'm sure there is a way to turn every problem into some fantastic solution...to the point where if you saw it after being solved, you never would have thought it was a problem.

Similarly I bet there is some clever way that you could link to the forums without it coming accross as "Well I tried"

The color scheme is nice. The colors are easy on the eyes and there is plenty of contrast. It still feels a bit too blank though.

Post Information

  • Total Posts in this topic: 25 posts
  • Moderator: Website Reviewers
  • Users browsing this forum: No registered users and 20 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.