Best way to audit and update a site

support
1

Hello,
I built a website with Hugo about three or four years ago to learn how to use the software. It was probably with version 0.100 or close to it.
This training website is currently up and running and can be visited here.
Now I would like to refresh it and update it with the latest version of Hugo.
Can you give me some advice on how to update it and use the latest features of the current version, and perhaps make the site cleaner and more efficient, particularly regarding to image processing?
A step-by-step guide would be welcome, if any

2

If I were in your shoes, my work plan would be:

  1. Make a copy of the site folder. Either clone it or create a new branch if using Git.
  2. Update the Hugo executable to the latest version.
  3. Run hugo server -D --logLevel=info and take note of all deprecated: and WARN messages.
  4. Start fixing the reported deprecated: and WARN issues one by one.

If I’m not mistaken, the most significant changes were introduced in v0.146.0, with the new template system.

You’re already serving images with srcset and using loading="lazy" for below-the-fold content.
A few direct improvements I would do are:

  1. Add proper alternative text (alt). Right now, the homepage uses filenames as `alt`. I would write descriptive alt text or hide decorative images from screen readers using aria-hidden="true".
  2. Serve all images as .webp. Only your hero/cover images are .webp, your article images are still .jpg.
  3. Adopt page bundles. For content-specific images (better organization)

A small note:
Your code blocks and table rows currently have a color contrast ratio of 1.89 : 1.
For better accessibility, aim for a ratio of at least 4.5 : 1 (ideally around 4.9 : 1 for readability).

1 Like
3

Thanks a lot for your helpful guidance.

I found 2 deprecated and 2 warning messages which I was able to correct quite easily.

I have now to explore a little bit the new template system introduced in v0.146.0 even though the site is currently working with the latest version.

As far I understand my project already follows the page bundles and content organization as recommanded here. For your other suggested improvements, work is still in progress.

Thanks again

4

Read this: New template system in Hugo v0.146.0