Review request for cybersecurity-related website

Hi,

I need my website https://cybersecuritylog.com/ to be reviewed.
The content is related to cybersecurity news, articles for migitations, and other useful content.

I just started working on it a few weeks ago and want to do it right.

Thank you!

 

Absurdly undersized fixed metric (px) fonts, illegible white text over images, gibberish navigation likely meaning broken document structure, broken to nonexistent responsiveness, and painfully slow loading.

The markup being bloated gibberish that tells users with accessibility needs to go plow themselves. I mean nonsensical heading orders, missing headings, lists around non-list content, paragraphs around non-paragraph content, blocking scripts in the head, metric shit-ton of META not one legitimate UA gives a flying purple fish about, endless pointless DIV for nothing...

I mean seriously:

<header id="header">
<div class="top-bar">
<div class="container">
<div class="col-sm-12">
<div class="row">
<ul class="top-menu top-menu-left">
<li><a href="https://cybersecuritylog.com/contact">Contact</a></li> </ul>
<ul class="top-menu top-menu-right">
<li class="li-dark-mode-sw">
<form action="https://cybersecuritylog.com/vr-switch-mode" method="post" accept-charset="utf-8">
<input type="hidden" name="6130d7317ef33_csrf_token" value="8207967544fa0c2dec9f6f7344c9d906" />
<button type="submit" name="dark_mode" value="1" class="btn-switch-mode">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-moon-fill dark-mode-icon" viewBox="0 0 16 16">
<path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z" />
</svg>
</button>
</form> </li>
</ul>
</div>
</div>
</div>
</div>
<div class="logo-banner">
<div class="container">
<div class="col-sm-12">
<div class="row">
<div class="left">
<a href="https://cybersecuritylog.com/">
<img src="https://cybersecuritylog.com/uploads/logo/logo_61384581813df.png" alt="logo" class="logo" width="190" height="60">
</a>
</div>

Code (markup):

doing the job of:

<input type="checkbox" id="toggle_nightDay" hidden>
<header id="top">
	<h1>CYBERSECURITY LOG</h1>
	<div>
		<ul>
			<li><a href="https://cybersecuritylog.com/contact">Contact</a></li>
			<li><label for="toggle_nightDay"></label></li>
		</ul>
	</div>
</header>

Code (markup):

That's how bad we're talking here.