none
Problem attaching hyperlink to a jpeg. RRS feed

  • Question

  • My problem; Created project in Design-4, Sliced objects and Exported to file. In EW-4 attempted to insert hyperlink on to a image.

    It appears that I can only attach a link to or into a div and it shows up with the code displayed. The jpg images although they display okay do not show on the crumb line.

    I would appreciate it if someone can point me in the right direction,    Thanks.

    Wednesday, June 16, 2010 3:02 PM

Answers

  • You made the picture the background of the div. Remove the background and insert a picture in the div.

    Jim

    Wednesday, June 16, 2010 6:31 PM
  • As for the code for the link displaying, it's showing exactly what you have entered. If you want the picture to be a link, without text, the image needs to be inside the link tags, and just don't add any text (except for the image's alt text).
    Note too that your test page has everything absolutely positioned. This is a very bad idea. Check out W3Schools if you need to learn about positioning with CSS.

    Jim

    Wednesday, June 16, 2010 6:38 PM

All replies

  • I don't quite understand your problem but you should be able to click the jpg image to select it and then click the Hyperlink button and add the link.

    Ian
    MS MVP Expression

    http://www.ew-resource.co.uk
    http://www.ew-resource.co.uk/v4.aspx  Overview of V4

     


    Ian Haynes
    Wednesday, June 16, 2010 3:21 PM
  • Tnx for response. When I click on the jpeg the div is highlighted, not the jpeg. It seems to act like the jpeg and div are one. Note also that the jpeg is not shown on the crumb line. What do you think now?
    Wednesday, June 16, 2010 3:31 PM
  • What does it say in the code? Also, your best bet would be to post a link to the page so that we can see what is happening. It's hard to tell from just hearing the symptoms.

    Jim

    Wednesday, June 16, 2010 5:27 PM
  • I HATE this forum, the post I made 2 hours ago isn't showing up.

    Work in split view, then you can tell exactly what is selected. As Jim said your best bet is to uplod the page even i8f just to a temporary location and post a link so we can see what is happening.


    MS MVP Expression Tutorials & Help http://by-expression.com
    Wednesday, June 16, 2010 5:32 PM
  • Tnx to all. http://treasurecoastaviation.com/test/final_test.html

    You can see where I tried to click on the image, entered in the link and it gets attched to or in the div and not to the image.

    I am unable to highlite the image.

    Cool eh? 

    Wednesday, June 16, 2010 6:27 PM
  • You made the picture the background of the div. Remove the background and insert a picture in the div.

    Jim

    Wednesday, June 16, 2010 6:31 PM
  • As for the code for the link displaying, it's showing exactly what you have entered. If you want the picture to be a link, without text, the image needs to be inside the link tags, and just don't add any text (except for the image's alt text).
    Note too that your test page has everything absolutely positioned. This is a very bad idea. Check out W3Schools if you need to learn about positioning with CSS.

    Jim

    Wednesday, June 16, 2010 6:38 PM
  • Thanks Jim,

    When I create this test page in MEDesign-4 I slice the text, the image and the background. I then export them all. Design creates a HTML page and all the divs and CSS. MS claims its not perfect but gives me a start at turning a large graphic into a HTML page, I know what they mean, lol.

    http://treasurecoastaviation.com/test/final_test.html

    I made the corrections using EW-4 and now I know what to look for..... the export function out of DESGN is not perfect?

    Thanks for your help Jim.

    Wednesday, June 16, 2010 7:08 PM
  • Design is for graphics.  That it creates HTML does not mean it creates HTML that you should use.  (Sort of like Publisher or Word creating HTML.)

    It is trying to reproduce fixed graphics as if it were on a paper page - that's what all the position:absolute is about.

    Web pages are NOT fixed graphics on paper pages.  Text content will resize (and for accessibility, must be allowed to resize) when the visitor zooms (text only) or resets the text size in their browser.

    When that is done, absolutely positioned sites break badly.  Web pages must be made of containers that will grow when the text inside them grows, and the containers below them must be able to move out of the way when this happens.

    As soon as you put any text on your page, not just graphics, you'll see the problem.

    By all means create graphics in Design.  Just don't have Design create your webpage.

    Wednesday, June 16, 2010 7:44 PM
  • Sparks, Expression Design is a graphics editor, not a Web development platform. The page in your example could be created with a single div, one heading element, and an image link. It would be far lighter in page weight, easier to maintain, and more SEO-friendly (How is the search engine supposed to read your link image text, or your heading?. It looks at the page, sees nothing but images, and moves along.)

    The slice and dice approach to design, although once in vogue, was never really a good idea, and is even less so in these days of paramount SEO importance. You could instead create the link background image with the bevel and gradient, use it as your background image, and then fill the container with your styled copy. Those all-important keywords would then be readable by the SEs. Better would be to create the image using background slices (top, bottom. sides, body) in the fashion of creating rounded corners, so that your container could expand with changes in text size for accessibility.

    You might want to take a look at the learning resources in the BEFORE POSTING sticky thread. The Web is not print, and designing for the Web on the assumption that your canvas is going to be a constant is a big mistake. Better to learn before you start, so that you don't have to rework later. Just sayin'...  ;-)

    cheers,
    scott

     


    C'mon, folks. This isn't rocket science, nor neurosurgery. It's "Expression" (singular) "Web" (singular), in that order, followed by a version numeral if you wish to be specific. It is often abbreviated "EW." It is not "Web Expression," "Expressions Web," "Web Expressions," or plain "Expression" or "Expressions." Not using the correct name indicates either ignorance or laziness. Most folks would rather avoid the appearance of either.
    Wednesday, June 16, 2010 7:50 PM
  • Thanks for your help guys and Gals.

     "Just don't have Design create your webpage." I'm a real newbie at this stuff and I tend to beleive what I read, after all I found it on the web! 

     

    By: Todd Miranda, September 2008

    "You can create an HTML page directly from Expression Design image slices. Todd Miranda demonstrates how."

     

    Wednesday, June 16, 2010 9:58 PM
  • Well, can and should are two different things.  It can create a web page, but not one that you should actually use as the basis of your site!

    Check the Before Posting post, and scroll down to the Resources section.  Ones you should look at now, before continuing to develop a site:  the w3schools.com tutorials on HTML/XHTML and CSS; and Cheryl's Building a Basic Website tutorial.

    Wednesday, June 16, 2010 10:07 PM
  • That is only somewhat correct. You can create a page design and export graphics but that isn't hte same as creating a well formed and cross browser web page. See the resources in the BEFORE POSTING sticky for how to do that with the images you exported.
    MS MVP Expression Tutorials & Help http://by-expression.com
    Wednesday, June 16, 2010 10:09 PM