diff --git a/esphome/components/web_server/web_server.cpp b/esphome/components/web_server/web_server.cpp
index 28e741cf24..d72262b4d3 100644
--- a/esphome/components/web_server/web_server.cpp
+++ b/esphome/components/web_server/web_server.cpp
@@ -164,7 +164,9 @@ float WebServer::get_setup_priority() const { return setup_priority::WIFI - 1.0f
void WebServer::handle_index_request(AsyncWebServerRequest *request) {
AsyncResponseStream *stream = request->beginResponseStream("text/html");
std::string title = App.get_name() + " Web Server";
- stream->print(F(""));
+ stream->print(F("<!DOCTYPE html><html lang=\"en\"><head><meta charset=UTF-8>"
+ "<meta name=\"viewport\" content=\"width=device-width, "
+ "initial-scale=1.0\"><title>"));
stream->print(title.c_str());
stream->print(F(""));
#ifdef WEBSERVER_CSS_INCLUDE