Web Engineering Insights for Tool Developers│OJapp tips

Why Do Websites Ask “Do You Accept Cookies?” So Often Now? A Beginner-Friendly Guide

Why Do Websites Ask “Do You Accept Cookies?” So Often Now? A Beginner-Friendly Guide If you browse the web on your phone or computer, you’ve probably noticed that almost every website now asks: “Do you accept cookies?” Years ago, these pop-ups barely existed. So why are they everywhere today? This article explains, in simple terms, what cookies are, why websites ask for permission, and what is safe or risky to allow. What Are Cookies? Cookies are small pieces of data that websites save on your device. Think of them as tiny notes that help the site remember things. Keeping you logged in Saving your language preference Remembering what’s in your shopping cart In other words, cookies are simply a tool that helps websites work smoothly. → By themselves, cookies are not dangerous. So Why Do Websites Ask for Permission Now? The short answer: because privacy laws became much stricter. The biggest change came from Europe’s law called GDPR (General Data Protection Regulation). GDPR requires websites to: Explain what data is collected Ask for permission before tracking users Allow users to […]

English Articles

When to Clear Your Cache — and When You Definitely Shouldn’t

When to Clear Your Cache — and When You Definitely Shouldn’t Many users delete their browser cache the moment something “feels wrong.” But cache plays an important role, and deleting it too often can slow things down or even break certain web apps. As someone who builds Web tools and has manually cleared Safari cache hundreds of times while debugging, here’s a practical guide on when you should clear your cache — and when you absolutely shouldn’t. When You SHOULD Clear Cache 1. When a Website Update Isn’t Showing If HTML, CSS, or JS changes aren’t appearing, cache is almost always the reason — especially on iOS Safari, which holds onto files aggressively. Icons not updating CSS changes not appearing JavaScript still running old code For developers: clearing the cache for only the affected domain is the most effective approach. 2. When a WebClip (Home Screen Icon) Refuses to Update iOS uses a separate “shadow cache” for WebClip icons, which is NOT cleared by normal cache deletion. To fix this, go to: Settings → Safari → Advanced → Website Data […]

English Articles

The Safari Cache Delete Technique Every Web Tool Developer Uses — Why “Clear All” Can Make Things Worse

The Safari Cache Delete Technique Every Web Tool Developer Uses — Why “Clear All” Can Make Things Worse Safari’s cache often gets treated as the “enemy,” especially when web tools stop updating or icons refuse to refresh. But in reality, cache is a performance booster — until you’re developing a tool. After clearing Safari’s cache more than 1,000 times while building WebClip and PWA-related tools, I finally arrived at a method that clears every hidden cache layer without breaking logins or wiping unrelated data. Why the “Clear All” Option Is a Bad Idea The common beginner move is: Settings → Safari → Clear History and Website Data But this causes major problems: You lose every login session Your settings are reset across all sites Shopping carts and preferences disappear Some caches (especially WebClip caches) do NOT get cleared Yes — even after clearing everything, Safari may still keep a shadow cache that prevents updated files or icons from appearing. The Correct Approach: Delete Cache for One Site Only Safari stores cache per domain, which means you can safely delete data […]

English Articles

JavaScript Isn’t as Free as It Looks: Why Every Action Requires Its Own Script

JavaScript Isn’t as Free as It Looks: Why Every Action Requires Its Own Script Many beginners start learning web development with one big assumption: “JavaScript can do anything, right?” But once you begin writing it, you quickly realize something surprising: “It looks free, but it’s not actually that free…” JavaScript is powerful—but it is not magic. Even the simplest behavior requires a dedicated piece of code. In other words: One action = one script. “JavaScript can do anything” is half true, half misunderstanding Yes, JavaScript can handle animations, data processing, API calls, DOM updates, and more. But that simply means: “It can do it if you write it.” JavaScript never does the rest for you. It is a language where you must explicitly describe every step. Why one simple action often requires multiple pieces of JS Take something as simple as a calculator button: Get the input value → script #1 Add numbers → script #2 Update the screen → script #3 Handle errors → script #4 Even a tiny “add numbers” tool contains multiple invisible scripts behind the scenes. […]

English Articles

Why OJapp Icons Look So Clean: The Role and Limits of CSS Explained

Why OJapp Icons Look So Clean: The Role and Limits of CSS Explained Icons created with OJapp look surprisingly clean on both iPhone and Android home screens. Many users ask: “Why does it look so crisp?” This article explains the answer from a CSS perspective. Conclusion First: CSS Handles the Appearance, OJapp Provides the Perfect Material Clean icons are possible thanks to two elements working together: ① High-resolution source images prepared by OJapp ② WebClip’s CSS-like rules that automatically tidy up the icon CSS is a technology for styling. WebClip (the iOS/Android “Add to Home Screen” feature) internally uses rules very similar to CSS. CSS-Based Conditions That Make Icons Look Good To understand why icons look clean, it helps to view the process through the logic of CSS. 1. High-resolution images (1024px+) When CSS uses something like background-size: cover;, low-resolution images get blurry. WebClip behaves similarly—small images lose clarity. 2. Square images (1:1 ratio) Just like object-fit: cover; in CSS, non-square images get cropped. OJapp enforces a perfect square to prevent unpredictable trimming. 3. PNG with transparency works best Home […]

English Articles

What CSS Can and Cannot Do: A Beginner-Friendly Explanation

What CSS Can and Cannot Do: A Beginner-Friendly Explanation When you start learning web development, one of the first questions you’ll face is: “What exactly can CSS do?” “And what can’t it do?” This article explains the true role of CSS by clearly separating its “can do” and “cannot do” capabilities in a way beginners can easily understand. What CSS Can Do (✓) CSS is all about visual styling. Colors, layout, animation—anything related to appearance is its specialty. 1. Change colors, text, and backgrounds Set text color (color) Add background colors or images Adjust fonts and sizes 2. Control spacing and layout Adjust margins and padding Create layouts using flexbox or grid Align content left, center, or right 3. Create animations and visual effects Fade-in effects (opacity) Rotation and scaling (transform) Complex animations with @keyframes 4. Apply reusable design patterns One of the biggest strengths of CSS is that you can apply the same design to many elements using classes. What CSS Cannot Do (✕) On the other hand, CSS cannot handle logic, data, or interaction. In simple terms: CSS […]

English Articles

The Complete History of iOS WebClip: How Home Screen Icons Evolved and Why the Shadow Cache Exists

The History of iOS WebClip｜How the Home Screen Icon Feature Evolved Over 15+ Years Today, adding a website to the iPhone home screen feels completely normal. But this feature—called WebClip—was not part of the original iPhone, nor was it designed the way it behaves today. Over time, WebClip evolved dramatically: from simple screenshot-based shortcuts to a complex system involving apple-touch-icon, manifest icons, PWA features, and the infamous Shadow Cache. This article explains: How WebClip was born How it evolved through each major iOS era Why the Shadow Cache exists today Why icons became so difficult to update No English article currently covers this history in depth— so this is the world’s most complete explanation. 2007: iPhone OS 1 — No WebClip Yet The very first iPhone (iPhone OS 1.0) did not have a way to add websites to the home screen. Users could only save bookmarks inside Safari. The concept of a “web icon” sitting beside app icons did not yet exist. 2008: iPhone OS 1.1.3 — WebClip Is Born Apple introduced Add to Home Screen in iPhone OS 1.1.3 […]

English Articles

Why iPhone Home Screen Icons Don’t Update: The Hidden “Shadow Cache” in Safari Explained

Why iPhone Home Screen Icons Don’t Update: The Hidden “Shadow Cache” in Safari Explained “Why isn’t my new icon showing?” “I replaced the image, but the home screen still shows the old one…” If you’ve added a website to your iPhone’s home screen and the icon won’t update, you’ve run into one of Safari’s most confusing behaviors. The real cause is a little-known system inside iOS: Safari’s hidden “Shadow Cache.” In this guide, we’ll break down the entire mechanism— how iOS stores icons, why they don’t refresh, how to force updates, and how tools like OJapp avoid the problem entirely. The Short Answer: iOS Stores Icons in a Separate Hidden Cache When a user adds a website to their home screen (a Web Clip), iOS stores the icon in a dedicated cache separate from normal browser cache. This “shadow cache” has several unique characteristics: Clearing Safari cache does NOT remove it Reloading the webpage does not trigger an update If the icon URL is the same, the old image will always be used The cache can stay for days or […]

English Articles

HTML, CSS, and JavaScript Explained Like You’re 10 Years Old

HTML, CSS, and JavaScript Explained Like You’re 10 Years Old When you make a web page, you use three main tools: HTML, CSS, and JavaScript. But many beginners wonder: “What’s the difference between them?” To make it super easy, let’s explain them using a simple example: building a house. HTML is the “frame of the house” HTML creates the structure and content of a web page. In a house, HTML is like: The walls and pillars The rooms The doors and windows Where everything is placed Without HTML, nothing appears on the page — it’s just an empty lot. CSS is the “design and decoration” CSS controls the look and style of everything HTML built. In a house, CSS is like: Painting the walls Choosing the flooring Decorating rooms Making the windows look stylish CSS makes a website pretty, readable, and organized. JavaScript is the “electricity and machines” JavaScript makes things move and react. In a house, JavaScript is like: Lights turning on when you flip a switch Automatic doors opening Clocks that keep ticking Machines that do things when […]

English Articles

How to Publish a Website for Free: A Beginner’s Guide to GitHub Pages

How to Publish a Website for Free: A Beginner’s Guide to GitHub Pages “ I made a web page… but how do I show it to other people? ” “ I want a link I can open on my phone! ” If that sounds like you, the easiest solution is GitHub Pages. With no server contract, no domain purchase, and no fees, you can publish your website to the world for completely free. What is GitHub Pages? GitHub Pages is a free hosting service for static websites. Cost: Completely free No ads Works by simply uploading an index.html file Generates a public URL you can open on any device It’s the perfect tool for beginners learning web development. Publishing Your Website Takes Only 4 Steps ① Create a GitHub Account It’s free and requires only an email address. Visit https://github.com Create an account (Sign Up) ② Create a Repository (a folder for your site) Log in to GitHub Click the “＋” icon → New repository Name your repository (example: myweb) Select Public Click Create repository This becomes the place where […]

OJapp Tips - Practical PWA & Home Screen UX Lab