О себе

<form id="myForm" method="POST" action="">
    <div>
        <label for="name">Имя</label>
        <input type="text" id="name" name="name" required>
        <span class="error" id="nameError"></span>
    </div>
    <div>
        <label for="surname">Фамилия</label>
        <input type="text" id="surname" name="surname" required>
        <span class="error" id="surnameError"></span>
    </div>
    <div>
        <label for="email">Email</label>
        <input type="email" id="email" name="email" required>
        <span class="error" id="emailError"></span>
    </div>
    <div>
        <label for="age">Возраст</label>
        <input type="number" id="age" name="age" required>
        <span class="error" id="ageError"></span>
    </div>
    <div>
        <label for="about">О себе</label>
        <textarea id="about" name="about"></textarea>
    </div>
    <button type="submit">Отправить</button>
</form>

<?php
$errors = [];

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $name = $_POST['name'];
    $surname = $_POST['surname'];
    $email = $_POST['email'];
    $age = $_POST['age'];
    $about = $_POST['about'];

if (empty($name)) {
        $errors['name'] = 'Введите имя';
    }

if (empty($surname)) {
        $errors['surname'] = 'Введите фамилию';
    }

if (empty($email)) {
        $errors['email'] = 'Введите email';
    } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $errors['email'] = 'Некорректный email';
    }

if (empty($age)) {
        $errors['age'] = 'Введите возраст';
    } elseif (!is_numeric($age)) {
        $errors['age'] = 'Введите числовое значение';
    }

// Если форма прошла валидацию
    if (empty($errors)) {
        // Далее можно выполнить какую-либо логику, например, сохранить данные в базу данных
        // ...
        // Или отправить данные на почту
        // ...
        // Или вывести данные на экран
        echo "Данные успешно отправлены";
        exit;
    }
}
?>

document.getElementById("myForm").addEventListener("submit", function(event) {
    var name = document.getElementById("name").value;
    var surname = document.getElementById("surname").value;
    var email = document.getElementById("email").value;
    var age = document.getElementById("age").value;

var nameError = document.getElementById("nameError");
    var surnameError = document.getElementById("surnameError");
    var emailError = document.getElementById("emailError");
    var ageError = document.getElementById("ageError");

// Сброс ошибок
    nameError.textContent = "";
    surnameError.textContent = "";
    emailError.textContent = "";
    ageError.textContent = "";

// Валидация имени
    if (name.trim() === "") {
        nameError.textContent = "Введите имя";
        event.preventDefault();
    }

// Валидация фамилии
    if (surname.trim() === "") {
        surnameError.textContent = "Введите фамилию";
        event.preventDefault();
    }

// Валидация email
    if (email.trim() === "") {
        emailError.textContent = "Введите email";
        event.preventDefault();
    } else if (!/\S+@\S+\.\S+/.test(email)) {
        emailError.textContent = "Некорректный email";
        event.preventDefault();
    }

// Валидация возраста
    if (age.trim() === "") {
        ageError.textContent = "Введите возраст";
        event.preventDefault();
    } else if (!Number.isInteger(Number(age))) {
        ageError.textContent = "Введите числовое значение";
        event.preventDefault();
    }
});

Results: