bytegravity.github.io/index.html at master · bytegravity/bytegravity.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="keywords" content="字节引力,万维广告,AdWork,广告联盟,开发者广告,泛文娱广告">
    <meta name="description" content="字节引力（天津）科技有限公司 - 运营万维广告与AdWork两大差异化广告网络联盟，覆盖toB与toC受众">
    <title>字节引力（天津）科技有限公司 | ByteGravity</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <!-- 鼠标光晕 -->
    <div class="cursor-glow" id="cursorGlow"></div>

    <!-- 星空背景 -->
    <div class="stars-container" id="stars"></div>

    <!-- 引力场效果 -->
    <div class="gravity-field">
        <div class="gravity-core"></div>
        <div class="gravity-ring"><div class="orbit-particle"></div></div>
        <div class="gravity-ring"><div class="orbit-particle"></div></div>
        <div class="gravity-ring"><div class="orbit-particle"></div></div>
        <div class="gravity-ring"><div class="orbit-particle"></div></div>
        <div class="gravity-ring"><div class="orbit-particle"></div></div>
    </div>

    <!-- 主容器 -->
    <div class="main-container">
        <!-- 英雄区域 -->
        <section class="hero">
            <div class="hero-content">
                <h1 class="logo-text">字节交汇，皆有引力</h1>
                <p class="logo-english">ByteGravity</p>
                <p class="tagline">
                    我们运营 toB 与 toC 两大差异化广告网络<br>让品牌与媒体的每一个字节都拥有强大的传播引力
                </p>
                <div class="cta-buttons">
                    <a href="https://wwads.cn" target="_blank" class="cta-btn secondary">
                        <span>万维广告</span>
                    </a>
                    <a href="https://adwork.net" target="_blank" class="cta-btn secondary">
                        <span>AdWork</span>
                    </a>
                </div>
            </div>
            <div class="scroll-indicator"></div>
        </section>

        <!-- 数据统计 -->
        <section class="stats-section fade-in">
            <div class="stats-grid">
                <div class="stat-item">
                    <div class="stat-number" data-target="4" data-suffix="亿+">0</div>
                    <div class="stat-label">月均曝光人次</div>
                </div>
                <div class="stat-item">
                    <div class="stat-number" data-target="40" data-suffix="%+">0</div>
                    <div class="stat-label">客户续费率</div>
                </div>
                <div class="stat-item">
                    <div class="stat-number" data-target="200" data-suffix="+">0</div>
                    <div class="stat-label">优质媒体合作</div>
                </div>
                <div class="stat-item">
                    <div class="stat-number" data-target="7" data-suffix="年">0</div>
                    <div class="stat-label">深耕广告领域</div>
                </div>
            </div>
        </section>

        <!-- 产品区域 -->
        <section class="products-section">
            <h2 class="section-title fade-in">两大广告网络</h2>
            <p class="section-subtitle fade-in">覆盖 toB 与 toC 双赛道，助力品牌精准触达目标受众</p>

            <div class="products-grid">
                <!-- 万维广告 -->
                <div class="product-card wwads fade-in-left">
                    <div class="product-icon">
                        <img src="wwads-logo.svg" alt="万维广告" class="product-logo">
                    </div>
                    <span class="product-target">toB 受众</span>
                    <div class="product-stats">月曝光量过亿</div>
                    <p class="product-desc">
                        聚合 CSDN、Vue.js 等上百家主流开发者社区与技术站点，
                        覆盖超过 80% 中国开发者受众的独家广告网络。
                        从创业公司到 AWS、阿里云、腾讯云等世界 500 强企业，都在通过万维广告触达专业受众。
                    </p>
                    <a href="https://wwads.cn" target="_blank" class="product-link">访问官网</a>
                </div>

                <!-- AdWork -->
                <div class="product-card adwork fade-in-right">
                    <div class="product-icon">
                        <img src="adwork-logo.svg" alt="AdWork" class="product-logo">
                    </div>
                    <span class="product-target">toC 受众</span>
                    <div class="product-stats">月均曝光量 3 亿+</div>
                    <p class="product-desc">
                        面向高活跃度的 C 端泛文娱用户，
                        覆盖影视、游戏、兴趣社区等 toC 场景流量资源，
                        通过机器学习算法，助力品牌高效触达年轻活跃的消费群体。
                    </p>
                    <a href="https://adwork.net" target="_blank" class="product-link">访问官网</a>
                </div>
            </div>
        </section>

        <!-- 关于区域 -->
        <section class="about-section">
            <div class="about-content fade-in">
                <h2 class="section-title">关于我们</h2>
                <p class="about-text">
                    自 2019 年以来，字节引力团队专注于帮助品牌提升<span class="highlight">分发效率</span>，
                    通过机器学习算法和数据驱动实现流量高效匹配，让品牌更高效触达目标受众。
                    我们的两大广告网络覆盖 <span class="highlight">专业技术人群</span> 与
                    <span class="highlight"> 泛文娱用户</span> 两大核心群体，为广告主提供差异化的精准营销解决方案。
                </p>
            </div>
        </section>

        <!-- 页脚 -->
        <footer>
            <div class="footer-content">
                <p class="copyright">
                    © 2019 - 2026 字节引力（天津）科技有限公司 |
                    <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">津ICP备19006850号-4</a>
                </p>
            </div>
        </footer>
    </div>

    <script src="main.js"></script>
</body>
</html>