ethicadata/principles.html at main · baberlabs/ethicadata · 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
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
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Principles | EthicaData</title>

    <meta
      name="description"
      content="Learn the core principles of ethical data mining, including fairness, transparency, privacy, and accountability, aligned with UN Sustainable Development Goals."
   >
    <meta name="author" content="Baber Khan">
    <meta name="robots" content="index, follow">

    <!-- Favicon -->
    <link
      rel="shortcut icon"
      href="./images/common/logo_dark.svg"
      type="image/x-icon"
   >

    <!-- 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=Inter:wght@400;600;700&family=Poppins:wght@300;600;900&display=swap"
      rel="stylesheet"
   >

   <!-- Styles -->
    <link rel="stylesheet" href="./styles/styles.css">

    <!-- Scripts -->
    <script src="./scripts/scripts.js" defer></script>
  </head>

  <body>
    <a href="#main" class="skip-link">Skip to content</a>
    <!-- SITE HEADER -->
    <header class="site-header">
      <div class="header-content">
        <a href="./index.html" class="brand" aria-label="EthicaData homepage">
          <img
            class="logo"
            src="./images/common/logo_dark.svg"
            alt="EthicaData logo"
         >
        </a>

        <div class="design-line-wrapper" aria-hidden="true">
          <!-- Alt is intentionally empty for this image as per W3 guidelines -->
          <img
            class="design-line"
            src="./images/common/design-line.svg"
            alt=""
            loading="lazy"
         >
        </div>

        <div class="menu">
          <button
            class="menu-button"
            type="button"
            aria-expanded="false"
            aria-controls="primary-nav"
            aria-label="Toggle navigation"
          >
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
          </button>

          <nav
            id="primary-nav"
            class="nav"
            aria-label="Primary navigation"
            hidden
          >
            <ul>
              <li><a href="./index.html">Home</a></li>
              <li>
                <a href="./principles.html" aria-current="page">Principles</a>
              </li>
              <li><a href="./practice.html">Practice</a></li>
              <li><a href="./references.html">References</a></li>
              <li><a href="./contact.html">Contact</a></li>
            </ul>
          </nav>
        </div>
      </div>
    </header>

    <!-- SITE MAIN CONTENT -->
    <main id="main" class="main-content">
      <!-- SECTION: Principles -->
      <section
        class="page-section principles"
        aria-labelledby="principles-title"
      >
        <header class="principles-header">
          <h1 class="page-title" id="principles-title">Principles</h1>
          <p class="page-subtitle">Doing the right thing with data</p>
          <p>
            Ethical data is not about slowing innovation. It is about designing
            technology that people can trust. Each principle below connects
            everyday data practice to one or more UN Sustainable Development
            Goals (SDGs).
          </p>
        </header>
        <form class="search-form">
          <label for="search" class="sr-only">
            Search for a principle by SDG
          </label>
          <input
            id="search"
            type="text"
            placeholder="Search principles by SDG..."
         >
          <button type="button" aria-label="Search">
            <!-- Image `alt` intentionally left empty because aria-label
             has been provided to the parent button element -->
            <img
              src="./images/principles/magnifier-glass.svg"
              alt=""
              loading="lazy"
           >
          </button>
        </form>
        <dl class="principles-grid">
          <div class="principle-card">
            <dt>
              <span class="principle-serial">1</span>
              <span class="principle-title">
                Contribute to society and human well-being
              </span>
            </dt>
            <dd>
              <p>
                Data projects should serve the public good, not only business
                goals. Mining techniques must improve lives, respect human
                rights, and avoid reinforcing disadvantage.
              </p>
              <div class="sdg-labels">
                <span>SDG 3</span><span>SDG 10</span><span>SDG 16</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">2</span>
              <span class="principle-title">Avoid harm</span>
            </dt>
            <dd>
              <p>
                Before collecting or analysing data, assess possible harms,
                especially privacy loss, bias, or reputational damage, and
                design safeguards to prevent them.
              </p>
              <div class="sdg-labels">
                <span>SDG 3</span><span>SDG 16</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">3</span>
              <span class="principle-title">Be honest and trustworthy</span>
            </dt>
            <dd>
              <p>
                Be transparent about data sources, model limits, and potential
                errors. Never falsify, exaggerate, or conceal results.
              </p>
              <div class="sdg-labels">
                <span>SDG 6</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">4</span>
              <span class="principle-title"
                >Be fair and do not discriminate</span
              >
            </dt>
            <dd>
              <p>
                Detect and correct bias in datasets and algorithms. Ensure
                models work fairly across age, gender, race, and background.
              </p>
              <div class="sdg-labels">
                <span>SDG 10</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">5</span>
              <span class="principle-title">
                Respect creative work and intellectual property
              </span>
            </dt>
            <dd>
              <p>
                When re-using datasets, algorithms, or research, credit the
                creators and follow licenses.
              </p>
              <div class="sdg-labels">
                <span>SDG 9</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">6</span>
              <span class="principle-title">Respect privacy</span>
            </dt>
            <dd>
              <p>
                Collect only the minimum data needed, store it securely, and
                explain how it will be used. Allow people to view, correct, or
                delete their information.
              </p>
              <div class="sdg-labels">
                <span>SDG 3</span><span>SDG 16</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">7</span>
              <span class="principle-title">Honour confidentiality</span>
            </dt>
            <dd>
              <p>
                If you hold sensitive or propriety data, protect it unless
                disclosure is legally or ethically required to prevent harm.
              </p>
              <div class="sdg-labels">
                <span>SDG 16</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">8</span>
              <span class="principle-title"
                >Evaluate systems for quality and risk</span
              >
            </dt>
            <dd>
              <p>
                Audit data-mining systems for accuracy, reliability, and
                unintended side-effects. Report major risks and correct them
                promptly.
              </p>
              <div class="sdg-labels">
                <span>SDG 9</span>
              </div>
            </dd>
          </div>

          <div class="principle-card">
            <dt>
              <span class="principle-serial">9</span>
              <span class="principle-title"
                >Design for security and robustness</span
              >
            </dt>
            <dd>
              <p>
                Strong security is part of ethics. Protect data against misuse
                and update defences as threats evolve.
              </p>
              <div class="sdg-labels">
                <span>SDG 9</span>
              </div>
            </dd>
          </div>
        </dl>

        <p>
          Ethical data mining follows one simple rule:
          <strong>the public good comes first</strong>. By following these
          principles, we connect technology with trust, responsibility, and the
          UN goals for a fair and sustainable digital future.
        </p>

        <a class="button cta-button" href="./contact.html">
          Contact us now for a free assessment
          <span aria-hidden="true">→</span>
        </a>
      </section>
    </main>

    <!-- SITE FOOTER -->
    <footer class="site-footer">
      <!-- Main footer content -->
      <div class="footer-content-container">
        <div class="footer-content">
          <!-- Logo -->
          <a href="./index.html" class="brand" aria-label="EthicaData homepage">
            <img
              class="logo"
              src="./images/common/logo_light.svg"
              alt="EthicaData logo"
           >
          </a>

          <!-- UN SDGs -->
          <figure class="un-sdgs">
            <figcaption class="sr-only">
              United Nations Sustainable Development Goals supported
            </figcaption>
            <img
              src="./images/home/sdg16.svg"
              alt="SDG 16 - Peace, Justice and Strong Institutions"
              loading="lazy"
           >
            <img
              src="./images/home/sdg10.svg"
              alt="SDG 10 - Reduced Inequalities"
              loading="lazy"
           >
            <img
              src="./images/home/sdg9.svg"
              alt="SDG 9 - Industry, Innovation and Infrastructure"
              loading="lazy"
           >
            <img
              src="./images/home/sdg3.svg"
              alt="SDG 3 - Good Health and Well-Being"
              loading="lazy"
           >
          </figure>

          <!-- Footer Navigation -->
          <nav id="footer-nav" class="nav" aria-label="Footer navigation">
            <h2 class="nav-heading">Explore</h2>
            <ul>
              <li><a href="./index.html">Home</a></li>
              <li>
                <a href="./principles.html" aria-current="page">Principles</a>
              </li>
              <li><a href="./practice.html">Practice</a></li>
              <li><a href="./references.html">References</a></li>
              <li><a href="./contact.html">Contact</a></li>
            </ul>
          </nav>

          <!-- Contact Details -->
          <section class="contact-details" aria-labelledby="contact-heading">
            <h2 id="contact-heading">Contact</h2>
            <address>
              <span>Millennium Point</span><br>
              <span>Birmingham City University</span><br>
              <span>Curzon Street</span><br>
              <span>Birmingham B4 7AP</span><br>
            </address>
            <div>
              <a href="tel:+447438234827">(+44) 7438 234 827</a>
              <a href="mailto:baber.khan@mail.bcu.ac.uk">
                baber.khan@mail.bcu.ac.uk
              </a>
              <p class="student-id">Student ID No. 17125325</p>
            </div>
          </section>
        </div>
      </div>

      <!-- Copyright -->
      <p class="copyright">
        Copyright &copy; 2025, EthicaData. All rights reserved.
      </p>
    </footer>
  </body>
</html>