How I Built an Enterprise-Level Website Alone

Over the past few years, I have accumulated some products while writing code, and with the ideas I developed independently, I have also made some money. My desire to start a company has become increasingly strong. For an internet company, the official website is like the exterior wall of a house.

This article discusses how I developed our company's official website (www.ygeeker.com) alone. It includes how to organize website content, how to choose technology, how to design and develop, how to optimize SEO for an enterprise website, and how to handle various details.

Website Content Design / Patterns

A typical enterprise-level website usually includes the following content:

  • Home Page: Showcasing the most popular products (Apple is a typical example), introducing corporate culture, etc.
  • Recruitment: Introducing hiring needs, company benefits, and providing channels for submitting resumes.
  • Product Landing Pages: Each individual product has a landing page, such as the landing page designed by OpenAI for Sora.
  • Legal Regulations: Usually an article page displaying privacy policies, terms of use, and other clauses.
  • Help and Support: Providing corresponding help manuals for each product, some even include global search, like Google’s Help Center.
  • Unique Special Pages: Pages introducing corporate responsibility, efforts made for environmental protection, pages for specific events, etc., referencing Alibaba Cloud's Double Eleven event page. These pages are characterized by being singular and independent, often serving as the end point of routing.
  • Sitemap

In addition to these pages, the website content also includes common components:

  • Navigation Bar: The main navigation endpoint.
  • Footer Navigation Bar: Contains legal information, link information, social media links, etc.
  • Global FAB: Contact customer service, follow public accounts, etc.

After listing all the products, we can draw a website outline:

Technology Stack / Stack

Considering the following characteristics of such websites:

  • Predominantly static pages
  • Complex style requirements
  • Need for document-like functionality to implement a help center
  • i18n requirements

I ultimately chose the Next + Nextra + Tailwind solution. Next has a natural advantage for static websites, while Tailwind helps us easily manage style changes.

Additionally, I chose framer-motion as the animation library to add some vitality to the static pages.

SEO can be approached from two angles: technical optimization and content optimization.

From a technical perspective, the website needs to have sound SEO-related facilities/measures. Some of the following are what we have implemented:

  • Basic Meta tags, OG tags, Twitter tags
  • A complete sitemap
  • Choosing static pages whenever possible
  • itemProps tags

Moreover, by utilizing Next's API capabilities, we can create dynamic OG images, which is especially useful for document-type pages.

Multi-Region & Internationalization / i18n

When we talk about internationalization, it is not just about translating the page copy into the corresponding regional language, but also adapting to various regions in terms of usage habits, legal regulations, cultural differences, and more.

Conclusion

In fact, to create a complete website, especially a landing-type website, there are many aspects to consider.