Forum Moderators: mack
I've done a few sites before. I have some Photoshop and Flash experience, but I've never properly learned HTML or even attempted CSS. For the latest project, however, I decided to try and incorporate Wordpress (which I had been testing out for blogging) as a backend for content.
Now, the main problem: The customized theme, which (to be blunt) is really just a Photoshop layout sliced and slightly edited in NVU plus a modified Kubrick stylesheet, breaks in IE 6. Actually, it breaks in Opera 8 as well, and probably all other browsers. (If someone can check Safari, it would be greatly appreciated.) The only browser it does work on is Firefox.
Specifically:
- The splash page is fine on all three browsers; slight hiccup on IE when it fails to center. (From my understanding, it's a bug in IE that requires you to alternate code to center.)
- The main page in Firefox is fine. In Opera, I believe the problem is the """ to the left and right of each post header. This causes the main table to expand and skews the layout. (Does Opera have trouble with quotes?) In IE, the spacing on the right sidebar between the items is off. The rounded corners don't show either, but I'm aware of that and will fix that shortly. (Transparent PNG)
- The events page seems to be giving the browsers the most trouble. Firefox is fine, aside from the button links sending visitors to the top of the page. (Anyway to fix that?) IE renders a gap between the "Upcoming Events" header and the red box and a small white gap at the bottom of each red box. Dynamic font replacement is also not working. In Opera, the IE gaps don't show and the fonts work; however, the second box has a large red gap that, again, pushes the main table and skews the layout.
Second problem: I took the approach early on to just get the design and layout down first and handle optimization later. However, with things starting to shape up, I'm worried that the size is getting to the point that it wouldn't work for dial-up visitors.
The pages churned out by Wordpress at this point have very convoluted code - to the tune of 30-40kb per page not including images. I've tried running an optimizer on my Flash movies; the end result was actually larger than the original.
I guess what I'm asking is, why is it breaking in these other two browers but not in Firefox? What should I be looking for here? How can I ensure that the rest of the layouts I create for this page don't have the same problem? And outside of creating another skin, can this be optimized to the point where dial-up visitors could view it?
Thanks so much in advance and for your time. Again, I'm open to any suggestions, comments, and critiques. :)
[edited by: mack at 6:28 pm (utc) on Aug. 13, 2005]
[edit reason] Url removed. See TOS [webmasterworld.com] [/edit]
Anyway, I was able to shave off some of the size by removing some unnecessary scripts and enabling gZip for Wordpress. The slowdown is still there, but it isn't as substantial. Unless anyone knows of a way to optimize Wordpress further, I think the focus now is compressing the media. Will attempt to address issues with IE/Opera soon as well. *Any* replies would be greatly appreciated. Thanks!
