URLs and links
URLs (Uniform Resource Locator)
URLs should be easy to understand, as users may use the URL to determine their place in the website. Search engines also look for readable words in a URL to determine the site's content. When creating a directory or page name, use a word that is descriptive of the content.
For example: https://www.calgary.ca/CSPS/Recreation/Pages/Pools/Home.html tells the visitor that they are visiting a home page about pools. Learn more about searchability on Search optimization.
Short URLs
Not all pages need a short URL. Short URLs are added to "calgary.ca/" and are typically used to help users access the right webpage by remembering a specific word or two. They are typically reserved for marketing campaigns, but can be set up to support your basic structure. E.g. calgary.ca/pools, calgary.ca/business, calgary.ca/assessment, calgary.ca/recreation, calgary.ca/bluecart. Short URLs should:
- Be used on non-digital campaigns/advertising, such as billboards or mailings.
- Be unique and specific to your business unit or project. It can get confusing if there are multiple generic or similar short URLs.
- Be memorable so people will remember to use it after they see it.
- Not include acronyms that don't resonate with the public.
- Be no longer than two or three words.
- URLs should always have hyphens conneting the words within the URL, e.g. /cityofcalgary should be /city-of-calgary.
Subdomains
Subdomains are URLs that are formatted like myprojecthere.calgary.ca. These will be used in special cases where sites are built outside of the calgary.ca infrastructure but we want to convey that it is part of The City's web presence.
Dedicated URLs (www.MYPROJECTHERE.com) outside of calgary.ca are not permitted as calgary.ca has a strong brand attached to it.
Links
Links are a key way for users to navigate around a website. Linking from a page to other important, related information can help a user find what they need, or can make important steps more visible. See also Writing accessibility.
- Avoid using too many links on a page. This can confuse and overwhelm users and make it more difficult for them to get to the right place.
- Only link to content that a visitor to that page is likely to find useful.
- Avoid having more than one link per paragraph, and never more than two. Links inside text can make the text more difficult to read.
- Make sure links aren't right next to each other and have some space between them. Having several links in close proximity will cause usability problems for mobile users, who will find it difficult to accurately tap the correct link.
- Use bulleted lists to incorporate multiple links on a page without cluttering up your content.
- Don't include “anchor links” or “jump links” that link to different sections of the same page. If you have so much content on a page that you feel users will need links to navigate it, it should be split up into multiple pages.
Choose good link text
Link text needs to describe where the user will go if they click on the link.
- Try to be specific, but concise. Search engines (including the Calgary.ca internal search engine) use link text to determine what's on a page. Good link text helps with SEO. See also Search optimization.
- Keep most links to no more than a few words.
- Avoid using link text like, "click here" or "read more". Visual users often skim through a page to look for links, without reading surrounding text. Screenreaders often navigate through a list of links on the page, rather than reading the entire text of the page. If every link says "click here," they have no way to know where each link goes.
- Make sure that link text is not duplicated for different links on the same page, and don't link to the same target more than once on the same page. Even if they are in different sections, this may be confusing to users.
Internal vs. external link actions
- Links to other pages on Calgary.ca open in the same window, including subsites like engage.calgary.ca. This keeps users within our site "bubble" so they use our other products and services. (e.g. "/content/....")
- Links to external websites need to open in a new window, even if they are City of Calgary sites, such as calgaryparking.com. This disassociates external sites from calgary.ca services. Use the full URL: "http://www....com")
- Links to documents (PDFs, etc.) need to open in a new window. They should also display a PDF icon before the link (AEM does this automatically). Use "/content/dam/..."