SEO Basics

Wiki.TerraBase.info
Revision as of 19:12, 6 March 2021 by Root (talk | contribs) (→‎Terms)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

SEO (Search Engine Optimization)

This article has information that can be applied broadly, but the focus is on how SEO is used by WordPress and MediaWiki.

There are so many websites that have so much information about so many granular details. Sometimes they even mention the basics, like quality content and a well organized website. That's 98% of it right there. The next 3%, as is similar to many things, is the most difficult. About 2% of that is presenting it to a search engine in the manner they recommend. That can be done through sitemaps. But if the website is well organized and not very large, a sitemap may not be necessary.

<Title></Title>

Start with the simple stuff like the Title Tag. Wordpress automatically inserts the Title Tag into the HTML (regardless of whether there's a plugin to stop the display of the Title Page to users) and it appends the domain name to the Title Tag (good for SEO, but bad for how it looks on a user's tab, not sure if multiple TITLE Elements would help with the first for User display and the latter for SEO robots / spiders)


The classic META Tags have 5 attributes: charset, content, http-equiv, name, scheme, with the name attribute the most relevant to SEO. The Name Attribute has several values: application-name, author, desription, generator, keywords, viewport.

META Tags have been expanded with RDFa to include the following items;

  • about – a URI or CURIE specifying the resource the metadata is about
  • rel and rev – specifying a relationship and reverse-relationship with another resource, respectively
  • src, href and resource – specifying the partner resource
  • property – specifying a property for the content of an element or the partner resource
  • content – optional attribute that overrides the content of the element when using the property attribute
  • datatype – optional attribute that specifies the datatype of text specified for use with the property attribute
  • typeof



, but also how it appears to users in search results. How does a search engine know how to format and display what it finds in a short summary that someone can read?


It seems like everything for Yoast settings on a page or post is devoted to how a search engine formats and displays information to a viewer. It puts it in an application/ld+json script, which adheres to RDFa standards and tells or suggests to a search engine how to display something.

Yoast does not allow for a META Description for every page, only for the entire website. This provides a strong hint as to how search engines now use the description tag as opposed to years past.

Keyword(s) doesn't even appear as a META tag anymore. It is only used in the RDFa script for formatting purposes.

For a website administrator, they care about rankings. For a search engine, they care about how information will be displayed for a viewer.

Wordpress Plugins for Images

Phoenix Media Rename (useful) is a simple Plugin that allows for this and it even automatically replaces spaces with dashes ( - ). It also allows for "bulk renaming", but only for manual modifications to the name (IE, it can't add "My Web Site" to the beginning of every file name).

Media Library Assistant (Not very useful): adds some (obscure) fields to what can be associated with a Media File, Parent Info, Menu Order, Attachment Metabase (read only), and an alternate list view, Allows for additional Categories to be created

Enhanced Media Library (useful): Some Utilities for importing and exporting, Add several tabs to Settings, Media (including allowed file types)

WP Media Folder (very useful, but...): Creates a folder and file structure for media, so very handy for a lot of media. Unfortunately it breaks some other Media Plugins, but the fix is easy, just disable it for others to work

Add from Server: A plugin that allows upload of files that otherwise cause the Wordpress Media functionality to cough up a hairball (large files, etc.)

Admin Columns showed promise for making columns wider, but didn't work and messed other stuff up.

Images

The URL of the image is of course available, but cannot be changed within WordPress.

Wordpress generates multiple versions of an image in the name of "responsive" (IE for multiple smaller screens), supposedly three by default. Themes can also create additional image sizes, along with other plugins. These images are offered to browsers in with the srcset value in an Image Tag. The Phoenix Media renaming tool renames all of the various image files (https://make.wordpress.org/core/2015/11/10/responsive-images-in-wordpress-4-4/).

The Title Tag does NOT show up anywhere in a Page or Post, nor do they appear in raw HTML. The Title Field Tag is used in a Sitemap File and is marked as CDATA to ensure that if any special characters are used they are interpreted literally and not as markup.

They are only used for identification purposes within Wordpress.

The Caption Field is only used as a "pre fill" when adding an image into a post or page. It can be modified, added to, or deleted. It holds no spot in any META tags or anything other than text following an image tag (IE, it is outside the boundaries of the <IMG> Tag)

The Description Tag does NOT show up anywhere in a Page or Post, nor do they appear in raw HTML.

Open Graph / OG, shows up in HTML as <meta property="og:image" content="https://NameOfFile&amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;nowiki/&amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;.jpg"/> According to current information, Facebook uses it. Google

Default ALT Description to compensate for blank alt tags

longdesc URL Specifies a URL to a detailed description of an image

Possible Plugins

Auto Image Attribute with Bulk Updater, Bialty; Neither of these first two use the image title in the ALT text unless you buy a pro version. They're also very complex and lead into other plugins too.

The Title Attribute in an IMG Element is not an officially supported attribute. Firefox will display a popup that shows the title of an image. Wordpress does not add Title Attribute or include it anywhere in the HTML.

<figure> and <figcaption> are additional HTML elements to describe images. And its new to HTML 5, so not in danger of deprecation.

SEO Image Pro can substitute Title and Alt information

Media Library Assistant can Bulk update ALT fields for images (note WP Media folder has to be deactivated for it to work)

Image CleanUp

No plugins worked better than an old fashion file search using a regular expression in Directory Opus to find all of the automatically generated images (thumbnails): .*x[0-9][0-9][0-9] (then moved them to another folder instead of deleting them)

A Useful CLI option: WP-CLI (need to download and install it, Google it)

Adding the below code to a theme's functions.php file will take existing information and create Figure and FigCaption elements

function example_figure_caption($html, $id, $caption, $title, $align, $url) {
  $html5 = "<figure id='post-$id media-$id' class='align-$align'>";
  $html5 .= "<img src='$url' alt='$title' />";
  if ($caption) {
    $html5 .= "<figcaption>$caption</figcaption>";
  }
  $html5 .= "</figure>";
  return $html5;
}
add_filter( 'image_send_to_editor', 'example_figure_caption', 10, 9 );


Living example: Anthropology (and as it accidentally and conveniently turned out Anthropologie)

<TITLE> as an HTML element is different than an Image Title. The <Title> Element is automatically created by Wordpress and Mediawiki from the Title of a Post or Article, followed by the Web Site Name. This is what Google typically displays as the heading for a search result.

<META> name="description" content="This is what Google displays" If it isn't present, then the first paragraph of content is generally displayed (Wikipedia's entry on Anthropology and Anthropologie.com clearly demonstrate this)


Wordpress Plugins for SEO to granularly control things

Title Element Override

Meta Description Override


Schema.org

developed by several search engines to enhance how information is "represented" / displayed to users using tags such as the following;

<meta itemprop=

MOZ seems to be a good source of information on searching.


Mobile Enhancements

And for mobiles (AKA "responsive" themes), here are a couple of interesting plugins: Mobile Pack (older), Theme Switcha, WPTouch (but doesn't always do the site graphic properly), Equivalent Mobile Redirect & WP Mobile Redirect (if you want a separate site for mobile), Jetpack

Message for mobile users: It is not possible to appreciate the grandeur of XYZ when viewing images on a small screen. This mobile site has been created for people interested in information.

Multi Site

You need to add the following code to your wp-config.php file just before the /* That’s all, stop editing! Happy blogging. */ line.

1

2

/* Multisite */

define( 'WP_ALLOW_MULTISITE', true );

from https://www.wpbeginner.com/wp-tutorials/how-to-install-and-setup-wordpress-multisite-network/

Search Engine Perspective

Keywords: What people search for. How are they focused on? Well, Yoast has a plethora of opinions on that one.

Title

Headings

Itallic

Bold

Simple Tweaks

HTML Elements / Tags

There are HTML Elements / Tags that Search Engines take note of

Heading (hn) Element / Tag

As noted in the Wikipedia article (https://en.wikipedia.org/wiki/HTML_element#Basic_text), the Heading Element is not just useful for styling text. And it actually shouldn't be used for that. The hn (h1, h2, h3, etc.) should be used to indicate important text (IE Keywords). A great example of this is Wikipedia (and this page too). Notice how Wikipedia (actually Mediawiki) has Heading, Sub-Heading 1, Sub-Heading 2, etc. It isn't just for styling, but also organization.

Bold ( <b></b>) and Emphasis ( <em></em> ) Elements / Tags

According to this page (https://www.oncrawl.com/oncrawl-seo-thoughts/5-basic-ways-use-css-seo/) and others, this is another item Search Engines make note of when looking for Keywords.

Here's a cool trick... If one wants to utilize the Bold and Emphasis features of HTML to garner the attention of Search Engines, but doesn't want to affect the look of text, try the simple example below. It essentially strips away the stylizing of the Bold and Emphasis Elements, but allows them to remain in the HTML code.

<html>
<body>

<em>Italic</em>
<br /><br />
<b>Bold</b>

<style>
em {
font-style:normal;
}

b {
font-weight:normal;
}
</style>

</body>
</html>

The result of the above HTML code in a browser is;

Italic

Bold

Terms

Backlinks

What is the difference between a link and a backlink? Perspective.

This is a very selfish term I don't like, as it looks at LINKS (what they really are) from the receiving web site's perspective and renames them "backlinks". They're really links and they're for users to easily find stuff.

Retrieved from "https://wiki.terrabase.info/index.php?title=SEO_Basics&oldid=1357"