{"id":40385,"date":"2018-08-27T03:01:15","date_gmt":"2018-08-26T17:01:15","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=40385"},"modified":"2018-08-27T13:56:17","modified_gmt":"2018-08-27T03:56:17","slug":"gimp-image-map-html-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/gimp-image-map-html-primer-tutorial\/","title":{"rendered":"Gimp Image Map HTML Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/GIMP\/gimp_im.pdf\"><img decoding=\"async\" style=\"float:left; border: 15px solid pink;\" alt=\"Gimp Image Map HTML Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/GIMP\/gimp_im.jpg\" title=\"Gimp Image Map HTML Primer Tutorial\"  \/><\/a><p class=\"wp-caption-text\">Gimp Image Map HTML Primer Tutorial<\/p><\/div>\n<p>As we intimated yesterday with <a title='Gimp Guides to HTML Primer Tutorial' href='#gghtmlpt'>Gimp Guides to HTML Primer Tutorial<\/a> regarding the <a target=_blank title='GIMP' href='http:\/\/gimp.org'>GIMP<\/a> image editor&#8217;s &#8220;Filter -&gt; Web&#8221; menu &#8230;<\/p>\n<blockquote><p>\n&#8230; you would also see an &#8220;Image Map&#8221; option helping out in a similar fashion to the stupendous <a target=_blank title='mobilefish' href='http:\/\/www.mobilefish.com\/services\/image_map\/image_map.php'>mobilefish<\/a> functionality.\n<\/p><\/blockquote>\n<p> &#8230; and so we are here today to show you how that functionality works via a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/GIMP\/gimp_im.pdf\" title=\"Click picture\">PDF slideshow<\/a> for your perusal.  There are options to shape what goes into the resultant HTML&#8217;s map element&#8217;s area (as rectangle or ellipse or polygon) tag href property link types as per &#8230;<\/p>\n<ul>\n<li>Web Site<\/li>\n<li>Ftp Site<\/li>\n<li><a target=_blank title='Gopher information from Wikipedia, thanks' href='https:\/\/en.wikipedia.org\/wiki\/Gopher_(protocol)'>Gopher<\/a><\/li>\n<li>File<\/li>\n<li><a target=_blank title='Wide Area Information Server information from Wikipedia, thanks' href='https:\/\/en.wikipedia.org\/wiki\/Wide_area_information_server'>WAIS<\/li>\n<li><a target=_blank title='Telnet information from Wikipedia, thanks' href='https:\/\/en.wikipedia.org\/wiki\/Telnet'>Telnet<\/a><\/li>\n<li>Email<\/li>\n<li>Other<\/li>\n<\/ul>\n<p> &#8230; as a very extensive ideas list on top of options to define event logic for &#8230;<\/p>\n<ul>\n<li>onmouseover<\/li>\n<li>onmouseout<\/li>\n<li>onfocus<\/li>\n<li>onblur<\/li>\n<\/ul>\n<p> &#8230; and that there is the option to define exact co-ordinates, and to define the alt attribute and HTML iframe name as applicable, also.<\/p>\n<p>We&#8217;ll leave you with the resultant HTML we had GIMP create for us as a result of the goings on in that PDF slideshow (noting that the only adjustment to HTML in out TextWrangler editing session was to point at the image <em>img element src attribute location<\/em> properly), and we hope this is of benefit for you &#8230;<\/p>\n<p><code><br \/>\n&lt;img src=\"<em>mondrian-1504681_640.jpg<\/em>\" width=\"640\" height=\"480\" border=\"0\" usemap=\"#map\" \/&gt;<br \/>\n&nbsp;<br \/>\n&lt;map name=\"map\"&gt;<br \/>\n&lt;!-- #$-:Image map file created by GIMP Image Map plug-in --&gt;<br \/>\n&lt;!-- #$-:GIMP Image Map plug-in by Maurits Rijk --&gt;<br \/>\n&lt;!-- #$-:Please do not edit lines starting with \"#$\" --&gt;<br \/>\n&lt;!-- #$VERSION:2.3 --&gt;<br \/>\n&lt;!-- #$AUTHOR:User --&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"0,1,36,132\" href=\"mailto:?body=w_1_1&amp;subject=Mondrian%20Composition%20with%20Read%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"51,0,118,128\" href=\"mailto:?body=y_2_1&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"136,1,295,133\" href=\"mailto:?body=b_3_1&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"310,1,500,132\" href=\"mailto:?body=r_4_1&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"514,0,566,131\" href=\"mailto:?body=y_5_1&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"583,1,596,130\" href=\"mailto:?body=w_6_1&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"0,146,36,293\" href=\"mailto:?body=w_1_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"50,145,119,294\" href=\"mailto:?body=w_2_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"134,146,295,292\" href=\"mailto:?body=w_3_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"310,146,375,294\" href=\"mailto:?body=w_4_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"391,147,498,294\" href=\"mailto:?body=w_5_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"514,144,567,294\" href=\"mailto:?body=r_6_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"582,146,597,385\" href=\"mailto:?body=w_7_2&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"0,309,36,479\" href=\"mailto:?body=w_1_3&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"51,308,119,386\" href=\"mailto:?body=w_2_3&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"133,307,374,385\" href=\"mailto:?body=r_3_3&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"390,307,499,385\" href=\"mailto:?body=w_4_3&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"514,309,569,384\" href=\"mailto:?body=y_5_3&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"51,399,118,481\" href=\"mailto:?body=b_2_4&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"132,400,375,479\" href=\"mailto:?body=y_3_4&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"390,400,568,481\" href=\"mailto:?body=w_4_4&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;area shape=\"rect\" coords=\"582,399,597,479\" href=\"mailto:?body=w_5_4&amp;subject=Mondrian%20Composition%20with%20Red%20Yellow%20and%20Blue\" \/&gt;<br \/>\n&lt;\/map&gt;<br \/>\n<\/code><\/p>\n<hr>\n<p id='gghtmlpt'>Previous relevant <a target=_blank title='Gimp Guides to HTML Primer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/gimp-guides-to-html-primer-tutorial\/'>Gimp Guides to HTML Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.youtube.com\/watch?v=uOILGAtY2W4\"><img decoding=\"async\" style=\"float:left; border: 15px solid pink;\" alt=\"Gimp Guides to HTML Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/gimp_guides.jpg\" title=\"Gimp Guides to HTML Primer Tutorial\"  \/><\/a><p class=\"wp-caption-text\">Gimp Guides to HTML Primer Tutorial<\/p><\/div>\n<p>The great <a target=_blank title='GIMP' href='http:\/\/gimp.org'>GIMP<\/a> image editor has several ways to create <a target=_blank title='GIMP Guides information' href='https:\/\/docs.gimp.org\/2.6\/en\/gimp-concepts-image-guides.html'>Guides<\/a>, which are the precursor to being able to break an image into component parts via &#8220;Image -&gt; Transform -&gt; Guillotine&#8221; or the more enticing, for those web developers out there, &#8220;Filter -&gt; Web -&gt; Slice&#8221; which effectively does what Guillotine does and writes out some HTML in the form of an HTML table element that includes some &#8220;a&#8221; link opportunities to do something special for individual images of the new &#8220;image jigsaw&#8221; surrounded by Guides.  Within the options of that last menu you would also see an &#8220;Image Map&#8221; option helping out in a similar fashion to the stupendous <a target=_blank title='mobilefish' href='http:\/\/www.mobilefish.com\/services\/image_map\/image_map.php'>mobilefish<\/a> functionality.<\/p>\n<p>With this in mind, we almost immediately thought of the great <a target=_blank title='Piet Mondrian' href='https:\/\/en.wikipedia.org\/wiki\/Piet_Mondrian'>Piet Mondrian<\/a> and his rectangle paintings in primary colours, wondering if by now you could get image downloads of his work, given he died some time ago now.  And yes, there at this Pixabay <a target=_blank title='Pixabay Mondrian image link, thanks' href='https:\/\/pixabay.com\/en\/mondrian-red-blue-yellow-1504681\/'>webpage<\/a>, thanks, we were able to do that and download an image version of &#8220;Composition with Red Yellow and Blue&#8221; to open with GIMP.<\/p>\n<p>Which ways, then, in GIMP, can you create Guides?<\/p>\n<ul>\n<li>precise Horizontal or Vertical position specification in pixels (via Image -&gt; Guides -&gt; New Guide&#8230;) or percentage (via Image -&gt; Guides -&gt; New Guide (by Percent)&#8230;) values<\/li>\n<li>position via a Selection (via Image -&gt; Guides -&gt; New Guides from Selection) &#8230; and today&#8217;s method of choice &#8230;<\/li>\n<li>user long hover then drag of the rulers at the top and left for dynamic Horizontal and Vertical Guides respectively<\/li>\n<\/ul>\n<p>Best for this is that you can see us doing this with YouTube video we made for the purpose on our MacBook Pro using <a target=_blank title='QuickTime information from Apple' href='https:\/\/support.apple.com\/downloads\/quicktime'>QuickTime Player<\/a> &#8220;File -&gt; New Screen Recording&#8221; resultant presentation you can play below.<\/p>\n<p><iframe loading=\"lazy\" width=\"420\" height=\"315\" src=\"https:\/\/www.youtube.com\/embed\/uOILGAtY2W4\" frameborder=\"0\" allowfullscreen><\/iframe><\/p>\n<p> &#8230; and the resultant HTML code snippet, including <em>our bits<\/em>, produced looked like &#8230;<\/p>\n<p><code><br \/>\n&lt;!--HTML SNIPPET GENERATED BY GIMP<br \/>\n&nbsp;<br \/>\nWARNING!! This is NOT a fully valid HTML document, it is rather a piece of<br \/>\nHTML generated by GIMP's py-slice plugin that should be embedded in an HTML<br \/>\nor XHTML document to be valid.<br \/>\n&nbsp;<br \/>\nReplace the href targets in the anchor (&lt;a &gt;) for your URLS to have it working<br \/>\nas a menu.<br \/>\n<em>&nbsp;<br \/>\n&nbsp;<br \/>\n     Thanks for viewing.<\/em><br \/>\n --&gt;<br \/>\n&lt;table cellpadding=\"0\" border=\"0\" cellspacing=\"0\"&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_0.jpg\" style=\"width: 51px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_1.jpg\" style=\"width: 70px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_2.jpg\" style=\"width: 11px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_3.jpg\" style=\"width: 164px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_4.jpg\" style=\"width: 95px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_5.jpg\" style=\"width: 110px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_0_6.jpg\" style=\"width: 139px;  height: 4px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_1_0.jpg\" style=\"width: 51px;  height: 128px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_1_1.jpg\"  style=\"width: 70px; height: 128px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_1_2.jpg\"  style=\"width: 11px; height: 128px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a<em> title='blue' onclick=\"alert('Am I blue?');\"<\/em> href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_1_3.jpg\"  style=\"width: 164px; height: 128px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_1_4.jpg\"  style=\"width: 95px; height: 128px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_1_5.jpg\"  style=\"width: 110px; height: 128px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_1_6.jpg\" style=\"width: 139px;  height: 128px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_2_0.jpg\" style=\"width: 51px;  height: 14px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_2_1.jpg\"  style=\"width: 70px; height: 14px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_2_2.jpg\"  style=\"width: 11px; height: 14px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_2_3.jpg\"  style=\"width: 164px; height: 14px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_2_4.jpg\"  style=\"width: 95px; height: 14px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_2_5.jpg\"  style=\"width: 110px; height: 14px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_2_6.jpg\" style=\"width: 139px;  height: 14px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_3_0.jpg\" style=\"width: 51px;  height: 147px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_3_1.jpg\"  style=\"width: 70px; height: 147px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_3_2.jpg\"  style=\"width: 11px; height: 147px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_3_3.jpg\"  style=\"width: 164px; height: 147px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_3_4.jpg\"  style=\"width: 95px; height: 147px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a<em> title='Blue' onclick=\"alert('Am i Blue?');\"<\/em> href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_3_5.jpg\"  style=\"width: 110px; height: 147px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_3_6.jpg\" style=\"width: 139px;  height: 147px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_4_0.jpg\" style=\"width: 51px;  height: 107px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_4_1.jpg\"  style=\"width: 70px; height: 107px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_4_2.jpg\"  style=\"width: 11px; height: 107px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_4_3.jpg\"  style=\"width: 164px; height: 107px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_4_4.jpg\"  style=\"width: 95px; height: 107px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_4_5.jpg\"  style=\"width: 110px; height: 107px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_4_6.jpg\" style=\"width: 139px;  height: 107px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_5_0.jpg\" style=\"width: 51px;  height: 78px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a<em> title='BLUE' onclick=\"alert('Am i BLUE?');\"<\/em> href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_5_1.jpg\"  style=\"width: 70px; height: 78px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_5_2.jpg\"  style=\"width: 11px; height: 78px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_5_3.jpg\"  style=\"width: 164px; height: 78px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_5_4.jpg\"  style=\"width: 95px; height: 78px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;a href=\"#\"&gt;&lt;img alt=\" \" src=\"blue_5_5.jpg\"  style=\"width: 110px; height: 78px; border-width: 0px;\"&gt;&lt;\/a&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_5_6.jpg\" style=\"width: 139px;  height: 78px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n  &lt;tr&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_0.jpg\" style=\"width: 51px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_1.jpg\" style=\"width: 70px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_2.jpg\" style=\"width: 11px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_3.jpg\" style=\"width: 164px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_4.jpg\" style=\"width: 95px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_5.jpg\" style=\"width: 110px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n    &lt;td&gt;&lt;img alt=\" \" src=\"blue_6_6.jpg\" style=\"width: 139px;  height: 2px; border-width: 0px;\"&gt;&lt;\/td&gt;<br \/>\n&lt;\/tr&gt;<br \/>\n&lt;\/table&gt;<br \/>\n<\/code><\/p>\n<p>We hope you find these GIMP &#8220;Slice and Dice&#8221; webpage creation ideas of interest.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d40368' onclick='var dv=document.getElementById(\"d40368\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/gimp\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d40368' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d40385' onclick='var dv=document.getElementById(\"d40385\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/map\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d40385' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>As we intimated yesterday with Gimp Guides to HTML Primer Tutorial regarding the GIMP image editor&#8217;s &#8220;Filter -&gt; Web&#8221; menu &#8230; &#8230; you would also see an &#8220;Image Map&#8221; option helping out in a similar fashion to the stupendous mobilefish &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/gimp-image-map-html-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,16,25,37],"tags":[99,2665,380,469,491,2667,2666,576,590,592,599,739,745,860,2077,962,2132,2668,1319,1345,2669],"class_list":["post-40385","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-gimp","category-networking","category-tutorials","tag-area","tag-ellipse","tag-email","tag-ftp","tag-gimp","tag-gopher","tag-href","tag-html","tag-image","tag-image-map","tag-img","tag-mailto","tag-map","tag-onblur","tag-onfocus","tag-polygon","tag-rectangle","tag-telnet","tag-tutorial","tag-url","tag-wide-area-information-server"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/40385"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=40385"}],"version-history":[{"count":7,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/40385\/revisions"}],"predecessor-version":[{"id":40398,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/40385\/revisions\/40398"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=40385"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=40385"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=40385"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}