Zaman ne kadar hızlı geçiyor? 20 yıllık profesyonel yazılım kariyerim, bir göz açıp kapayıncaya kadar geçti. İlk HTML, CSS ve JavaScript kodlarımı keşfettiğim günleri, üniversitedeki ilk programlama dersimi, ilk iş günümü ve Mozilla ile MetaMask'taki ilk kodlama deneyimlerimi hâlâ dün gibi hatırlıyorum. Ancak her fırsatta genç mühendislere eski bir programlama referansı yaptığımda, boş bakışlarla karşılaşıyorum. İşte o an anlıyorum: ben web'in eski kuşağıyım.
Web sayfası düzenlerietiketleriyle yapılırken, CSS float özelliği yeni bir standart olarak ortaya çıkmıştı. Yuvarlak köşeler için resimler ve Internet Explorer için VML hileleri kullanılıyordu. Web sitesi değişikliklerini yüklemek için en iyi yöntem FTP idi; SVN ve trunk kopyalama en popüler versiyonlama aracıydı. alert() ve confirm() fonksiyonları, modal pencerelerin standardıydı. Hata ayıklama için Firebug en iyi araçtı. Videoları oynatmak için doğru codec'i bulmak ayrı bir beceriydi.
ActionScript bilgisi, JavaScript bilgisi kadar değerliydi. Dreamweaver, metin editörü ve tasarım aracı olarak en iyisiydi. XML, veri yapılarının geleceği olarak görülüyordu. Mobil öncelikli tasarım? Mobil cihazlar henüz yoktu. Reaktif navigasyon yerine Java Applet'ler veya fare üzerine gelince ve çıkınca farklı
kullanımı vardı. Masaüstü uygulaması geliştirmek için Adobe Air kullanılıyordu.
Sistem Güvenliği
NPM kısaltması 'not performant, man' olarak anılıyordu. Bir ankete oy vermek sayfanın yeniden yüklenmesi anlamına geliyordu. 'Sosyal medya' denince akla HotOrNot.com geliyordu. Web'in sevgi sesi, 56k modem bağlantısının çıkardığı 'purrrrr' sesiydi. Sağ tıklamayı devre dışı bırakmak, resimlerin güvenliğini sağlamak için kullanılıyordu. Bitmap (.bmp) dosya formatı hâlâ geçerli bir seçenekti.
Sonuç ve Değerlendirme
JavaScript'in bir rakibi vardı: JScript. SpyJax ile kullanıcının nerede gezindiğini tespit etmek mümkündü. Çerezler, kullanıcı takibinin zirvesiydi. Sosyal medya duvarı yerine 'ziyaretçi defteri' kullanılıyordu. Arkadaş listesi ise 'web ring' olarak adlandırılıyordu. Arama motoru optimizasyonu,
etiketini anahtar kelimelerle doldurmaktan ibaretti.</p><h3>Detaylar ve Etkileri</h3><p>Evet, o günler gerçekten de başka bir dünyaydı. Peki siz web'de kaç yaşındasınız? Bu nostaljik yolculuk, teknolojinin ne kadar hızlı değiştiğini ve biz eski kuşakların bu değişime tanıklık etmenin keyfini bir kez daha hatırlatıyor. Web'in evrimi, her birimizde farklı anılar bırakıyor.</p><p class="post-source"><em>Kaynak: <a href="https://davidwalsh.name/im-so-old-1" target="_blank" rel="nofollow noopener">davidwalsh.name</a></em></p> </div> <!-- ADS SECTION — CLS için sabit yükseklik --> <div class="mt-5 mb-4 text-center"> <div id="container-2eb275699028da5a466582ba91a44bdd" style="min-height:280px;display:flex;align-items:center;justify-content:center"></div> <script async="async" data-cfasync="false" src="https://pl30155735.effectivecpmnetwork.com/2eb275699028da5a466582ba91a44bdd/invoke.js"></script> </div> <!-- TAGS --> <nav class="post-nav" aria-label="Yazı gezintisi"> <a href="https://niceblogger.net/blog/curl-ile-http-header-ekleme-adim-adim-kilavuz" class="post-nav__link post-nav__link--prev"> <span class="post-nav__label">← Önceki Yazı</span> <span class="post-nav__title">curl ile HTTP Header Ekleme: Adım Adım Kılavuz</span> </a> <a href="https://niceblogger.net/blog/javascript-ile-bir-stringden-sayi-cikarma-regex-kullanarak-pratik-cozum" class="post-nav__link post-nav__link--next"> <span class="post-nav__label">Sonraki Yazı →</span> <span class="post-nav__title">JavaScript ile Bir String'den Sayı Çıkarma: Regex Kullanarak Pratik Çözüm</span> </a> </nav> <div class="post-tags"> <span class="post-tags__label"> <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"/><line x1="7" y1="7" x2="7.01" y2="7"/></svg> Etiketler: </span> <div class="post-tags__list"> <a href="https://niceblogger.net/tag/devops" class="tag-badge">devops</a> <a href="https://niceblogger.net/tag/scrum" class="tag-badge">scrum</a> <a href="https://niceblogger.net/tag/egitim" class="tag-badge">eğitim</a> <a href="https://niceblogger.net/tag/makine-ogrenimi" class="tag-badge">makine öğrenimi</a> <a href="https://niceblogger.net/tag/programlama" class="tag-badge">programlama</a> <a href="https://niceblogger.net/tag/girisimcilik" class="tag-badge">girişimcilik</a> <a href="https://niceblogger.net/tag/siber-guvenlik" class="tag-badge">siber güvenlik</a> <a href="https://niceblogger.net/tag/cloud" class="tag-badge">cloud</a> </div> </div> <!-- SHARE --> <div class="post-share"> <span class="post-share__label">Paylaş:</span> <a href="https://twitter.com/intent/tweet?url=http%3A%2F%2Flocalhost%2Fblog%2Fwebin-ilk-gunleri-bir-yazilimcinin-20-yillik-nostaljisi&text=Web%E2%80%99in+%C4%B0lk+G%C3%BCnleri%3A+Bir+Yaz%C4%B1l%C4%B1mc%C4%B1n%C4%B1n+20+Y%C4%B1ll%C4%B1k+Nostaljisi" class="post-share__btn post-share__btn--twitter" target="_blank" rel="noopener noreferrer" aria-label="Twitter'da paylaş"> <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.747l7.73-8.835L1.254 2.25H8.08l4.259 5.632zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg> </a> <a href="https://www.linkedin.com/sharing/share-offsite/?url=http%3A%2F%2Flocalhost%2Fblog%2Fwebin-ilk-gunleri-bir-yazilimcinin-20-yillik-nostaljisi" class="post-share__btn post-share__btn--linkedin" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn'de paylaş"> <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></svg> </a> <button class="post-share__btn post-share__btn--copy" id="js-copy-link" title="Bağlantıyı kopyala" aria-label="Bağlantıyı kopyala"> <svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg> </button> </div> </article> <!-- SIDEBAR: TOC --> </div> </div> <!-- RELATED POSTS --> <section class="section section--related"> <div class="container"> <div class="section-header"> <h2 class="section-header__title">İlgili Yazılar</h2> <span class="section-header__line"></span> </div> <div class="related-posts-grid"> <article class="post-card"> <a href="https://niceblogger.net/blog/web-icerigine-gizlenen-talimatlar-ai-ajanlarini-hedef-aliyor" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_38457_1783496425.webp" alt="Web İçeriğine Gizlenen Talimatlar AI Ajanlarını Hedef Alıyor" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/siber-guvenlik" class="post-card__cat-link" style="color:#ef4444">Siber Güvenlik</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/web-icerigine-gizlenen-talimatlar-ai-ajanlarini-hedef-aliyor">Web İçeriğine Gizlenen Talimatlar AI Ajanlarını Hedef Alıyor</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm"></p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 3 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 14 </span> <span class="post-card__meta-item">1 hafta önce</span> </div> </div> </article> <article class="post-card"> <a href="https://niceblogger.net/blog/microsoft-windows-ayarlari-yedekleme-ozelligini-varsayilan-olarak-etkinlestiriyor" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_66969_1783471825.webp" alt="Microsoft, Windows Ayarları Yedekleme Özelliğini Varsayılan Olarak Etkinleştiriyor" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/siber-guvenlik" class="post-card__cat-link" style="color:#ef4444">Siber Güvenlik</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/microsoft-windows-ayarlari-yedekleme-ozelligini-varsayilan-olarak-etkinlestiriyor">Microsoft, Windows Ayarları Yedekleme Özelliğini Varsayılan Olarak Etkinleştiriyor</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm">Microsoft, Windows 11 26H2 güncellemesiyle birlikte kurumsal cihazlarda Windows ayarları...</p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 2 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 13 </span> <span class="post-card__meta-item">1 hafta önce</span> </div> </div> </article> <article class="post-card"> <a href="https://niceblogger.net/blog/css-ile-html-width-ve-height-niteliklerini-gecersiz-kilma-yontemi" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_19961_1783471809.webp" alt="CSS ile HTML width ve height Niteliklerini Geçersiz Kılma Yöntemi" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/siber-guvenlik" class="post-card__cat-link" style="color:#ef4444">Siber Güvenlik</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/css-ile-html-width-ve-height-niteliklerini-gecersiz-kilma-yontemi">CSS ile HTML width ve height Niteliklerini Geçersiz Kılma Yöntemi</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm">Resimlerin HTML'de belirtilen genişlik ve yükseklik değerleri CSS ile nasıl geçersiz ...</p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 2 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 13 </span> <span class="post-card__meta-item">1 hafta önce</span> </div> </div> </article> </div> </div> </section> </div><!-- /.blog-post --> <script> (function () { // TOC active link tracking var tocLinks = document.querySelectorAll('.toc-widget__nav a'); if (tocLinks.length) { var headings = []; tocLinks.forEach(function (link) { var id = link.getAttribute('href').replace('#', ''); var el = document.getElementById(id); if (el) headings.push({ el: el, link: link }); }); window.addEventListener('scroll', function () { var scrollY = window.scrollY + 120; var current = null; headings.forEach(function (h) { if (h.el.getBoundingClientRect().top + window.scrollY <= scrollY) { current = h; } }); tocLinks.forEach(function (l) { l.classList.remove('toc-active'); }); if (current) current.link.classList.add('toc-active'); }, { passive: true }); } // Copy link button var copyBtn = document.getElementById('js-copy-link'); if (copyBtn) { copyBtn.addEventListener('click', function () { navigator.clipboard.writeText(window.location.href).then(function () { copyBtn.title = 'Kopyalandı!'; setTimeout(function () { copyBtn.title = 'Bağlantıyı kopyala'; }, 2000); }); }); } // Lightbox Logic var lightbox = document.getElementById('lightbox-modal'); if (lightbox) { var triggers = document.querySelectorAll('.lightbox-trigger'); var lightboxImg = document.getElementById('lightbox-img'); var closeBtn = document.querySelector('.lightbox-close'); var prevBtn = document.querySelector('.lightbox-prev'); var nextBtn = document.querySelector('.lightbox-next'); var currentIndex = 0; var images = []; triggers.forEach(function(trigger, index) { images.push(trigger.getAttribute('href')); trigger.addEventListener('click', function(e) { e.preventDefault(); currentIndex = index; showImage(currentIndex); lightbox.classList.add('active'); document.body.style.overflow = 'hidden'; }); }); function showImage(index) { if (index < 0) index = images.length - 1; if (index >= images.length) index = 0; currentIndex = index; lightboxImg.src = images[currentIndex]; } closeBtn.addEventListener('click', function() { lightbox.classList.remove('active'); document.body.style.overflow = ''; }); lightbox.addEventListener('click', function(e) { if (e.target === lightbox) { lightbox.classList.remove('active'); document.body.style.overflow = ''; } }); prevBtn.addEventListener('click', function() { showImage(currentIndex - 1); }); nextBtn.addEventListener('click', function() { showImage(currentIndex + 1); }); document.addEventListener('keydown', function(e) { if (!lightbox.classList.contains('active')) return; if (e.key === 'Escape') closeBtn.click(); if (e.key === 'ArrowLeft') prevBtn.click(); if (e.key === 'ArrowRight') nextBtn.click(); }); } })(); </script> <!-- Lightbox HTML --> <div id="lightbox-modal" class="lightbox"> <button class="lightbox-close">×</button> <button class="lightbox-prev">❮</button> <img id="lightbox-img" src="" alt="Gallery Image"> <button class="lightbox-next">❯</button> </div> </main> <!-- Footer --> <footer class="site-footer"> <div class="footer-top container"> <div class="footer-brand"> <a href="https://niceblogger.net/" class="footer-logo"> <img src="https://niceblogger.net/assets/images/logo.webp?v=1783957360" alt="NiceBlogger Logo" width="50" height="50" loading="lazy" style="width:50px;height:50px;border-radius:50%;margin-right:15px;object-fit:cover;"> <span class="brand-name">L7WAF</span> </a> <p class="footer-tagline">En İyi Blog Deneyimi</p> <div class="footer-social"> <a href="https://twitter.com/devpulse" target="_blank" rel="noopener" aria-label="Twitter" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg> </a> <a href="https://github.com/devpulse" target="_blank" rel="noopener" aria-label="GitHub" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z"/></svg> </a> <a href="https://linkedin.com/company/devpulse" target="_blank" rel="noopener" aria-label="LinkedIn" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6zM2 9h4v12H2z"/><circle cx="4" cy="4" r="2"/></svg> </a> </div> </div> <div class="footer-links"> <div class="footer-col"> <h3 class="footer-col-title">Kategoriler</h3> <ul class="footer-nav"> <li><a href="https://niceblogger.net/category/dunya-geneli" class="footer-link">Dünya Geneli</a></li> <li><a href="https://niceblogger.net/category/windows" class="footer-link">Windows</a></li> <li><a href="https://niceblogger.net/category/linux" class="footer-link">Linux</a></li> <li><a href="https://niceblogger.net/category/siber-guvenlik" class="footer-link">Siber Güvenlik</a></li> <li><a href="https://niceblogger.net/category/yazilim" class="footer-link">Yazılım</a></li> </ul> </div> <div class="footer-col"> <h3 class="footer-col-title">Sayfalar</h3> <ul class="footer-nav"> <li><a href="https://niceblogger.net/" class="footer-link">Ana Sayfa</a></li> <li><a href="https://niceblogger.net/qa.php" class="footer-link">Soru & Cevap</a></li> <li><a href="https://niceblogger.net/about.php" class="footer-link">Hakkında</a></li> <li><a href="https://niceblogger.net/contact.php" class="footer-link">İletişim</a></li> <li><a href="https://niceblogger.net/search.php" class="footer-link">Arama</a></li> <li><a href="https://www.effectivecpmnetwork.com/srnrwwub2?key=19f571f979be9f546b4050a2f5c46245" class="footer-link" rel="sponsored" target="_blank">Reklam Ver</a></li> </ul> </div> <div class="footer-col footer-col-tags"> <h3 class="footer-col-title">Popüler Etiketler</h3> <div class="footer-tags"> <a href="https://niceblogger.net/tag/docker" class="tag-badge">Docker</a> <a href="https://niceblogger.net/tag/linux" class="tag-badge">linux</a> <a href="https://niceblogger.net/tag/hacker" class="tag-badge">hacker</a> <a href="https://niceblogger.net/tag/teknoloji" class="tag-badge">teknoloji</a> <a href="https://niceblogger.net/tag/devops" class="tag-badge">devops</a> <a href="https://niceblogger.net/tag/malware" class="tag-badge">malware</a> <a href="https://niceblogger.net/tag/yatirim" class="tag-badge">yatırım</a> <a href="https://niceblogger.net/tag/agile" class="tag-badge">agile</a> <a href="https://niceblogger.net/tag/bilim" class="tag-badge">bilim</a> <a href="https://niceblogger.net/tag/ag-guvenligi" class="tag-badge">ağ güvenliği</a> <a href="https://niceblogger.net/tag/scrum" class="tag-badge">scrum</a> <a href="https://niceblogger.net/tag/donanim" class="tag-badge">donanım</a> </div> </div> </div> </div> <div class="footer-bottom container"> <p class="footer-copy">© 2026 NiceBlogger. Tüm hakları saklıdır.</p> </div> </footer> <!-- Prism.js — defer, yalnızca kod blokları olan sayfalarda aktif --> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-php.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-javascript.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-css.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-bash.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-yaml.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-docker.min.js"></script> <!-- Main JS — defer --> <script defer src="https://niceblogger.net/assets/js/theme.min.js?v=1783957360"></script> <script defer src="https://niceblogger.net/assets/js/main.min.js?v=1783957360"></script> <script>window.POST_ID = 6444;</script> <!-- Social Bar Ad — window.load sonrası header'daki yükleyici ile enjekte edilir --> <div data-ad-src="https://pl30262757.effectivecpmnetwork.com/a7/85/ea/a785ea57e6a2e578134b71ada9686c21.js" style="display:none"></div> </body> </html>