Page 1 of 2 12 LastLast
Results 1 to 10 of 14

Thread: HTML.....?

  1. 02-18-2008, 08:28 AM #1
    Tanya
    Tanya is offline
    Decaf
    Join Date
    Feb 2008
    Posts
    6

    HTML.....?

    I have been doing photoshop for a few months and I have also learned how to work with Image ready.

    I have followed a few of Photoshopcafe's tutorials but I am struggling with the one tutorial where I design in photoshop, export to image ready and then make it ready for the web.

    The tutorial I am busy with is BUILDING A WEBSITE WITH PHOTOSHOP AND DREAMWEAVER. I am able to do my own design in photoshop, then I am able to do the slices in imageready and the roll overs, and do all the changes as explained in the tutorials, but as soon as I have saved the optimized file in HTML format, and then open that link it shows what I have done, but as soon as I send my html file to my colleagues, it does not show on their computer. Where the pictures / slices are supposed to be, a little red cross shows. I don’t know what I have done wrong??
    Can someone please help me or explain what i have done wrong!!!!
    Reply With Quote Reply With Quote
  2. 02-18-2008, 08:32 AM #2
    rAyVoLvEz
    rAyVoLvEz is offline
    Designer of Life
    Join Date
    May 2004
    Location
    Singapore
    Posts
    11,375
    did u send ur friends/colleagues the images?

    also what is the relative path to ur imageS?

    check the <img src="your image path"/>, what is in your image path?
    Reply With Quote Reply With Quote
  3. 02-18-2008, 08:32 AM #3
    TheDoc
    TheDoc is offline
    Barrista
    Join Date
    May 2007
    Location
    Victoria, BC
    Posts
    1,674
    [edit]Ray beat me to it![/edit]

    The HTML code does not have the images imbedded within it. For your colleagues to see it properly on their own computers, you also need to send all of the image files their way as well.

    [Edited on 2/18/2008 by TheDoc]
    Reply With Quote Reply With Quote
  4. 02-18-2008, 08:32 AM #4
    padiq
    padiq is offline
    Barrista
    Join Date
    Oct 2006
    Location
    Thailand
    Posts
    1,220
    HTML pages do not contain anything but markup (code) by themselves. Where an image is speicified in the code it must be linked to either absolutely or relatively. In other words you have to email them all the images (exported images from IR) plus the html file and then they will be able to see it all. - maybe it's best to zip it all up and then send it all at once instead of attaching individual files...
    Reply With Quote Reply With Quote
  5. 02-18-2008, 08:33 AM #5
    padiq
    padiq is offline
    Barrista
    Join Date
    Oct 2006
    Location
    Thailand
    Posts
    1,220
    ^^^ - ALL POSTED AT THE SAME TIME
    Reply With Quote Reply With Quote
  6. 02-18-2008, 08:45 AM #6
    Tanya
    Tanya is offline
    Decaf
    Join Date
    Feb 2008
    Posts
    6
    Thank you for your answers!
    i will try the options out and see if i have come right!
    Reply With Quote Reply With Quote
  7. 02-18-2008, 08:50 AM #7
    Tanya
    Tanya is offline
    Decaf
    Join Date
    Feb 2008
    Posts
    6
    Originally posted by rAyVoLvEz
    did u send ur friends/colleagues the images?

    also what is the relative path to ur imageS?

    check the <img src="your image path"/>, what is in your image path?
    .......
    i did not send them the pictures, i have all the images on my pc.

    i do not know what the relative path to my images is??

    and i dont know what is my image path.

    What i am trying to do is set up our website, i dont know much about web designing but i am practicing through tutorials. i also want other people to see our company's website when they enter our website. So i am getting stuck when someone or anyone wants to view the site.....
    Reply With Quote Reply With Quote
  8. 02-18-2008, 09:11 AM #8
    dcloud
    dcloud is offline
    Barrista dcloud's Avatar
    Join Date
    Dec 2003
    Location
    Michigan
    Posts
    1,792
    First, if you do your design work in Photoshop and then save them for the web (as JPEG, GIF, etc.) then anyone with a computer can view the files. However, if you're sending them PSD files then they can't view these unless they have Photoshop.

    When you create a web site in DW you do so by "Creating a Site" which you can do from the menu or by clicking on the "Site" link in the column on the right in the DW main window. DW will create it's own site folder within My Documents where all your html pages and images will be stored. Usually you go through these steps in the beginning when you first create a site and are given the opportunity to name this folder.
    Reply With Quote Reply With Quote
  9. 02-18-2008, 10:18 AM #9
    padiq
    padiq is offline
    Barrista
    Join Date
    Oct 2006
    Location
    Thailand
    Posts
    1,220
    You need to open your HTML file with notepad or just view the source code in your browser - then what you need to do is look through the HTML code which has been generated by Photoshop - look for <img> tags - there should be an src attribute which will show a path of where the images 'should' be located.

    In fact - could you post the HTML code (open HTML file with eg.notepad and copy all code) here - just select all of it and post it here and we will have a look and let you know what you need to do
    Reply With Quote Reply With Quote
  10. 02-18-2008, 10:31 AM #10
    Tanya
    Tanya is offline
    Decaf
    Join Date
    Feb 2008
    Posts
    6
    i hope i have done it correctly!!
    thanks for your help james



    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Web page one</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <!-- ImageReady Preload Script (Web page one.psd) -->
    <script type="text/javascript">
    <!--

    function newImage(arg) {
    if (document.images) {
    rslt = new Image();
    rslt.src = arg;
    return rslt;
    }
    }

    function changeImages() {
    if (document.images && (preloadFlag == true)) {
    for (var i=0; i<changeImages.arguments.length; i+=2) {
    document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
    }
    }
    }

    var preloadFlag = false;
    function preloadImages() {
    if (document.images) {
    Web_page_two_04_over = newImage("images/Web-page-two_04-over.jpg");
    Web_page_two_05_over = newImage("images/Web-page-two_05-over.jpg");
    Web_page_two_06_over = newImage("images/Web-page-two_06-over.jpg");
    Web_page_two_07_over = newImage("images/Web-page-two_07-over.jpg");
    Web_page_two_08_over = newImage("images/Web-page-two_08-over.jpg");
    Web_page_two_09_over = newImage("images/Web-page-two_09-over.jpg");
    preloadFlag = true;
    }
    }

    // -->
    </script>
    <!-- End Preload Script -->
    </head>
    <body bgcolor="#FFFFFF" onload="preloadImages();">
    <!-- ImageReady Slices (Web page one.psd) -->
    <table id="Table_01" width="800" border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td>
    <img id="Web_page_two_01" src="images/Web-page-two_01.jpg" width="61" height="27" alt="" /></td>
    <td colspan="6">
    <img id="Web_page_two_02" src="images/Web-page-two_02.jpg" width="735" height="27" alt="" /></td>
    <td>
    <img id="Web_page_two_03" src="images/Web-page-two_03.jpg" width="4" height="27" alt="" /></td>
    </tr>
    <tr>
    <td colspan="2">
    <a href="www.willsons.co.za"
    onmouseover="changeImages('Web_page_two_04', 'images/Web-page-two_04-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_04', 'images/Web-page-two_04.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_04', 'images/Web-page-two_04-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_04', 'images/Web-page-two_04-over.jpg'); return true;">
    <img name="Web_page_two_04" id="Web_page_two_04" src="images/Web-page-two_04.jpg" width="78" height="30" border="0" alt="" /></a></td>
    <td>
    <a href="#"
    onmouseover="changeImages('Web_page_two_05', 'images/Web-page-two_05-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_05', 'images/Web-page-two_05.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_05', 'images/Web-page-two_05-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_05', 'images/Web-page-two_05-over.jpg'); return true;">
    <img name="Web_page_two_05" id="Web_page_two_05" src="images/Web-page-two_05.jpg" width="93" height="30" border="0" alt="" /></a></td>
    <td>
    <a href="#"
    onmouseover="changeImages('Web_page_two_06', 'images/Web-page-two_06-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_06', 'images/Web-page-two_06.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_06', 'images/Web-page-two_06-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_06', 'images/Web-page-two_06-over.jpg'); return true;">
    <img name="Web_page_two_06" id="Web_page_two_06" src="images/Web-page-two_06.jpg" width="160" height="30" border="0" alt="" /></a></td>
    <td>
    <a href="#"
    onmouseover="changeImages('Web_page_two_07', 'images/Web-page-two_07-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_07', 'images/Web-page-two_07.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_07', 'images/Web-page-two_07-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_07', 'images/Web-page-two_07-over.jpg'); return true;">
    <img name="Web_page_two_07" id="Web_page_two_07" src="images/Web-page-two_07.jpg" width="120" height="30" border="0" alt="" /></a></td>
    <td>
    <a href="#"
    onmouseover="changeImages('Web_page_two_08', 'images/Web-page-two_08-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_08', 'images/Web-page-two_08.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_08', 'images/Web-page-two_08-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_08', 'images/Web-page-two_08-over.jpg'); return true;">
    <img name="Web_page_two_08" id="Web_page_two_08" src="images/Web-page-two_08.jpg" width="220" height="30" border="0" alt="" /></a></td>
    <td colspan="2">
    <a href="#"
    onmouseover="changeImages('Web_page_two_09', 'images/Web-page-two_09-over.jpg'); return true;"
    onmouseout="changeImages('Web_page_two_09', 'images/Web-page-two_09.jpg'); return true;"
    onmousedown="changeImages('Web_page_two_09', 'images/Web-page-two_09-over.jpg'); return true;"
    onmouseup="changeImages('Web_page_two_09', 'images/Web-page-two_09-over.jpg'); return true;">
    <img name="Web_page_two_09" id="Web_page_two_09" src="images/Web-page-two_09.jpg" width="129" height="30" border="0" alt="" /></a></td>
    </tr>
    <tr>
    <td colspan="8">
    <img id="Web_page_two_10" src="images/Web-page-two_10.jpg" width="800" height="543" alt="" /></td>
    </tr>
    <tr>
    <td>
    <img src="images/spacer.gif" width="61" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="17" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="93" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="160" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="120" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="220" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="125" height="1" alt="" /></td>
    <td>
    <img src="images/spacer.gif" width="4" height="1" alt="" /></td>
    </tr>
    </table>
    <!-- End ImageReady Slices -->
    </body>
    </html>
    Reply With Quote Reply With Quote
Page 1 of 2 12 LastLast
« Previous Thread | Next Thread »

Posting Permissions

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

Forum Rules