473,320 Members | 2,189 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Web Site Help and Opinion

tharden3
916 512MB
Alrighty, well I've posted many questions in several forums to help me get this far. I've changed many things that all of you at Bytes have suggested to make my Web Page Better. I need your opinion and input on my current version. Its just the outline (no text or content) but I want to make sure everything is good up to this point. What are your suggestions> link

I did find a problem (reason for the edit of this post). A lot of computers still run IE6. My site looks fine in Firefox, IE7, and others.... except IE6. I'd rather you look at the problem than me spend 3 paragraphs trying to explain it. http://ipinfo.info/netrenderer/index.php <----- use this link (you'll be able to see my site in an online rendering program that allows you to view the HTML/CSS in different versions of IE). Look at this site: http://connectar33.110mb.com/index.html
1.) view it in IE7, and you'll see that the navigation bar is fine.
2.) view it in IE6 or 5.5 and you'll see that it drifts far to the left.

Any suggestions as to some CSS or markup that will help me fix this problem in my navigation?

P.S. I checked both the CSS and HTML of my site, and both are valid.
Sep 11 '08 #1
17 1720
drhowarddrfine
7,435 Expert 4TB
page link hangs. .
Sep 11 '08 #2
tharden3
916 512MB
ehh, sorry bout that doc. 110mb has been having problems with many of their server boxes.... I'll post it on another host. I'm at work right now, but I'll do it this evening.
Sep 11 '08 #3
David Laakso
397 Expert 256MB
Bingo! Congratulations, you done good and got rid of all that structural absolute positioning that you had...

Leave IE/6 and down in quirksmode with the xml declaration above the doctype just as you have it.
The corrections for the IE/6 and IE/5.5 issues are (put this stuff at the bottom of your style sheet):
1/ To prevent the horizontal auto expansion:
Expand|Select|Wrap|Line Numbers
  1. * html .all {                                
  2. overflow-y: hidden;
  3. }
  4.  
2/ To stop the IEs from doubling the horizontal margins:
Expand|Select|Wrap|Line Numbers
  1. * html #titlebox, 
  2. * html .navigation, 
  3. * html .horizontalNavText, 
  4. * html .navlinks  {                                 
  5.  display: inline;
  6. }
  7.  
3/ Cross-browser suggestions...

Correct the warning in the CSS validation regarding fonts.

Not a good idea to set height on the vertical nav-- the text will shoot the bottom out on font scaling, nor is the class needed in the html. Try this nav as a replacement for yours: vertical rollover navigation

You can safely delete the z-index rule (s) since you no longer have absolute positioning.

Bring all browsers to default setting this at the top of the CSS file:
Expand|Select|Wrap|Line Numbers
  1. html, body {
  2. background : #fff;
  3. color : #000;
  4. margin : 0;
  5. padding : 0;
  6. }
  7. body {
  8. font : 100%/1.4 Helvetica, Arial, sans-serif;
  9. }
  10. p { margin: 0;}
  11.  
Set "Lorum Ipsum" using <p></p> tag thingies in the center and right content blocks.Delete the heights on those blocks. Let those p's inherit default (100%). Check the page cross-browser at least +2 font-scaling, and at text-size "largest" in the IEs. Make sure the the floats not dropping, that the floats are properly cleared, that the text is not shooting out the bottom of the page, and that all otherwise performs as intended.

An aside:
IE/6, I regret to say is likely to be haunting us for sometime to come -- even after -- IE/8 hits the streets... so good idea to continue support. Whether this is also necessary for its twisted sister IE/5.5 may be a matter of more personal opinion than necessity... (although the above corrections should fix 6 and 5.5, or come fairly close to it).
Sep 12 '08 #4
tharden3
916 512MB
ahh, cool! Those are just the fixes I need. Thanks for the help. I'm afraid I won't be off work for another 8 hours or so, but when I get home this evening I will apply the changes. Thanks again.
Sep 12 '08 #5
tharden3
916 512MB
I'm pretty stoked to announce that after a few months of studying HTML/CSS, I'm off to a great start. Thank you guys for all the help you've provided. The current version renders properly in all web browsers, including IE 6 and 5.5 (thanks David Laakso for all the fixes and tips :D ). I think my next step is to set up the various pages, before I add any text, images, or multimedia. Any other suggestions?
Sep 20 '08 #6
David Laakso
397 Expert 256MB
I think my next step is to set up the various pages, before I add any text, images, or multimedia. Any other suggestions?
On the contrary, I think your next step is to prevent the text in the center panel from heading for the Equator, and prevent the text in the right column from heading to the Equator with heavy hand font-scaling. In plain English, clear the floats.

This is an example [1] of a page more complicated but nevertheless based specifically on yours (I liked your concept, thanks). The embedded CSS may be helpful. Stuck? Write back.
[1] 3col :: primary content 1st in source secondary content 2nd in source
Sep 20 '08 #7
tharden3
916 512MB
Please forgive me, I'm having trouble understanding what you are requesting. I did move the text away from the edges though. Could you clarify a bit? Thanks link
I do understand about the overall height though, I do need to change that so the text won't shoot out the bottom. What do I do?
Sep 20 '08 #8
David Laakso
397 Expert 256MB
I do understand about the overall height though, I do need to change that so the text won't shoot out the bottom. What do I do?
.all is used only once on the page so change it from a class to an id. Set no height on content bearing containers. Use what is called the "easy clearing" method. Amend the CSS to read:
Expand|Select|Wrap|Line Numbers
  1. #all {
  2. width: 920px; 
  3. background-color: #ffc87a; 
  4. margin: 0 auto; 
  5. overflow : hidden;
  6. text-align: left;
  7. }
  8. #all:after {
  9. content : '.';
  10. display : block;
  11. height : 0;
  12. clear : both;
  13. visibility : hidden;
  14. }
  15. #all {
  16. display : inline-block;
  17. }
  18. #all {
  19. display : block;
  20. }
  21.  
You may want to equalize the width of the gutters and side margins and center the header block horizontally.

Nowadays some of us subscribe to putting the primary content first in the source order of the document -- see the example.
Sep 21 '08 #9
tharden3
916 512MB
Nowadays some of us subscribe to putting the primary content first in the source order of the document -- see the example.
but if I put that first, won't it ruin my 'float' order in the markup?
Sep 21 '08 #10
David Laakso
397 Expert 256MB
but if I put that first, won't it ruin my 'float' order in the markup?
You will not be able to use your current method to put the primary content first.
And the world will not come to an end if you leave your layout as is.

Negative-margin float based layouts enable a designer to put any column first in the source order. The example of your page I put up is a negative-margin layout.

Whether you use what some Web designers, myself among them, consider as a more contemporary method is your call, not mine. Some say such layouts are possibly more screen reader friendly, possibly more search engine friendly, possibly easier to set a logical h1-h6 outline of the document structure, and possibly easier to produce print versions from. This method puts: primary content first in source, secondary content second in source, and tertiary content (vertical nav on your page) third in source, followed by the footer (if any).
Sep 21 '08 #11
tharden3
916 512MB
You will not be able to use your current method to put the primary content first.
And the world will not come to an end if you leave your layout as is.

Negative-margin float based layouts enable a designer to put any column first in the source order. The example of your page I put up is a negative-margin layout.
I've looked over the markup and CSS of the example you gave me, and it seems like it'd be a good idea to format my website the way you have suggested. I'm probably going to scrap pieces of my current markup, and lean more toward a negative-margin float based layout. It looks like editing headings and text will be a lot simpler this way too.

Not trying to get too ahead of myself, cause I still have a lot of work to do, but when I do get this up and running, I'd like to be able to post new "blogs" I guess you could call them (almost daily). Updating my site seems like it'd be a hassle if I didn't use any code like PHP. HTML is very static and will be a pain to change every time I want to post a new page. I'm not proficient in programming (yet), although I'm learning Python. Is there some open-source stuff I can "insert" into my source to allow me this capability? I'd like to be able to pretty much click, type, and post new "blogs" or "information".
Sep 22 '08 #12
David Laakso
397 Expert 256MB
I'd like to be able to pretty much click, type, and post new "blogs" or "information".
Have you looked into textpattern, wordpress, or expressionengine ?
Sep 22 '08 #13
tharden3
916 512MB
Have you looked into textpattern, wordpress, or expressionengine ?
are all these about on par with each other, or is there one that really stands out?
Sep 22 '08 #14
David Laakso
397 Expert 256MB
are all these about on par with each other, or is there one that really stands out?
Read what each has to offer and base your decision on which one meets your need?
Sep 22 '08 #15
tharden3
916 512MB
Read what each has to offer and base your decision on which one meets your need?
ok .
Sep 22 '08 #16
tharden3
916 512MB
I'm not sure if it's just my lack of web design intelligence, but I'm having a rather difficult time getting a blog on my website. I've tried several different sites, but it seems that as apposed to the site helping me to insert a blog to my web site, I'm having to modify what the other site has already made.
Sep 27 '08 #17
David Laakso
397 Expert 256MB
I've tried several different sites, but it seems that as apposed to the site helping me to insert a blog to my web site, I'm having to modify what the other site has already made.
Do it vice versa. Produce a blog whose "theme" is your site. You may find video #25 helpful. In the video tutorial a Wordpress bog is created using one of the many "themes" available for that application. It may give you an idea of how to create a blog using "your theme," rather than the theme used in the tutorial.
Sep 27 '08 #18

Sign in to post your reply or Sign up for a free account.

Similar topics

4
by: A.Melon | last post by:
Just curious what the group thinks of this recently redesigned site: http://www.laserquest.com/ (Old version is available via archive.org, may be missing some images)
21
by: Florian Brucker | last post by:
Hi! With the help of this group I finally managed to transfer my website from table layout to CSS layout. The site is now online and I would really appreciate comments about it. I'm...
2
by: Antonio | last post by:
Good Morning, in my personal site http://www.etantonio.it/en I've a section talking about diving where I would want to insert a video of an immersion in Sharm El Sheikh, it is in DVD format and I...
17
by: Don Wash | last post by:
Hi All! First of all I would like to say that VS.NET is one of the finest IDE I've used in years. It really helps me code quickly. Workspace management using auto hide windows, minimizing and...
48
by: northband | last post by:
Hi, I am interested in re-writing my website in Python vs PHP but have a few questions. Here are my specs, please advise as to which configuration would be best: 1.Dell Poweredge Server, w/IIS,...
21
by: John | last post by:
Hi, I updated a site and changed the file extensions from .html to .php. Now i noticed that the google does find the old .html pages but since they're not there anymore... they can't be found....
71
by: Murray R. Van Luyn | last post by:
Hi, Since I have made changes to my website it's been a complete flop. According to the logs, as soon as visitors have downloaded the index page they are off. I can't figure out why? ...
28
by: Neo Geshel | last post by:
NOTE: PAST EXPERIENCE HAS SHOWN ME THAT MANY ON USENET FAIL TO READ ARTICLES PROPERLY PRIOR TO ANSWERING. I AM LOOKING FOR VERY SPECIFIC INFORMATION, THEREFORE PLEASE READ AND UNDERSTAND...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.