An Upgrade to the latest web technologies

Why so serious about the website?

Just like a physical real property, a website is the true presence of a company on the internet. Other platforms where we can establish a presence belong to different entities, be it LinkedIn, Facebook, Twitter, or forums; they belong to their respective companies, not us. While these platforms are good for social connections, a website is where we can gather all our relevant information and put it in one place without limitations or boundaries, allowing our clients to see everything at once.

This investment pays off both in the present and the future. Other platforms where we can establish a presence are often hidden behind logins, making them inaccessible to search engines. With the evolution of AI, where people are increasingly bypassing traditional search engines, the presence of a well-nurtured website will continue to be crucial, as it will be recognized and answered by AI systems in the future.

And why not nurture an online presence? It’s as enjoyable as raising a baby.

Upgrading to the latest technologies

The web has evolved and is moving fast. Sticking to old-age technologies slows us down. This is, in fact, what we faced when creating the first version of our website. We outsourced the creation of our website as we were so busy forming the company. There’s a lot to do when forming an organized company, and at the same time, it is important to have an online presence.

Starting with WordPress

With the limited time we had, we compared and finalized the decision to develop the website in WordPress. We carefully chose a very good agency specializing in WordPress development. In fact, we are happy with the site. It stays at shikhashikz.co.in It took its time in its creation and for good reasons - it has its limitations on which I have shared some details.

Choosing Astro

As we settled down from the initial run in the company formation, I had time to explore more and compare, trying my hands on various technologies. Jamstack seemed promising. I experimented with 11ty, Next.js, Gatsby, Hugo, Astro, React, and Sanity. We already knew Jekyll, and I still love it; it’s where Shikha created her blogs from 2016. It stays at shikhashikz.in (open source and freely hosted on GitHub Pages).

Astro is something I liked and considered the best way to move forward. It’s fast, with less JavaScript, and flexible enough to use components from React, Vue, Astro, etc. I’ve tried some and found it smooth to use. It is possible to do a full stack web development as well. Many free and paid themes are available. Thanks to Pinwheel Astro, the free theme which we used here.

Astro is open source, gaining popularity very quickly, so stability and future is quite bright.

Tailwind for CSS

Although a bit old now as of 2024, I’ll still call it a modern approach for cascading style sheets(CSS). It saves time and there is no need to learn everything in Tailwind CSS. Just ask ChatGPT or seek help on the Tailwind website; it will provide code or ways to modify the look and feel. It saves time navigating through paths and classes; it’s done right there in assigning class names. WordPress templates often use Elementor, missing granular control. Using Tailwind directly in Astro or any file-based web development offers more advantages over site builders.

GitHub as version control

It’s a no-brainer to use GitHub for source code control. GitHub is rock-solid and stable, already hosting many projects in the open-source world. Many users can simultaneously work with GitHub, on a local machine, at high speed. This level of collaboration isn’t achievable in WordPress at this speed.

One interesting fact is that Git was created by Linus Torvalds, the creator of Linux. GitHub is built on top of Git and is now owned by Microsoft. What a collaboration!

Netlify as host

The new era of Continuous Integration and Continuous Deployment (CI/CD) saves significant time and resources. GitHub Pages, Netlify, Vercel, and Amazon Amplify offer integration with GitHub code. Although I tried Amazon Amplify and found it somewhat raw, requiring some manual work to get started, Netlify works smoothly and robustly.

With so many options available, why worry about shared hosting when we can access the cloud for free? Yes, Netlify offers a free single user plan with up to 100GB bandwidth per month. We might need to purchase additional bandwidth if we exceed the limit, but that’s a good sign of growth.

However, transitioning to the paid versions requires caution, as using GitHub and Netlify together in a paid plan might lead to high costs for organizations. Additionally, proper security measures are essential, as attacks like DDoS can be financially draining. Perhaps a new, specific post on hosting with tips and tricks would be beneficial.

Markdown for writing articles

It might seem like WordPress is a simpler solution for a website and blog, as collaborators can log in and create posts without needing to learn code. However, Markdown is not that difficult; in fact, it feels simpler for content writers. Check out how Shikha herself wrote so many blogs in Markdown for shikhashikz.in. With MDx, it can even be coded to provide real-time snippets in the article itself. The ability to write and test on a local machine and not be limited by internet bandwidth makes it high-speed.

Use of ChatGPT

I think AI, as of now, is good enough to get started, as I’ve often not received the correct answers. It’s good for correcting grammar; you won’t find grammatical mistakes in this blog, otherwise I’m not very comfortable with the English language. It’s helpful to get some code snippets and instructions. It’s useful to get some facts, although not always correct, so cross-checking is necessary. It’s beneficial to engage in conversations and gather information. But it still has a long way to go to approach human intelligence. I use it extensively but mainly for small tasks.

Use of Microsoft Designer for AI images

One of the most important things is to have good graphics. Graphics can attract attention and convey messages quickly; with just a glance. If you’re serious about brand building, having the best graphic designer is a must. Graphics created using tools like Canva or AI won’t have the same impact as those created by professional designers.

While I have an eye for good graphics, I consider myself a novice. So, here I tried something - creating graphics using AI and the Microsoft Designer tool. The AI images generation is currently free on Microsoft Designer, so I made as many as possible till satisfied. What’s required for a good image is good text and we already had our content written by Shikha for our website.

I’m sure Microsoft will eventually restrict usage to a paid model, but for now, it is not restricted and I’ve tried to use it as much as possible, and it is impressive. It might be worth paying in future as well if it’s making an impact.

Some important considerations

GIMP for image correction

The AI-generated images don’t adhere to the company’s branding guidelines. Therefore, I used GIMP, a free and open-source high-end image processor, to ensure the images don’t look awkward. It is used by professionals, and I’ve only used it a little where required, but I am surprised to see its powers.

Alternative use for WordPress

WordPress is still a very fast and stable engine, and I believe it has its place. It’s good to get started on a website as we did. It can be used as a content management system (CMS) backend. It will be more budget-friendly than the alternatives for CMS.

Static vs dynamic

There are many articles mentioning that there isn’t much difference in search engine optimization between static and dynamic sites. But then, Google shows mostly static sites on the first page of results.

To test this, we created a static version of our WordPress site using the Simply Static plugin. We hosted this static site on shikhashikz.com (now moved), while our dynamic WordPress site remains at shikhashikz.co.in. I implemented some standard SEO practices such as robots.txt and sitemap.xml and submitted them to Google Search Console.

After a few days, the static site appeared at the top of the search results for the keyword “shikhashikz” while the WordPress site was nowhere to be found in Google search results. On Bing, our old Jekyll static site (shikhashikz.in) appeared at the top, followed by the new static site, and lastly, the WordPress site.

On Yahoo, the new static site appeared first, followed by the old one, with similar results on DuckDuckGo.

It might still hold true for a long time. I’ve provided links in the search engine names. Try it for yourself by clicking on the search engine names.

In short, the static site consistently ranked higher across all search engines, while the dynamic site consistently ranked lower or was absent. The reason could be anything; it’s not necessarily because of its dynamic nature but possibly due to missing optimization. In a static site, there are fewer chances of missing out on optimization opportunities. Why settle for less? Astro generates a SEO friendly static site by default, and dynamic rendering is also possible.

Roles in development and update.

To develop, modify and run such a website, it requires a combination of a web designer, a web developer, a content writer, a graphic designer and a System Administrator. Well, I’m a software engineer who values the importance of design elements, and Shikha writes well. So, we could create this website entirely on our own. However, such a combination is only necessary in the initial stages of development or changes. Once it’s up and running, only occasional input from a web designer and rare assistance from a developer and System Administrator are needed. A content writer and graphic designer can update it for years to come.

What’s next?

Now that we have our latest technology in place, most of which are free and of high quality, we can concentrate on maintaining the website for years without any second thoughts. Of course, we’ll be updating it frequently and refreshing it occasionally, but overall, we’re well-prepared.

I’m confident that we have all the right elements in place. If you have any questions, feedback, suggestions, requirements, or simply want to connect, feel free to comment or email me at nitin@shikhashikz.com.