-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
227 lines (186 loc) · 8.33 KB
/
index.html
File metadata and controls
227 lines (186 loc) · 8.33 KB
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
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Geopolitical Speech Lab</title>
<!-- Font Awesome for icons -->
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
/>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700;800&family=Source+Serif+4:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css?v=2" />
<!-- Plotly (only include if you actually use it on this page) -->
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<!-- Header / Nav -->
<header class="site-header">
<nav class="nav">
<a class="brand" href="index.html">
<span class="brand-main">Geopolitical Speech Lab</span>
</a>
<ul class="nav-links">
<li><a class="active" href="index.html">Home</a></li>
<li><a href="insights/insights.html">Insights</a></li>
<li><a href="data-page/alldata.html">Data</a></li>
<li><a href="faq/faq.html">FAQ</a></li>
<li><a href="our-team/our-team.html">The Team</a></li>
</ul>
</nav>
</header>
<!-- Hero -->
<header class="hero">
<div class="hero-bg-wrap" aria-hidden="true">
<img src="images/Xi.jpg" alt="Xi Jinping making a speech" class="hero-bg">
<div class="hero-overlay"></div>
</div>
<div class="hero-inner">
<h1 class="hero-title">What leaders say—and don’t say—matters.</h1>
<h3 class="hero-desc">
We built a structured dataset of official speeches from China and Russia
<br>to support search and visual analysis of the language, themes, and trends shaping great power politics.</br>
</h3>
<div class="hero-ctas">
<a class="btn primary" href="insights/insights.html">Explore Insights →</a>
<a class="btn ghost" href="data-page/alldata.html">See the Data →</a>
</div>
</div>
</header>
<main>
<section class="pro-banner" aria-label="Dataset scale">
<div class="pro-banner__inner">
<p class="pro-banner__eyebrow">OFFICIAL SPEECHES, STRUCTURED FOR ANALYSIS</p>
<h2 class="pro-banner__headline">
<span class="u-underline">993 </span> China Ministry of Foreign Affairs speeches (2005–2025) and
<span class="u-underline">3,204 </span> Russia Foreign Minister speeches, interviews, and appearances
(late 2013–2025), prepared for search and text analysis.
</h2>
</div>
</section>
<!-- Entities Comparison Section -->
<section class="entities-section">
<div class="entities-container">
<!-- Header row: title + dropdown -->
<div class="entities-header">
<h3 class="entities-title">Top</h3>
<div class="entities-control">
<select id="entitiesMetric" class="entities-select">
<option value="entities" selected>Entities*</option>
<option value="noun-phrases">Noun Phrases*</option>
</select>
</div>
<h3 class="entities-title">in Chinese and Russian Diplomatic Communications</h3>
</div>
<!-- Two columns -->
<div class="entities-country" data-country="china">
<h4 class="country-title">China</h4>
<div class="entity-bars"></div>
</div>
<div class="entities-country" data-country="russia">
<h4 class="country-title">Russia</h4>
<div class="entity-bars"></div>
</div>
<!-- Data note -->
<div class="entities-data-note">
*For explanations of data terms, see <a href="data/Data_Dictionary.pdf" class="data-note-link">the Data Dictionary</a>.
</div>
</div>
</section>
<section class="pp-band" id="overview">
<div class="pp-wrap">
<div class="pp-left">
<div class="pp-kicker">OVERVIEW</div>
<h2 class="pp-title">
Curated insights and tools<br />
to generate your own.
</h2>
<p class="pp-lede">
Geopolitical Speech Lab transforms thousands of official speeches into structured,
searchable data and interactive visualizations—so you can trace language patterns
over time with clarity and consistency.
</p>
<p class="pp-lede">
Rather than reading speeches one by one, you can compare how China and Russia
prioritize key issues, track shifts in emphasis across years, and interpret rhetorical
change in the context of global events.
</p>
</div>
<div class="pp-right">
<div class="pp-metrics">
<div class="pp-metric">
<div class="pp-num">4,000+</div>
<div class="pp-label">speeches analyzed</div>
</div>
<div class="pp-metric">
<div class="pp-num">2</div>
<div class="pp-label">countries covered</div>
</div>
<div class="pp-metric">
<div class="pp-num">67</div>
<div class="pp-label">keywords tracked</div>
</div>
<div class="pp-metric">
<div class="pp-num">2005–2025</div>
<div class="pp-label">coverage window</div>
</div>
</div>
</div>
</div>
</section>
<!-- 2) Dataset scale -->
<!-- 4) Audience section -->
<section class="audience-pro">
<p class="audience-eyebrow">For students, researchers, and practicioners.</p>
<h2 class="audience-title">
<br> Our Tools
</h2>
<div class="accent-bar"></div>
<div class="three-box-grid">
<div class="three-box">
<h3 class="three-box-title"><a href="data-page/alldata.html" class="box-link">Searchable, Downloadable Database of Speeches</a></h3>
<p class="three-box-desc">Sourced directly from China Ministry of Foreign Affairs and Russia Foreign Minister speeches, updated through 2025.</p>
</div>
<div class="three-box">
<h3 class="three-box-title"><a href="insights/insights.html" class="box-link">Vizualizations of Keywords over Time.</a></h3>
<p class="three-box-desc">Frequency analysis and comparative language patterns you can explore and track across years and major global events.</p>
</div>
<div class="three-box">
<h3 class="three-box-title"><a href="data-page/alldata.html" class="box-link">Aggregated Counts of Entities and Noun Chunks per Country</a></h3>
<p class="three-box-desc">SpaCy-powered text analysis to demonstrate the countries, organizations, and topics that dominate diplomatic discourse.</p>
</div>
<div class="three-box">
<h3 class="three-box-title"><a href="insights/insights.html#tfidf-section" class="box-link">Term Frequency-Inverse Document Frequency Statistics</a></h3>
<p class="three-box-desc">See the most frequently used terms in each country's speeches, weighted by their importance across the corpus using NLTK.</p>
</div>
</div>
</section>
<!-- 5) Example / proof section (re-using your screenshot block) -->
<section class="band band-proof" id="example">
<div class="band-inner">
<p class="band-kicker">Example</p>
<h2 class="band-title">Russia Mentions of BRICS over Time</h2>
<div class="screenshot-container">
<img src="images/RUBRICS.png" alt="Platform screenshot" class="screenshot-image">
<div class="screenshot-description">
<p>
After the full-scale invasion of Ukraine, BRICS featured significantly more prominently in the speeches of
Russian Foreign Minister Sergei Lavrov. By 2024, roughly 30 percent of his speeches and public appearances
featured references to BRICS, potentially reflecting Russia’s priority of promoting alternatives to
Western-led institutions and aligning itself with other emerging powers representative of the “global
majority” in an emerging multipolar international system.
</p>
</div>
</div>
</div>
</section>
</main>
<!-- Back to Top Button -->
<a id="back-to-top" href="#" class="back-to-top">↑ Back to Top</a>
<script src="index.js"></script>
</body>
</html>