SEO Technicalities (Programming)

There is a strict rule when it comes to HTML Headers.

H1 is strictly page title and there should only be 1 H1 in the whole page.

TIP: as you can see, to create an effective reading flow, try to stick to H2-H3 levels. That way, readers would not feel the complicated and have a tough read up.

Oh, there are a lot of rules for links.

The point is, tell the crawler about the link relationship. Otherwise, it will just crawl into the link and gives false data.

There is a limit of links in a page before the crawler concludes the page as link spam. Hence, use it with limitations.

Ensures you redirect the page before deleting it. This allows your existing visitors to update the new sites. Use 301 redirect if it is a permanent. Also, avoid redirect chaining ( A --> B --> C =corrects it to=> A --> C)

Some attentions needed for images.

This is the alt attributes of the image. Crawlers don't do image reading so alt attributes are there to help them comprehend the image quickly and easily.

There are a lot of ways. One easy way is to attach the attribute "loading=lazy" into it. The goal is NOT to load images for unread section (visitor possibly does not need it at all). This can save bandwidth.

This is related to text formatting.

Ensure the text, bullets, color contrast (between text and background), paragraph breaks, supported media, text styling are used correctly and sharply presented.

This is related to the meta tags.

Keep title to 50~60 characters (due to the cross display on search ranking, social network sharing, thumbnail, etc). The title must have your main keyword (otherwise, what's your content about, misleading visitors?!).

The meta description should be relevant to the page, usually in a form of summary or abstract.

The page URL has some rules too.

Between https://example.com/desserts/ice-cream vs. https://example.com/asdf/422?=recipe-23432-1123, the former is highly preferred.

Since a car brand has no relation to fruit category, moreover fruit farm, it does more harms than good.

It's 2020, strictly use HTTPS or HTTP/2.

This section covers all Javascript tags.

Do not block the main contents loading. Javascript loading should makes use of the async or defer (preferred) <script> tag.

Website (HTML+CSS or HTML-only) MUST work in the event of a Javascript failed to load.

Reduce file size for optimized download speed.

This section covers the <link> tag.

<link> tag can be blocking. Hence, try to keep it minimum.

When CSS fails, the website (HTML or HTML + Javascript) MUST work.

You must use the link tag to specify canonical website (e.g. AMP vs. Conventional HTML). Otherwise, the search engine can get confused and picked the wrong primary source.

Condense the CSS to reduce its filesize for optimized loading.

CSS has no dynamic loading on its own and neither browser will selectively loads CSS files based on screen size or resolution. Hence, You should condense common CSS codes into a single files; you only separate them when the CSS is specific to page (or possibly use inline CSS).

This section covers all user experience designs.

It's 21st century, everyone is using mobile. Therefore, the website design must be responsive and friendly to mobile users.

Implement AMP when applicable, and available. It focuses on mobile users.

When request indexing, always go for mobile first over desktop as user density is higher in the mobile site. This is also subjected to the website intent so not all website must comply to this value.

As time goes by, you should improve the weight of the pages to the point it's serving up to speed.

Remember your target audience. Facilitates i18n whenever sensible.