English Articles

    How to Create Home Screen Icons for iPhone & Android (Tools Compared)

    How to Create Home Screen Icons for iPhone & Android (Tool Comparison Guide) If you want a fully customized and unified Home Screen, the first method you’ll see online is usually “Create icons with Canva.” However, Canva is not the best choice for every situation. The ideal method depends on what kind of icon you want to create. This guide explains how to create Home Screen icons step-by-step and compares Canva, photo apps, and specialized tools so you can choose the easiest method for your goal. Recommended Image Size for Home Screen Icons To ensure clean, sharp icons on both iPhone and Android, use: 1024 × 1024 px (recommended) Minimum: 512 × 512 px PNG format (transparent background supported) iPhone automatically rounds the corners, so leave your image as a square—no need to add rounding yourself. Three Main Ways to Create Home Screen Icons Here are the three most common approaches, depending on your needs. ① Canva (Best for design-heavy icons) Canva offers a huge variety of templates, making it great for icon sets that share the same vibe. Pros […]

    English Articles

      iPhone “Add to Home Screen” Missing? How to Fix It in Safari【2026】

      ” You want to add a website to your iPhone home screen, but “Add to Home Screen” is nowhere to be found. Maybe you can see the Share button, but the option is missing. Or perhaps you successfully added the site, but the icon looks wrong. In some cases, tapping the new icon opens the website’s home page instead of the page you originally added. These problems do not all have the same cause. In particular, if “Add to Home Screen” is missing, there is one simple thing worth checking before investigating PWA settings or assuming something is broken: what exactly are you sharing? This guide goes through the common reasons “Add to Home Screen” may not appear on an iPhone, starting with things users can check immediately and then moving into website and PWA configuration issues. First: Where is “Add to Home Screen” on iPhone? To add a website to your iPhone home screen, open the page you want in Safari and use the Share menu for that web page. Open the web page you want to add in […]

      English Articles

        How to Add Any Website to Your Home Screen on iPhone and Android

        How to Add Any Website to Your Home Screen on iPhone and Android Sometimes you think, “I open this page every day—why do I have to search for it each time?” This guide explains, in the simplest way possible, how to use the standard “Add to Home Screen” feature on both iPhone (Safari) and Android (Chrome). We also cover why icons often become the platform’s logo and what to do if you want full control over the icon. How to Add a Website to the Home Screen on iPhone (Safari) Open the page in Safari Tap the Share button (□↑) at the bottom Select Add to Home Screen Confirm the name and tap Add Your Home Screen icon is now created. Why You Can’t Change the Icon Freely on iPhone Safari looks for the website’s apple-touch-icon file when generating the Home Screen icon. That means platforms like: Medium → Medium’s “M” logo Shopify → Shopify bag icon Etsy → Etsy “E” logo will always display their own branding— not yours—when added to the Home Screen. How to Add a Website […]

        English Articles

          How to Change Home Screen Icons Without Using Shortcuts on iPhone

          How to Change Home Screen Icons Without Using Shortcuts When adding a website to the iPhone Home Screen using “Add to Home Screen,” the icon is usually determined by the website itself—meaning users cannot freely choose their own image. However, with OJapp, you can change the Home Screen icon and app name without using the Shortcuts app. Why You Normally Can’t Change Home Screen Icons Most websites define their own icons for Home Screen installation. For example: Medium → Medium’s “M” icon Shopify → Shopify’s bag icon Etsy → Etsy’s “E” logo This is due to a standard Safari mechanism: iOS reads the apple-touch-icon specified by the site and uses it automatically. As a result, even if you add your personal blog, portfolio, or shop, all icons end up showing the platform’s branding instead of your own. This can make your Home Screen look inconsistent. The Problem With the Common “Shortcuts Method” Yes—using the Shortcuts app allows you to set a custom icon. But it has several drawbacks: Too many steps; confusing for beginners Difficult to share or recreate for […]

          English Articles

            Why Shopify or Etsy Icons Change When You Add a Shop to Your Home Screen

            Why Shopify or Etsy Shop Icons Change When Added to the Home Screen If you run an online shop on platforms like Shopify or Etsy, you may have noticed something frustrating: **“When customers add my shop to their iPhone Home Screen, the icon becomes the Shopify/Etsy logo instead of my brand.”** In this article, we explain why your shop cannot use its own icon by default and how you can let customers add your shop to their Home Screen using your own branding. Why Shopify and Etsy Icons Don’t Use Your Shop Logo When an iPhone user selects “Add to Home Screen,” Safari looks for a specific file on the website: apple-touch-icon This file determines the icon shown on the Home Screen. Because Shopify and Etsy set this icon at the **platform level**, the Home Screen icon becomes: Shopify → the Shopify default icon Etsy → the Etsy logo Your shop page is treated as a part of the platform—not an independent website— so iOS does not use a shop-specific icon. Why This Is a Problem for Shop Owners Having […]

            English Articles

              Shortcut Method vs OJapp: Which Is the Best Way to Add Custom Icons to Your iPhone Home Screen?

              Shortcut Method vs OJapp: A Complete Comparison for Custom iPhone Icons When it comes to customizing iPhone Home Screen icons, the most well-known solution is using the **Shortcuts app**. However, many users quickly notice that the Shortcut method can be confusing, slow, and difficult to recommend to others. In this guide, we compare the Shortcut method and the OJapp approach across five key factors— ease of setup, shareability, speed, consistency, and safety— to help you understand which method is better for your needs. What Is the Shortcut Method? The Shortcut method uses the built-in iOS “Shortcuts” app to create a custom icon that launches a URL or app via an automation-like shortcut. While highly customizable, it comes with several drawbacks—especially for beginners. Advantages of the Shortcut Method Allows complete freedom when choosing icons Uses built-in iOS functionality—no installation required Supports URL schemes for opening apps directly It works especially well for people who want to **retheme their entire Home Screen with matching icons**. Disadvantages of the Shortcut Method Setup is complicated and hard for beginners Shortcuts cannot be shared as […]

              English Articles

                Shortcut vs Web App vs OJapp: A Complete Comparison for Home Screen Icon Customization

                Shortcut vs Web App vs OJapp — A Complete Comparison When adding a website to your iPhone or Android home screen, there are actually three major methods: ① Shortcut Method (iPhone’s automation-based icon customization) ② Standard Web App “Add to Home Screen” ③ OJapp Method (custom icon + custom name + sharable setup) This article organizes what each method can and cannot do, so you can choose the best option for your purpose. ① What Is the Shortcut Method? Using the iPhone’s built-in “Shortcuts” app, you can create a pseudo-app with any icon and any name you like. Pros Full freedom to choose the icon You can rename it to anything Great for people who want to unify their home screen theme Cons Setup is complicated, especially for beginners Cannot be shared — the other person must recreate it manually A Shortcut screen flashes briefly on launch You must recreate everything when changing devices → Good for personal use, but too much hassle to recommend to others. ② Standard Web App “Add to Home Screen” This is the simplest way, […]

                OJapp Tips　 - 　PWA・ホーム画面追加の実機検証ブログ

                OJapp Tips - Practical PWA & Home Screen UX Lab

                OJapp Tips is a technical blog documenting real-world PWA behavior, iPhone Safari quirks, home screen installation, manifest.json, Service Worker, Web App Manifest, WebClip, icon cache issues, and practical web development tips based on actual testing with iPhone, Android, and PC.

                The articles are based on hands-on experiments from PWA LAB and real development experience with OJapp, Petal, and OJ-Pass. Instead of only repeating official documentation, OJapp Tips focuses on the details developers actually get stuck on.