HTML网页移动端测试时图片无法正常显示问题求助

• 最核心原因：你使用的lh3.googleusercontent.com是谷歌用户内容服务的临时生成链接，存在两个致命问题：
  1. 链接自带访问权限校验，默认仅谷歌账号本人登录状态下可访问，且链接存在有效期，过期后自动失效
  2. 国内运营商网络默认无法访问谷歌相关服务，如果你PC端开了代理可正常加载，移动端未走代理的情况下自然无法打开图片
• 次要原因：谷歌资源默认开启防盗链校验，你的站点域名未在允许的跨域访问名单内时，请求会被拦截，部分移动端浏览器对跨域资源的校验规则比PC端更严格，更容易触发拦截
• 代码不规范问题：当前img标签的width属性未加双引号，<img width=35 height="35">的写法虽然大部分浏览器兼容，但极少数老旧移动端浏览器可能解析异常，另外缺失移动端适配的视口meta标签，也可能导致页面渲染异常。

方案1（最推荐，适配国内用户站点） #

将所有图片从谷歌服务下载到本地，上传到你自建站的服务器目录，或者使用国内云厂商的对象存储服务获取公共可访问的直链，替换原有谷歌链接，即可保证全端网络正常加载。
示例修改后的代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 新增移动端视口适配标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>KTWebsite</title>
</head>
<body>
    <div>
        <a href="help">
          <!-- 替换为本地/国内存储的图片链接，属性统一加双引号，补充alt属性 -->
          <img src="./images/your-icon.png" alt="帮助图标" width="35" height="35">
        </a>
    </div>
</body>
</html>

方案2（仅适配面向海外用户的站点） #

1. 进入谷歌相册/谷歌云盘的对应图片设置页面，将图片权限修改为「所有人无需登录即可查看」
2. 生成稳定的公开直链替换原有临时链接，同时确保你的站点用户移动端网络可正常访问谷歌服务
3. 可添加图片加载失败的占位逻辑，避免页面空白：<img src="你的谷歌直链" alt="图标" width="35" height="35" onerror="this.src='本地占位图地址'">

内容的提问来源于stack exchange，提问作者Khang Tèo