Implement Content Protection (Disable Selection/Drag)

src/components/Navbar.jsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Link } from 'react-router-dom';
-import logo from '../assets/logo.png';
+import logo from '../assets/logo.webp';
 
 const Navbar = () => {
   const [isOpen, setIsOpen] = useState(false);
@@ -13,7 +13,7 @@ const Navbar = () => {
     <nav className="navbar">
       <div className="container navbar-container">
         <Link to="/about" className="logo">
-          <img src={logo} alt="Sokuree Logo" className="logo-image" />
+          <img src={logo} alt="Sokuree Logo" className="logo-image" width="40" height="40" />
           Sokuree Consultant
         </Link>
 

src/pages/About.jsx

@@ -1,4 +1,4 @@
-import consultantProfile from '../assets/consultant_profile.png';
+import consultantProfile from '../assets/consultant_profile.webp';
 
 const About = () => {
     return (
@@ -33,6 +33,9 @@ const About = () => {
                             src={consultantProfile}
                             alt="대표 컨설턴트"
                             className="profile-image"
+                            loading="lazy"
+                            width="400"
+                            height="500"
                         />
                     </div>
                     <div className="profile-content-container">

src/styles/main.css

@@ -34,6 +34,32 @@ body {
     color: var(--text-color);
     background-color: var(--main-bg);
     scroll-behavior: smooth;
+
+    /* Content Protection: Disable Text Selection */
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+/* Allow text selection in inputs and textareas for usability */
+input,
+textarea {
+    -webkit-user-select: text;
+    -moz-user-select: text;
+    -ms-user-select: text;
+    user-select: text;
+}
+
+/* Content Protection: Disable Image Dragging & Right Click */
+img {
+    -webkit-user-drag: none;
+    -khtml-user-drag: none;
+    -moz-user-drag: none;
+    -o-user-drag: none;
+    user-drag: none;
+    pointer-events: none;
+    /* Prevents right-click context menu on images */
 }
 
 /* Utilities */