2 Links

Each article and subsite can have its own related articles or external pages. Navigation pages can have cards, catalogs or galleries as well. All such links are specified in the same way.

Internal links are always to an article or category, but for brevity, will be designated by just articles from now on. For a card, the target's heading, introduction and basic aside image are used for the body of the card. For a gallery, the targets' basic aside images are used.

Layout

△

There are several areas.

The bar provides context and links to links.

⤢where:

#	Name	Description
a	Host type	Name of the host type
b	ID	ID of the host element
c	Link type	The purpose that the link serves for the host element. See Link type
d	Link usage	Used\|allowed numbers of links
e	Links	Links to the link rows in the Link table

Link table

△

The link table is where all links are maintained.

The columns for links are:

#	Name	Description
a	Category\| Article	Shows the current link as a jump to the article's or category's page, as a link for external links. Depending upon the type of links, a site item can be selected or external link text and URL can be provided
b	▲	Move the link up. If already at the top, it moves to the end of the list
c	▼	Move the link down. If already at the bottom, it moves to the top of the list
d	✘	Delete the link by clicking on the `✘`, then clicking the now visible `✔`

If there are more than three links, the table is preceded by a Move by: line with the 1 option selected. If there are more than 10, a 10 option will also be available. Selecting an option other than 1 will make the next move be by the selected number of items, before reverting back to 1.

Link type

△

Link type are about what they are used for.

The maximums applying to each type of link, and their scope – internal or external – are:

#	Type	Max	Scope	Comments
a	Subsite navigation	5	Both	Quick links for significant pages or sites shown in the subsite navigation bar. Per subsite
b	Cards	8	Internal	Show a heading, image and the introduction of an article or category. Only shown at the end of navigation articles
c	Catalog	20	Internal	Only shown at the end of navigation articles
d	Gallery	20	Internal	Only shown at the end of navigation articles
e	Related articles	5	Internal	Shown at the end of the main body of pages, though only those for subsites on category pages
f	Related sites	5	External	Shown at the end of the main body of pages, though only those for subsites on category pages
g	Subsite links	3	Both	Links for utility pages or sites shown in the Subsite links subsection in the Links section at the bottom of pages. Per subsite
h	Rights	1	External	If a category is using rights other than `All reserved`, such as for Creative Commons or Public Domain, a URL is required to point to the external webpage that explains what rights others now have to the content of articles in the category
i	Parent	1	External	Optional link to the site considered to be the parent of the current site. Shown in a Group aside on the main subsite's home page as the top link
j	Peers	1	External	Optional link to the site considered to be the parent of the current site. Shown in a Group aside on the main subsite's home page as the centre set of links
k	Children	19	External	Optional set of links considered child sites of the current site. Shown in the Group aside on the main subsite's home page as the bottom set of links

For any page, a maximum of five applies for each of Related articles and Related sites, with those for an article appearing at the top and given preference. For example, if an article has four links, and its subsite has three, the first four links will be for the article's links, with only the first subsite link displayed. If an article or category specified in an article's related link is also in one of its subsite's links, the latter is not shown.

Philosophy

△

Links in Smallsite Design have some useful enhancements for discovery and presentation.

This link philosophy apples to all links created in Smallsite Design, including inline links, and not just those maintained using this page.

Internal

△

The target article or category for an internal link is by selection.

Smallsite Design keeps a store of all the possible targets within it for display when selecting a link, including for a version being edited. Included is the texts for all locales for their headings, navigation texts and introductions, so that whenever a link is displayed, it has the appropriate text on hand, rather than loading up its whole article.

Because it is the invariant creation date of entities that is stored in links, internal links to them will not be broken if the entitles are renamed. However, from another site, their IDs and this their URLs will likely change with renames. To cater for these, redirects are automatically created upon renaming, but only for a month, though that can be extended for up to a year.

External

△

External links can have some useful embedded formats.

External links must always use the secure https protocol.

For links to other Smallsite Design sites, /-/ at the end of the URL's path will be replaced with the locale, and the current accessibility setting will also be included in the query, allowing visitor experience continuity between the sites. Must be before any query or fragment. This also works for inline links. For links to be used for grouping sites, they must use this format.

For the external links defined in this page, each requires a single URL and at least master locale text, which is the end default if text for other locales used is not defined. While sites accepting locale information in URLs are supposed to be flexible in the locale formats they accept, for those that are picky there is a format using {} that is substituted with all or designated parts of the current locale.

The rules governing the format's use are:

a.All characters are ASCII.
b.Just {} will be substituted with the full locale.
c.l = language in lower case, like en for English.
d.L = language in uper case, like EN for English.
e.s = script in lower case, like hant for Traditional Chinese.
f.S = script in capital case, like Hant for Traditional Chinese.
g.r = region in lower case, like au for Australia.
h.R = region in upper case, like ZA for South Africa.
i.v = variant in lower case, like polyton to use Polytonic Greek instead of modern.
j.V = variant in upper case, like VALENCIA for the Valencia subregion of Spain.
k.Three digit numeric regions, like 001 for World, will be as is.
l.-, _ = separators rendered as is.
m.If a locale does not use some parts, they and their preceding separator will not be used.

The default Smallsite Design format would be expressed as {l-s-r-v}, while the officially recommended format for documentation is {l_S_R_V}. Many sites do not use all parts, and some change the order, but all use a separator between each. Separators are never used at the start or end.

The principle locations that the pattern would be used in URLs are:

a.Subdomains, like https://{l}.example.com/
b.Paths, like …/example.com/{l-s}/…
c.Queries, like …/?lang={R_l}.

Well designed sites will fall-through to a default locale if it does not support the one in the URL. But if any return an error or another page entirely, use a link that works for the master locale and let the visitor swap locales at the external site.

Order

△

The ordering of links provides a hint as to the relative importance of the link targets.

For related articles and sites, the ordering is usually for the most directly relevant first. Subsequent links could go to particular or general information, or introduce complementary topics, rather than to more of the directly related topics. Anybody who clicks on the first link is more likely to click on its first related article link after they have read it than return to the original page to go to its second link.

Preferably link to articles instead of categories as they present a definite option rather than having to make a choice among a wider range of options. Try for at least three or four related articles for an article, but only one or two for a subsite. Be very particular about what external pages you link to, as they may be used by your readers to make judgements about you, in the same way you might be judged by who you associate with. They should provide directly relevant information that preferably validates some of the page's content by relevant facts or context.

Subsite navigation links will typically be for an online store or other high-value pages that site visitors will want to go to directly. Subsite links are for lower-value ancillary information pages. Cards are prominent signposts to key site content, setting the first to be bordered if there is a main topic or product to highlight. A catalog looks like a categories page listing except that it can include any articles or categories from the site. Galleries are for whim-picking from interesting pictures and can point to any article or category. The other link types are for special uses.

External links

△

The page targeted by an external link may not be all relevant to an article, but there may be ways of targeting the relevant part of it.

The techniques described can be used anywhere external links are allowed. Ensure the complete URL does not exceed what is allowed in the field.

By id attribute

△

In well-built pages, headings may have an id attribute that can be the target of a link.

Just like in Smallsite Design, a page in a properly designed website should provide each key element with an id attribute that allows targeting it by appending it to the page's URL preceded by a # as its fragment in the external link. If the page has a link to the relevant section, right click on it, select the Copy link option, then paste that in as the full link URL.

If no menu link, to find the id to use as a URL fragment:

1.Press the F12 key when viewing the page in a browser.
The developer tools window will open.
2.Click the upper-left icon in the menu bar (rectangle with an arrow over it).
The icon will turn blue.
3.Back at the page in the browser, click on the heading for the relevant section.
The focus in the developer tools window becomes the HTML for the clicked element.
4.The highlighted element should have an id attribute, but if not, find the nearest ancestor element that does, though sometimes it might be the first child.

Try the fragment in the link to see if it actually works. Sometimes ids are only used internally in a page and linking to them does not visibly show. In that case, search for another in the ancestor tree. Sometimes, there just is none, so the link will have to be to the full page.

By page text

△

Some browsers can use specially-formatted text at the end of the URL to target specific text on a page.

Many sites still do not provide granular access to their content via id attributes on headings and other significant page elements. For browsers based upon the Chromium open-source browser project, like Chrome, Edge, Brave and Opera, text can be appended to a URL to highlight particular text on the target page. While not having 100% coverage, this may still provide more targeted links for most following an external link. The added text consists of a rather cryptic prefix, followed by an encoded form of the target text, obtained using an online encoding site.

To target specific text on an external site's page:

1.Append #:~:text= to the URL.
2.Select the text to be highlighted on the target page.
3.Press Ctrl | command+c to copy the text.
4.Open the https://urlcodec.com/ page.
5.Click in the Decoded URL field.
6.Press Ctrl | command+v to paste the copied text into it.
7.Select the text in the Encoded URL field.
8.Press Ctrl | command+c to copy the encoded text.
9.Back at the target URL, click after the previously appended text.
10.Press Ctrl | command+v to paste the encoded text after it.
11.Save the URL.

Test the link to ensure it works with all the required text shown. In general, any formatting is ignored, but there may be hidden characters or elements that may prevent it being found. Perhaps try a smaller selection of target page text at the start of the wanted text. Only the first match will be highlighted, so if it is the wrong text, perhaps include text around the wanted text to ensure uniqueness.