16 replies [Last post]
gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

After about 5 weeks of tinkering around, I have finally finish my website. I have ran it against several validators for both html and css and everything has passed. I have tested it on IE 7 (still trying to find some machines with IE5 & 6), Firefox, Safari (Windows), and Opera.

Opera had some problems with an accordion javascript and not rendering the page correctly (i.e. the accordion would expand, but you would have to switch to a different application and switch back to see the changes).

The site uses quit a bit of javascript, both synchronous and asynch, so if you have it disabled, everything will look wierd.

This is a personal website, so i dont expect much traffic, but I prefer to do things the right...so if you have any comments/suggestions, please feel free...i'm not the type to take things personally.

You can find my site at: http://www.lambandtunafish.com/

Thanks!

marcosmyara
Offline
Enthusiast
Last seen: 10 years 29 weeks ago
Joined: 2007-12-19
Posts: 66
Points: 0

looks sweet man!!! i like

looks sweet man!!!
i like it.. congrats..

by the way, i know u probably dont wanna hear about it after 5 weeks, but when i open the Wind Simulator theres a glitch at its bottom border (that also affects the last item, utah teapot, the same way). its like the middle of the bar is nudged upwards or something.. well its only on that one so maybe its something easy for u to fix.. apart from that it all looks cool.

im on the latest firefox for mac.

cya

Marcos.

Tom L
Tom L's picture
Offline
Enthusiast
Liverpool
Last seen: 8 years 34 weeks ago
Liverpool
Timezone: GMT+1
Joined: 2005-09-23
Posts: 91
Points: 2

For old IE's:

For old IE's: http://tredosoft.com/Multiple_IE

It's spot on Smile

Just loaded your site and the header and nav looks smart but the rest of site isn't loading.

burlster
burlster's picture
Offline
Leader
Bournemouth
Last seen: 2 years 10 weeks ago
Bournemouth
Timezone: GMT+1
Joined: 2007-05-31
Posts: 693
Points: 45

Spaced Out!

I had a quick look in IE7. Looks good. My only negative observation would be the large amount of empty scrolling space at the bottom of the page. I'm one of those irritating people who assumes large empty spaces means it hasn't finished loading yet! That could just be me though...

Have YOU said Hello yet?
The CSSCreator Hello Thread

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

thanks for the

thanks for the feedback:

marcosmyara: I should have access to a mac this weekend, so I will test it on there

Tom L: Thanks for the link to run multiple versions of IE...i figured the site would have problems with the older ones...in fact, I ran into a bunch of unexpected problems with IE7 as it is

burlster: I'm with you on the unneeded whitespace at the bottom, it bugs me as well. Let me explain why I did this. The major portion of the site is all in 1 html page, and simply uses javascript to slide along to the right div. With that being said, I initially had the javascript to set the hieght to only what was needed onDomReady (for the homepage)...but then i ran into the following test case:

Go to Projects, then navigate away from the page, then press back...with my initial design of setting the height onDomReady, it would set the height to be too short (the size needed for the home page), and thus half of the page was cut off. So I had to remove the onDomReady command

However, while navigating through the site, the javascript does set the needed height of each page to get rid of unneeded whitespace...its just the first page that has this problem.

I figure I should be able to fix it by adding some logic to the javascript code to figure out which div is being displayed, and to set the height accordingly, but I am putting that off until I fix any other issues (i.e. site not loading on certain browsers)

Lastly, on a side note, someone pointed out that if you increase the font size, the whole site design goes to *beep*, so I was wondering if it is a wise idea, from a design standpoint, to use pt/px instead of em when setting fonts and widths?

Thanks for the feedback!

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

So I realized that using a

So I realized that using a fixed pt/px for font size doesnt prevent a browser from increasing/decreasing the font size...so I only replaced the em with px in places related to width/height

On to my next question, after looking at TredoSofts way of installing multiple versions of IE, I am stuck wondering which versions of IE I should test and fix problems with. Eventually there is a point of limited returns on my time...so should I just focus on IE 6, or should I also include 5 & 5.5? what about IE 3 & IE4?

Same thing goes for firefox

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 16 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

IE6 is the lowest you should

IE6 is the lowest you should go. Probably about 0.0003% of people use IE5.5 (and MS officially ditched support for it, it's that bad) so stick with:

Firefox (1.5, 2 and if you want to, 3)
Opera (9.5 is the latest one I believe?)
IE6 and IE7

then check the other ones like Safari, Konqueror, etc.

Verschwindende wrote:
  • CSS doesn't make pies

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

So I installed IE6, and I

So I installed IE6, and I have been struggling quite a bit...it seems that there are both css and javascript issues, but I have been focusing more on the css side, and when I fix things in IE6, it breaks then for IE7 and Firefox...

With respect to css, my issues are regarding margins / height / width settings. I am using explicit pixel defintions...but they show up differently across the browsers...I dont get it, I thought a pixel was a pixel.

For example, the reason the whole header looks looks wierd in IE6 is because of a margin-left: 10px; setting for the title, if I change this to 5px, it looks fine in IE6, but then IE7, and firefox look weird.

Does anyone have any ideas? How popular is IE6? (i'm guessing its still pretty heavily used)

the funny thing is, even commonly used websites like google.com dont load properly in IE6 (the page has errors)...but things atleast look ok

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 16 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

You'll never achieve

You'll never achieve pixel-perfect layouts between browsers, nor should you attempt to. As long as the site works in both browsers and looks similar you'll be fine Wink

Verschwindende wrote:
  • CSS doesn't make pies

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

I suppose your right...I

I suppose your right...I made a small tweak so that the header in IE6 doesnt look as bad as it originally did...(i.e. everything is still on the same line, and there isn't any overflow)...but the bottom portion of the header still looks wierd in IE6...it does look correct in all other browsers I tried (IE7, Firefox 2, Safari, and Opera)..I suppose there is no way to get it to look perfect in all browsers...

still have to test Firefox 1.5 and Safari & IE on a mac...

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 16 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

IE on Mac is dead. Don't

IE on Mac is dead. Don't bother with it Wink

Verschwindende wrote:
  • CSS doesn't make pies

ricoschette
ricoschette's picture
Offline
Regular
Estonia
Last seen: 10 years 21 weeks ago
Estonia
Joined: 2005-09-18
Posts: 36
Points: 0

In my opinion logo doesn't

In my opinion logo doesn't look very good when that wide.
I'd work on graphics as well and make it more complicated Tongue
But that's me...

It looks fine.

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

what would you suggest?

what would you suggest? other than making it skinnier? Im not much of a photoshop guy...so I dunno how complicated I can make it =]

shlarsen
Offline
newbie
Denmark
Last seen: 11 years 48 weeks ago
Denmark
Joined: 2008-01-01
Posts: 5
Points: 0

I am completely in love with

I am completely in love with the horizontal roll on-off of text on your site!

Regarding inter-browser compatibility: According to your head-tags, it seems like you don't know about conditionality for IE - it's a bit of a hack, but as it is inside a comment, it validates and I haven't hesitated to use it on my own site, www.iproof.dk. I make it use a basic style-sheet for everything else than IE, another one for IE7 and a last one for all IE lower than IE7. In that way, it is actually possible to achive (near) pixel-perfection in different browers on less complex sites as mine. Read about the conditional tags eg. here: http://msdn2.microsoft.com/en-us/library/ms537512.aspx

Regarding tests in different browsers: I found www.browsershots.org quite useful! As I'm using Vista and can supposedly in no way get other versions than IE7 installed... But of course only for design - for functionality, live action is needed...

What browsers to test with? Well, I go primarily with FF2 (1.5), IE6, IE7 - relying on the statistics here: http://www.w3schools.com/browsers/browsers_stats.asp. 1.6% using IE5/5.5...

That's all the tricks I have for now.

/Søren, Denmark

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

Hi shlarsen, Thanks for

Hi shlarsen,

Thanks for your feedback...i wasnt aware that you could define different style sheets for different browsers. Thats something to definitely keep in mind, although it does add more overhead to the design/development/maintenance portion of keeping a website.

For now I have slightly modified my css so that it looks *decent* in ie6 (there is still a bit of a margin problem with the header)...

but i will try to use the different style sheets when i get a chance. Thanks again.

Also, with the design of your site, it would be rather easy to adapt a vertical/horizontal scrolling element.

shlarsen
Offline
newbie
Denmark
Last seen: 11 years 48 weeks ago
Denmark
Joined: 2008-01-01
Posts: 5
Points: 0

Yeah, I might want to try

Yeah, I might want to try that! Do you have a link to the script and how to use it? Thanks - Søren

gmoniey
Offline
Regular
Last seen: 11 years 41 weeks ago
Joined: 2007-11-05
Posts: 25
Points: 0

yea, I used mootools

yea, I used mootools javascript library. It is lightweight, and a lot smaller than scriptalicous/prototype.

Check out the demos here: http://demos.mootools.net/, you'll be interested in Fx.Scroll