Is it still possible to create an area shape for a link?

[JoyceOdell]

In  Dreamweaver CS6  it was possible to create an anchor for a link on an image. Not use the whole image as a link, you defined a *part* of the image as an anchor for a link.

There was a selection tool somewhere and you drew the place you wanted to anchor the link on the placed image and created the link to it. it was called an "area shape".

It was very useful, and I can't see any obvious reason why it might have been removed. But I'm nearly to the end of the Dreamweaver Classroom in a Book for DW2021 and haven't yet come across anything mentioning it.

I'm gearing up for a rebuild of the site, since CS6 is not going to be usable once I end up needing to replace my computer. There is a whole series of pages in my CS6 site which use this feature, and DW2021 is able to open those pages. I *may* be able to copy/paste the more elaborate of these button panels into the new build and and just create new links. However, I also use these area shape links on the index page and would like to use them on the new index page as well.  But for that I will need to defile new area shapes, and neither the CS6 nor the DW2021 Classroom in a Book has an index entry for area shapes, nor any reference of how to create them.

I remember doing it in Dreamweaver istelf, but not what I needed to do in order to acomplish it. If you want examples, the current inxex page is at: www.redhen-publications.com

The more elaborate button bar, which I *may* be able to port to the new site is at: http://www.redhen-publications.com/tarot-cards.html

[BenPleysier · Accepted solution]

See https://helpx.adobe.com/in/dreamweaver/using/image-maps.html

[JoyceOdell]

Thanks. I bookmarked it. I thought it seemed too useful a function for them to have deleted it.

[Nancy OShea]

Hi @JoyceOdell,

Image maps are what you're looking for.  But they are not responsive.  In other words, when the image rescales to fit mobile and tablet devices, the linked region (hotspot coordinates) don't rescale with the image.  This will invariably lead to usability problems for most people who don't have a device exactly like yours.  Therefore, traditional image maps are not recommended for anything important.  

OT: Number of Mobile Internet Users Increased to 92.6%

For better usability on all devices, best to stick with individual linked images.  Or use SVG shapes and manually code the shapes with links as in this example:

https://jsfiddle.net/NancyO/6k3v4ge1/21/

Post back if you have any questions.

[JoyceOdell]

I'm bookmarking this discussion as well.

Given that the main purpose of the site is to showcase letter-sized landscape .pdfs,  I definitely want it to be easily viewable on a destop or laptop computer. I'm not all that concerned about tablets, and frankly I could not care less about smartphones

But having my index page get disabled is not something that is acceptable. I may pull the belt and bracers approach and stic a row of buttons across the bottom of the screen *as well as* the hotspots.

Would making sure that the main image of the index page is *not* responsive do an end run around this particular downside?

At present the overall design of the site is not solid, but since the index page mainly is just a collection of buttons to link to the various collections inside the site, it could be scaled for smaller screens without a problem.

[Nancy OShea]

I'm not all that concerned about tablets, and frankly I could not care less about smartphones

==========

I see.  Well the vast majority of Internet users access the web from mobile devices.  Desktops and laptops are the minority.  Also Google penalizes sites for not being mobile-friendly which can adversely effect your traffic & search engine rankings.

https://search.google.com/test/mobile-friendly

That said, it's not my site and I don't have access to your analytics data.  Were it my site, I would utilize a responsive approach to reach the widest audience.  But do whatever you think is best.  Good luck with your project.