Web Site
Developers

Simple Internal Bookmarks Between Article and Image Pages

The Long Silence

I have to admit I let this topic drop after writing my best take on how to go from footnote citations in the text using the [article URL#To-[footnote digit] and back to the approximately the same location using the similar linking syntax: [article URL#back-[footnote digit]. However, I could not do nearly as well when trying to connect external pages with similar easy to use syntax. I must admit my attempt to connect the Home page menu list to specific menu pages with links to articles was weak [1.]. Therefore, I saw further efforts futile.

Discovery of a Better Way to Link External Pages

While writing my last article on Web Page Appearances and CSS, I noticed I had already been using a new method to link the main article to external pages. Those linked pages contained enlargements of graphics shown within the article. It dawned on me this was a new method when I simply copied the technique used in my previous article [Web Page Appearances and Javascript]. It was then obvious I had created a new, easy to remember internal bookmarking between pages. However, to have reached this point it was necessary to have made some changes in my standard methods of writing articles. For example, fairly recently, I changed the way I created captions for inserted text/code and graphics. While I have not been consistent using captions for inserted code, I have been with graphic immages. With the latter, I wrote the caption label as "Figure" followed by its number.

A Real Example of an Externally Linked Page

I think that keeping the example graphic and code connected on this page would be easier to follow than going to the same graphic in my previous article. Using the latter, the reader would need to find their was back here. The graphic is a duplicate of the second screen shot in Web Page Appearances and CSS using a duplicate enlargement page. First look at the source for this page to see the landing point inserted at the beginning of this paragrahp:

  <p><a name="fig-2" id="fig-2"></a> \
     I think that keeping ...

Now the graphic:

  

  Figure 2. Menu Footer Screen Shot (Enlarge) 
                   Mismatched Heights

I changed the link to connect to the duplicate page showing the same graphic and I revised the internal bookmark. However, to make certain the readers understood that internal link has a new text as an explanation as to which page they are returning:

  <h4><a href="[site]/[path]/[page name].html#fig-2"> [2.] \
     Return to: \
     Simple Internal Bookmarks Between Articles and Image Pages;/a> </h4>

To my mind and eye [3.], just looking at the caption under the graphic instructs me how to create the landing point name. Moreover, the way I do graphic enlargements is essentially copying and renaming an existing page, then going through each item and pasting in the new, appropriate text and URLs. Indeed the enlarged page name is extracted from the graphic file name with an addition that indicates it is the enlargement of a related graphic. Furthermore, I attempt to keep the naming consistent, however, that has been my goal not my claimed result. These characteristics allow me to link one class of external content precisely to selected text within the main article. The method seems both logical and simple.

Summary

The serendipitous stumbling across a technique to generate internal bookmarks linked to an external graphic page, was a pleasant surprise. For me there was no necessity of running through a stepwise instruction set. Of course, this model is easier, because the outward link is an simple URL [4.] link to the page. The only necessity is to return to a specific region of text, i.e. just above figure exhibited in the main article. Again to me, the structure is both simple and obvious.

The effort in the actual coding is minimal, I needed only the landing point within the text that is simple to write. In addition, the bookmark from the enlargement page will usually be a simple paste with an attached pound (#) symbol followed by "fig-" and its number. It is difficult for me to imagine a simpler syntax that nearly assures uniqueness and inherent simplicity of syntax. This method alone covers most of my needs to link and return from external pages.

Corrections, suggested extension or comments write: H. Cohen.

Return B/ST Home or Tags Page

____________________________________________________________________

    1.  And no longer used on this site.  Return

    2.  Where for this site and this article, the values are:
        [site] = http://bst-softwaredevs.com/
        [path] = howto/articles/
        [page name] = site-menu-footer-mis-match-large-dup
        hiding the differing heights of the column panels.
        Return

    3.  Minds differ, what is intutive to some is opaque to others.
        Return

    4.  Similar to what I had in mind to connect the site's Home
        page to the menu pages.  Return
____________________________________________________________________

Web Site Developers