In recent years, blogs related to web development and programming have been increasing, and many readers are looking for concrete code examples. However, when embedding such code into articles, there are several points to consider from an SEO perspective.
In this article, we will подробно explain whether programming code written inside pre tags—such as HTML, CSS, JavaScript, and PHP—affects SEO character count, and how to handle it optimally.

Contents
  1. Should Code Inside pre Tags Be Counted as Text?
  2. How to Effectively Use Code Inside pre Tags for SEO
  3. Cases Where You Should Avoid Including Code Inside pre Tags
  4. Conclusion

Should Code Inside pre Tags Be Counted as Text?

Reasons

  • Indexed by search engines:
    Since Google’s crawler reads all text on a page, code inside pre tags is also recognized as part of the text content.
  • Beneficial to users:
    Code snippets are extremely valuable to certain audiences, so it makes sense to consider them as meaningful content.

Considerations

If the code content is related to the main topic or theme of the article, it is highly likely to be considered “useful content” for SEO. However, if large amounts of code are used redundantly and overwhelm the main content of the page, it may harm the user experience.

How to Effectively Use Code Inside pre Tags for SEO

  • Appropriate titles and meta descriptions:
    Titles and meta descriptions for articles that include code should be specific and appealing. For example, a title like “How to Implement a Slideshow in JavaScript” is more likely to attract readers. This approach is recommended for any type of blog article.
  • Make use of comments:
    Adding comments within the code helps crawlers better understand the meaning and context of the content.
  • Maintain code readability:
    Code should be properly formatted and appropriately indented. This makes it easier to read for both users and crawlers.
  • Add relevant explanations:
    By including not only the code itself but also detailed explanations of how it works, its background, and how to use it, you can increase the value of the article.
  • Use appropriate header tags:
    Using header tags (H1, H2, H3, etc.) to clearly separate sections and subsections helps with structural understanding and is also effective for SEO. This applies to all types of blog articles.

Cases Where You Should Avoid Including Code Inside pre Tags

The pre tag is mainly used to display code or formatted text, but it is not recommended to include the following types of content inside pre tags in blog articles.
When using pre tags, it is important to keep the following points in mind and strive to provide information that is valuable to readers.

Unrelated Code or Text

  • Reader confusion:
    Code or text unrelated to the theme or purpose of the article can confuse readers and reduce the credibility of the content.
  • SEO impact:
    Low-relevance content can dilute the topical focus of the page and may negatively affect search engine rankings.

Excessively Long Code

  • Increased load time:
    Very long code blocks can increase page load times and potentially harm the user experience.
  • Decreased user engagement:
    Readers may find it tedious to scroll through long code blocks and may leave the page sooner.

Code That Violates Licenses or Copyrights

Legal risks:
Publishing content that infringes on someone else’s copyright without permission can lead to legal issues.

Code That Contains Security Risks

Security vulnerabilities:
Publishing code that has security issues or does not follow security best practices may convey incorrect information or methods to readers.

Unverified or Non-Functional Code

Loss of credibility:
Publishing non-functional or unverified code can damage readers’ trust in you and your website.

Conclusion

When used appropriately within pre tags, programming code can become valuable content for SEO. However, careful attention must be paid to how it is used and formatted. By prioritizing article quality and user experience while implementing proper SEO measures, you can deliver valuable information to a wider audience.

　
*This article contains personal opinions. Please use the information at your own discretion.*

pre Tag Programming Code