How To Locate Technical Pieces of Your Website Without Web Development Knowledge

At SilverServers in Kamloops we design and develop websites, so we know website lingo, but we also realize that not everyone else does. We're here to help. In many instances, including communications between you and your web designer, it's helpful for you as a website owner to know the terminology used for different pieces of your website, and to know where and how to find those pieces. Today, we're going to talk about how to find title, description, header, and alt tags on your website's HTML. In order to find these elements, known as tags, you not only have to know where to look on the website, you also have to know how/where to find things in code.

How to View and Search Within Source Code

• On a Windows computer, right click on your webpage, then click View Source. Or, hit Ctrl+U for a shortcut.

• On a Mac, hit Cmd+U or Option+Cmd+U

• In Safari, to use the menu, you may need to enable the Developer tab. When it's displayed, click the Develop tab, then click Show Page Source.

• Once you're in the View Source page, hit Ctrl+F or Cmd+F on a Mac, then simply type in the tag you are looking for.

How to View the Title Tag

When your web developer talks about title tags, or webpage title, or meta title, they're talking about behind-the-scenes code. The title tag tells search engines what the intended overall topic of your page is. There are two places a title shows up — In Google Search results, and on your browser tab (the tab at the top of your page explaining what site you're on). You can have multiple tabs open at the same time and they all have titles on them. The title doesn't show up on the webpage itself, but you can find it when you View Source by looking for everything contained between <title> and </title> – alternatively you can search using the Ctrl/Cmd+F shortcut.

How to View Description Tags

Description tags, or meta descriptions, help to expand on the small amount of text in the title tag, telling search engines more nuanced details about what the page is about. Google sometimes uses them as the text description of a webpage in their search results – the information that you see below the title when you search for something in Google. You cannot see your site's meta description on your site. You can only see it in your Source Code by searching for the tag that looks like this: <meta name="desctiption", or by looking at your Google search results.

How to View Header Tags

Webpage headers are similar to newspaper headlines – they provide a brief glimpse of the information contained below. The top header is known as <h1> followed by <h2> and <h3> and so on. There are six levels of header tags. They help search engines decide if your site is relevant to certain keywords. That's why it's important that the headings on your site closely reflect the language (keywords) you want to highlight. You can see these in codes by looking through View Page Source (right click) and searching for the <h1>, <h2>, and so on. Keep in mind that every opening header tag will be followed by a closing header tag at the end of the header's text. For example, <h1>How to find HTML Tags</h1>. Take some time to try it out and familiarize yourself with code searching.

As you might imagine, header tags need to be organized properly in order for Google to get the most value out of them. Some designers use them as 6 placeholders for font and format preferences - but this is the wrong use. Like mentioned before, these tags are to help organize the topics of an article, not provide design shortcuts. An <h1> should be the title of the content. An <h2> should contain sub-topics of its associated <h1>, an <h3> should contain sub-topics of its associated <h2>, and so on.

What are Alt Tags and How to Find Them

Alt tags, or alternate text tags, are attached to photos and they describe the specific image for search engines and other accessibility software. These are embedded into photo tags, or <img /> tags. They might look like this:

<img src="https://www.silverservers.com/images/logo.png" alt="Alternative text that describes the image" />

The best way to familiarize yourself with these tags is to spend time searching for them within View Page Source. Knowing how to find these types of webpage tags may save you lots of time emailing back and forth with your web developer when they have questions. When in doubt, right click and View Page Source. Also, knowing that they're important and providing information for them may help speed up the development process for a webpage. For more information, or for help designing and developing your new website, contact us today for a consultation!

For more related content, check out the Technical Support section of our blog!