www.webdeveloper.com
Results 1 to 6 of 6

Thread: Site compatibility with Chrome

  1. #1
    Join Date
    Mar 2003
    Posts
    13

    Unhappy Site compatibility with Chrome

    Ok, let me begin by saying "I have not done this stuff in nearly 10 years!" A lot (ok, everything) has changed, and even when I made this site years ago, my coding skills were very minimal and sloppy, and shortly after making it, I quit.

    Nevertheless, the site continued to work, which was all my father-in-law needed.

    I noticed yesterday the graphics are misaligned in Chrome, but it still looks fine in IE and Firefox.

    Does anyone know, or can anyone take a peek at the code (yeah, it's a mess and full of non-compliant W3C errors) so I can get on with my life?

    Thanks!

    http://www.taylorbrosdecorativeconcrete.com/

  2. #2
    Join Date
    Mar 2012
    Posts
    1,740
    I've had a brief look and the most obvious point is that you have no DOCTYPE declaration before the opening <html> tag. E.g. To declare the code as HTML5 compliant, you should put <!DOCTYPE HTML> at the beginning of the file. Without such a declaration, the browsers default to "quirks mode". In quirks mode you will not achieve cross-browser compatibility.

    As to the rest of the code, I'd suggest that it is unrealistic to expect anyone to debug the code for free. And, whilst a competent coder could be employed to do that, it might well be more cost-effective to have a new site written from scratch.
    Last edited by jedaisoul; 02-25-2014 at 04:32 PM.

  3. #3
    Join Date
    Oct 2013
    Posts
    552
    I did the same as jedaisoul -- had a brief look in both Chrome and FF. First thought is that your issue has something to do with the image rotating scripts you have. They work in FF but not in Chrome. It may have something to do with not having the type="text/javascript" attribute in your script tags or it may be the stray // --> at the end of each.

    On the other hand and although you didn't ask, for a site built in FrontPage and for the basic design being 9+ years old, it's aged very gracefully and still looks good. JMO and FWIW...

  4. #4
    Join Date
    Mar 2003
    Posts
    13
    @jedaisoul - I guess I was hoping for an easy fix - a line of code that needed to be changed or old/outdated sytax or something. I will add the doctype - I tinkered with it last night, but it fouled the graphics on all the browsers. At that point I knew I was over my head - I didn't keep up with changes in code, which is why I quit making websites years ago.

    @Kevin2 - Thanks for the comments. I'll see about adding/fixing those bits.

    ALSO, is there a simple way to edit php files? Seems like years ago (after the design with Frontpage) I did the rest of the editing with Notepad (Frontpage didn't support php), but when I pulled up the index.php in notepad last night, it was an unformatted mess. Is there a better FREE prog to view the script?

    Thanks again

  5. #5
    Join Date
    Mar 2012
    Posts
    1,740
    Just a couple of ideas:

    1. Between </script> and </head> insert:

    <style>* { margin:0; padding:0; border:0 }</style>

    2. Amend <h1><script> TO <h1><!-- script> also, arguably, you should comment out the matching closing </script> as <!-- /script -->

    No guarantees, and I've no idea what else the changes may affect, but they seem to sort out the header bar in Chrome. Some of the images have also disappeared in Chrome but that does not appear to be related. Not sure why that has happened...

  6. #6
    Join Date
    Feb 2014
    Location
    Canada
    Posts
    155
    Like everyone else, your webpage loaded properly in IE and FF but not in Chrome. I did notice that you were using out-dated syntax and methods, which may account for the unusual effects. I haven't gone through with a fine-tooth comb but at first glance I noticed a few things.

    1)No DOCTYPE, so the browser won't load your page using HTML5 specification.
    2) When you're opening your <script> tags, you're using <script Language = "JavaScript">, however, the correct modern syntax is <script type = "text/javascript">.
    3) I cant imagine it causing the site to behave awkwardly but you have --> each time you close the script with </script>. I'm not sure if you're trying to comment something or if you forgot to remove comments.
    4) In your JavaScript, you're using document.write(...) to place content onto the page dynamically. While this technically is still correct, it's extremely outdated.
    5) You haven't used a single ; throughout your JavaScript.
    6) When inserting a video file into your page, in HTML5 you simply use the following:
    HTML Code:
    <video width = "400" height = "400" id = "myVideo" controls>
         <source src = "clip.mp4" type = "video/mp4"> <!-- browser attempts to load the source files in the order they are listed -->
         <source src = "clip.ogg" type = "video/ogg">
    Sorry, cannot play the videos <!-- occurs if the browser cannot load the source video files -->
    </video>
    You can use JS to control the video files in any manner you choose.

    7) Syntax that is not valid in HTML5 and probably wouldn't do what you want it to. For example, the legal version of <b>...</b> to make content bold is <strong>...</strong> or to give it a class or ID and do it using CSS.


    If you run your HTML code through a HTML5 validator, you can update the code and see if that alone will fix the problem. If not, then your best bet would be to re-do the website. Here's a sample skeleton layout of HTML5 (it's bare-bones):

    HTML Code:
    <!DOCTYPE html>
    <html>
         <head>
              <title>My page</title>
              <meta charset = "UTF-8" />
         <script type = "text/javascript">
              <!-- your JS here but you can also call it in the <body> --> 
         </script>
         <style></style> <!-- can include your CSS here or use <link rel /> for an external CSS file -->
         </head>
         <body>
             // stuff to display
          </body>
    </html>
    Quote Originally Posted by chewbubba
    Is there a better FREE prog to view the script?
    There are quite a few free web servers you can download, the one I prefer to use is Apache (free). You can either do a manual installation or use an installer such as XAMPP, which comes with MySQL, Tomcat (another web server), Mercury and other useful tid bits, all of which is free. One thing to keep in mind is that by default, it will use port 80, however, other programs such as Skype do too, creating a conflict. My preference is rather than tinker with other installed software, you can change the default port to something else, such as 81. To view the script, turn on your Apache web server and in the browser of your choice, type localhost:[your port]/your file path to the script. For IE, you will have to add http:// before the localhost otherwise it attempts to Google your query.

    Since Apache doesn't need an external FTP client, you can drag and drop the .php files and other content into the htdocs folder (default). If you've used FileZilla or similar software, it's akin to placing content within the public_html folder.

    Last bit, most web servers will not show you all of your php errors. You can check the logs via XAMPP and at the top of your script (below session_start() should you happen to use it), include the following 2 lines in each php file:

    PHP Code:
     error_reporting(E_ALL);
     
    ini_set('display_errors'1); 

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles