SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 26

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    The Most Basic Web Page in the World?

    I have just bought the book and I already have the most basic question in the world: Why is it that when I double click on my basic.html. document it doesn't open in my internet browser as the book says? It opens on Notepad, naturally so what am I doing wrong please?

    I am using Windows 7 and Google Chrome.

    Thank you in advance.

    Ana

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,117
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Hi portana. Welcome to SitePoint.

    Well, that's odd, as it should open in your browser. Presumably the filename doesn't have a dot at the end, as you typed it above? it should be just

    basic.html

    and not

    basic.html.

    Does that help? (I know, I've answered with a really basic question, but we all gotta start somewhere!)
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    You don't have the correct file extension. I suspect you have a file called *.txt as you will see in your web browser URL Address bar (if you open the browser via the browser's File open). Make sure when you save the file in Notepad it doesn't have the *.txt extension. It should end in *.html for example: basic.html NOT basic.html.txt like I suspect you accidentally called it - which you'll see in the browser address bar when you open the file via the browser.

    Assuming you have the 3rd Edition refer to [page 33] I don't have Windows 7 but in the old versions of notepad you had to double check you didn't accidentally save as *.txt file. You can obviously just rename the file extension back to *.html or just re-save as *.html

    It also helps if you have your file settings so you can see file extensions so you might want to use "Hide extensions for known file types" to being unchecked.

  4. #4
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes it did help I can now open it on chrome!

    Thank you.

  5. #5
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    No worries glad it helped you get the file extension issue solved.

  6. #6
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Now the picture doesn't come up and all was going so well

    It's my logo I am trying to upload and it's in jpeg format so I don't know what's wrong?

    Sorry to annoy but I need all the help I can get as I can't afford to pay someone to do my website. (I'm having fun actually)

  7. #7
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    When you say "upload" to you mean upload to your own public website or do you mean you are just trying to get an image to display within a webpage like the code excerpt on page 49? If you are just following the book, if you can tell us what page you have got up (and stuck on) to it might help. Because usually it's a case of a small typo for a filename or directory or misplaced image.

  8. #8
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have put this on notepad <p><img src="logo_21460_web.jpeg" width="200" height="162"
    alt="Our logo"/></p>

    but I can't see the picture on the web browser, only a square with my alternative comment inside.

    Also where do you insert the navigation markup for a background, border, etc.? On the style1 document on notepad? I have done this but nothing happened so I'm thinking I should insert it somewhere else?

    Thanks

  9. #9
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just solved the second mystery, wasn't typing the right id attribute.

    Pictures still a mystery...

  10. #10
    SitePoint Zealot
    Join Date
    Jul 2007
    Location
    SW Washington, USA
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Double check that the name of the image is exactly the same as the name you used in the html document. My guess is that the image uses .jpg while your html is looking for .jpeg.

    Also, be sure that the image is in the same folder as the html document.

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,117
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    The file extension certainly is a possibility, but the most common cause here is that the path to the image is not correct, so my money is on Karin Sue's suggestion:

    Quote Originally Posted by Karin Sue View Post
    be sure that the image is in the same folder as the html document.
    You can put the image anywhere you like, but the above comment was made because, currently, you are telling the browser to find the image in the same folder as the web page itself.

    Code:
    <p><img src="logo_21460_web.jpeg" width="200" height="162"
    alt="Our logo"/></p>
    However, if you had the image in a folder called /images/ that is in the same folder as basic.html, then the path should look like this:

    Code:
    <p><img src="images/logo_21460_web.jpeg" width="200" height="162"
    alt="Our logo"/></p>
    There are many variations on that, so you have to consider the path (or link, or URL, or whatever you want to call it) very carefully. It's the same as giving someone directions to a location. You are telling the browser where to go to find the image. If your directions are wrong, it will get lost!
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  12. #12
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    I bet it's a variant of the same problem you had before:

    Code:
    imagename.jpeg.jpg
    I think most all of us agree: it is extremely fun coding a site.

  13. #13
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you, it worked. Can I just say I love you all so much?

    This is quite difficult though, I really admire you people who know a lot about this!

    I'm starting the Gallery page...

  14. #14
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    I'd have nearly tempted you into entering the Pink for October contest. Since entries numbers are low and you are about a quarter of the way into the book and just about will have enough skills to create a simple design it would have been good for practice. In time with enough practice it will get easier and be like riding a bike. Once you get used to how files link it starts to make more sense, etc.

  15. #15
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OMG www.wayforwardenterprise.co.uk

    It doesn't look like what I have done at all! Where are the pictures and the colors?

    <panic>

  16. #16
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So, I have now uploaded my style sheet and I can see the colors but even though I passed all the validation checks (link, html and css) it all still looks a mess and I can't see the pictures: www.wayforwardenterprise.co.uk.

    Any ideas since the website is live?
    Thank you
    Ana

  17. #17
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    6,088
    Mentioned
    256 Post(s)
    Tagged
    5 Thread(s)
    OK - a quick look at your source code suggests it's just a simple mistake in the pathway to the file, like you had previously.

    For example, the location of your logo is shown as
    Code:
    src="desktop/logo/logoimage1.png"
    This was probably correct on your local machine, but it's unlikely to be right now. It's saying that the file logoimage1.png is located inside a folder called logo - which may well be correct - inside another folder called desktop - and I'd guess that's where your problem lies.

    Just alter the paths to show the correct location of the images - probably
    Code:
    logo/logoimage1.png
    but it will depend on exactly how you uploaded them.

  18. #18
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've done that and it still did not work.

    I think it may have to do with what you said about how I uploaded them. But how do I know? I uploaded everything on Filezilla and I think I followed the steps on the book correctly. I really don't know what is wrong...

  19. #19
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    6,088
    Mentioned
    256 Post(s)
    Tagged
    5 Thread(s)
    Unfortunately, I don't have the book, so I can't check what the instruction say there.

    Open Filezilla and connect to your site. In the panel on the right-hand side, you will see the list of files and folders for the site. Your index.html file and the other pages of your site will be in the root directory - a folder called public or www or something similar. Are your images directly in the same folder, or are they inside a sub folder? If they're in another folder, check that you're using the correct name. Also, folder and filenames can be case-sensitive, so if your pathway reads logo/logoimage1.png, but your folder is called Logo, that won't work either.

    See if that helps you locate the problem.
    Last edited by TechnoBear; Oct 16, 2011 at 05:53. Reason: Clarification.

  20. #20
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do I have to write the path to a picture in my computer or the uploaded picture in the web hosting server? I have tried everything I can think of and also suggestions on other websites and really can't find a solution. I'm quite disappointed but I do need to finish the website.

    Also, the book that led me to this website tells me to just write the name of the picture and not the location but that doesn't work either.

    Thanks

  21. #21
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    6,088
    Mentioned
    256 Post(s)
    Tagged
    5 Thread(s)
    You need to have the path to your uploaded picture. I always make a folder called images (very imaginative!) and put all my pictures in there. I keep this folder in the same directory as my html files, so the pathway to the picture is always the same, whether it's on my computer or the server. For example, I could have a folder on my computer called Website, which contains another folder called images and my html files. When I upload these to the server, I can just upload the entire contents of Website to the root directory. Because everything is still in the same relative position, it all still works without having to change any file paths.

    I've tried looking for a directory called logo on your site and it doesn't exist, so that's at least part of your problem - you're asking the browser to find a picture in a non-existent location. First, we need to find where that picture actually is, and then correct the path name.

    Can you locate the picture using Filezilla, as I suggested earlier? Another way to do it would be by using the control panel to your web site. The exact details will vary, depending on your hosting, but if you're using a host with cPanel controls, you can log in to your cPanel, and choose the "File Manager" option. This will let you see which files you have where.

    Don't lose heart - we're here to help.

  22. #22
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorted!!

    I was doing everything right but FileZilla was not updating my html document with the right pathway for the picture. I found this out when I right clicked on the website to look at the markups and the logo directory was still there even though I had changed it to images (several times).

    It was driving me nuts!!

    So when I closed Filezilla and opened it again I uploaded the doc with the right pathway again and it worked. Then I just repeated the same process to all the html docs. Phew!!

    Now I need to know how to make my page pale green instead of white? Please?

    Thank you
    Ana

  23. #23
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by portana View Post
    Now I need to know how to make my page pale green instead of white? Please?
    Easy! Most browsers default to showing the background of a page as white (#ffffff or #fff, if you like shortcuts), unless you tell it otherwise. So to your body style, do this:

    Code:
    body {
      background-color: #f0fff0;
      font-family: Verdana, Arial, "Times New Roman", sans-serif;
      line-height: 125%;
      padding: 0;
      border: 0;
    }
    Or replace the #f0fff0 with whatever color you like. I like to use this site for color codes, but there are more sophisticated hexcode providers out there.

  24. #24
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you

    any suggestions on how I could improve www.wayforwardenterprise.co.uk?

    Thank you

  25. #25
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,117
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by portana View Post
    any suggestions on how I could improve www.wayforwardenterprise.co.uk?
    At this point, it would be best for you to post in the Website Reviews forum. But please make sure to revew three others' sites first, as that's the way it works there.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Bookmarks

Posting Permissions

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