-
Notifications
You must be signed in to change notification settings - Fork 22
/
index.html
529 lines (461 loc) · 22.1 KB
/
index.html
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
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
<!DOCTYPE>
<html lang= "en-US">
<head>
<meta http-equiv= "Content-Type" content="text/html’ charset=UTF-8">
<title> Healthcare Determinants </title>
<meta name= "viewport" content= "initial scale=1, width=device-width">
<link href=‘https://fonts.googleapis.com/css?family=Soutce+sans+pro: 400, 300, 600, 700, 300italic, 400italic, 600italic, 700italic’ rel=‘stylesheet’ type=‘text/css’>
<link rel="stylesheet" href="./assets/css/guide.css" media="screen">
</head>
<!--navigation-->
<div class="topNav">
<ul>
<li><a> Home </a></li>
<li><a> Data </a></li>
<li><a> Github </a></li>
<li><a> Contact </a></li>
</ul>
</div>
<!--MAIN CONTENT-->
<body>
<div class= "header">
<h1 class="guide-section-title"> Healthcare Determinants </h1>
</div>
<div class="guide">
<div class= "guide-section" id="problem">
<h2 class="guide-section-title"> The Problem </h2>
<p>Our current health systems main focus is on clinical care. However, it is necessary to view health as a holistic measure of an individual’s entire living situation and life experience.</p>
<p>The determinants of health extend far beyond medical care and can be used to improve patient care within both the clinical and public health space.</p>
</div>
<hr>
<!--Explore the Determinants-->
<div class= "guide-section" id="explore_det">
<h2 class="guide-section-title"> Explore the Determinants </h2>
<img src="./assets/images/SDoH_simple.png" alt="Determinants of Health Visual" class="centerImage">
</div>
<!--The Determinants-->
<div>
<h4>The Determinants</h4>
<p>The determinants of health act as a holistic way for clinicians and patients to view how different aspects of our lives affect our health.</p>
<p>After collecting over 160 metrics from 10 different healthcare organizations, we were able to break down the determinants into five separate groups, as well as determine their affect on health.</p>
</div>
<!--Individual Behavior-->
<div>
<h4>Individual Behavior</h4>
<p>Our individual behavior affects us the most with a 38% stake in our overall health. From our psychological assets to our sleep patterns to our anxiety levels, the behavior we exhibit each day is a critical determinant for our physical and mental health and well being.</p>
<p>The individual behavior determinant is divided into 7 macrodeterminant categories, 15 microdeterminants, and is supported by 13 recorded metrics. </p>
</div>
<!--IB drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip5").click(function(){
$("#panel5").slideDown("slow");
});
});
</script>
<style>
#panel5, #flip5 {
padding: 5px;
text-align: center;
}
#panel5 {
padding: 5px;
display: none;
}
</style>
<div id="flip5"><h6>View the divisions</h6></div>
<div id="panel5">
<h3>Individual Behavior</h3>
<p>Below is the break down of the individual behavior determinant listing the macrodeterminants and their related microdeterminants and metrics. </p>
<ul>Psychological Assets</ul>
<ul><a>-Consciouentiousness level</a></ul>
<ul><a>-Self-efficacy</a></ul>
<ul><a>-Optimism level</a></ul>
<ul><a>-Life Satisfaction level </a></ul>
<ul><a>-Cognitive function in late life</a></ul>
<ul>Negative Mood and Affects</ul>
<ul><a>-Stress level </a></ul>
<ul><a>-Hopelessness level </a></ul>
<ul><a>-Anxiety level </a></ul>
<ul><a>-Depression level </a></ul>
<ul>Other Risk Related Behaviors</ul>
<ul><a>-Gun Behavior</a></ul>
<ul><a>-Sexual Activity</a></ul>
<ul><a>-Motor vehicle behavior</a></ul>
<ul>Physical Activity</ul>
<ul>Sleep Patterns</ul>
<ul>Diet Patterns</ul>
</div>
<!--Social Circumstances-->
<div>
<h4>Social Circumstances</h4>
<p>The social circumstances we grew-up in, as well as the circumstances of our adult lives form a 23% stake in our overall health. An individual’s social status, early childhood development and culture all impact our social development and our personal health.</p>
<p>The social circumstances determinant is divided into 11 macrodeterminant categories, 14 microdeterminants and is supported by 7 recorded metrics.</p>
</div>
<!--SC drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip6").click(function(){
$("#panel6").slideDown("slow");
});
});
</script>
<style>
#panel6, #flip6 {
padding: 5px;
text-align: center;
}
#panel6 {
padding: 30px;
display: none;
}
</style>
<div id="flip6"><h6>View the divisions</h6></div>
<div id="panel6">
<h3>Social Circumstances</h3>
<p>Below is the break down of the social circumstances determinant listing the macrodeterminants and their related microdeterminants and metrics. </p>
<ul>Social Connectedness</ul>
<ul><a>-Civic participation </a></ul>
<ul><a>-Intimate relationships </a></ul>
<ul><a>-Quality of family support </a></ul>
<ul><a>-Quality of friends support</a></ul>
<ul><a>-Quality of community support</a></ul>
<ul>Social Status</ul>
<ul><a>-Subjective Social Status </a></ul>
<ul><a>-Individual income level </a></ul>
<ul><a>-Language and literary level</a></ul>
<ul><a>-Education level</a></ul>
<ul><a>-Occupation</a></ul>
<ul>Culture and Tradition</ul>
<ul><a>-Religious involvement</a></ul>
<ul><a>-Community cultural norms</a></ul>
<ul><a>-Family cultural norms </a></ul>
<ul>Citizenship Status</ul>
<ul>Sexual Orientation</ul>
<ul>Military Service</ul>
<ul>Gender Identity</ul>
<ul>History of Incarceration</ul>
<ul>Discrimination</ul>
<ul>Work Conditions</ul>
</div>
<!--Genetics and Biology-->
<div>
<h4>Genetics and Biology</h4>
<p>From a genomic standpoint, undertanding our genetic make-up is important when it comes to our overall health, but it is not cost effective to sequence everyone’s genome at this point in time. Beyond genetics, our physical body structure and function also contribute to our health, resulting in a 21% total impact.</p>
<p>The genetics and biology determinant is divided into 3 macrodeterminant categories, 15 microdeterminants, and is supported by 12 recorded metrics. </p>
</div>
<!--GB drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip7").click(function(){
$("#panel7").slideDown("slow");
});
});
</script>
<style>
#panel7, #flip7 {
padding: 5px;
text-align: center;
}
#panel7 {
padding: 30px;
display: none;
}
</style>
<div id="flip7"><h6>View the divisions</h6></div>
<div id="panel7">
<h3>Genetics and Biology</h3>
<p>Below is the break down of the genetics and biology determinant listing the macrodeterminants and their related microdeterminants and metrics. </p>
<ul>Genetics</ul>
<ul><a>-Single-gene </a></ul>
<ul><a>-Chromosomal </a></ul>
<ul><a>-Multifactorial </a></ul>
<ul><a>-Mitochondrial DNA-linked </a></ul>
<ul><a>-Gender </a></ul>
<ul><a>-Race and Ethnicity </a></ul>
<ul>Body Structure</ul>
<ul><a>-Age </a></ul>
<ul><a>-Height</a></ul>
<ul><a>-Weight</a></ul>
<ul><a>-Waist-Hip ration </a></ul>
<ul>Body Function</ul>
<ul><a>-Bone density</a></ul>
<ul><a>-Blood pressure </a></ul>
<ul><a>-Nutritional status </a></ul>
<ul><a>-Biochemical function </a></ul>
<ul><a>-Sensory function </a></ul>
<ul><a>-Movement and balance</a></ul>
<ul><a>-Strength and robustness </a></ul>
<ul><a>-Fitness </a></ul>
</div>
<!--Medical Care-->
<div>
<h4>Medical Care</h4>
<p>As a country, we solely rely on medical data when creating health records for patients. However, most people fail to realize that clinical care only contributes to a small portion of our overall health (11%). While this determinant is still important, it shouldn’t be the only measure used.</p>
<p>The medical care determinant is divided into 4 macrodeterminant categories, 6 microdeterminants, and is supported by 3 recorded metrics.</p>
</div>
<!--MC drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip9").click(function(){
$("#panel9").slideDown("slow");
});
});
</script>
<style>
#panel9, #flip9 {
padding: 5px;
text-align: center;
}
#panel9 {
padding: 30px;
display: none;
}
</style>
<div id="flip9"><h6>View the divisions</h6></div>
<div id="panel9">
<h3>Medical Care</h3>
<p>Below is the break down of the medical care determinant listing the macrodeterminants and their related microdeterminants and metrics. </p>
<ul>Access to Healthcare</ul>
<ul><a>-Distance to resources </a></ul>
<ul><a>-Provider availability </a></ul>
<ul><a>-Vaccines and immunizations </a></ul>
<ul><a>-Quality of insurance </a></ul>
<ul>Quality of Healthcare</ul>
<ul><a>-Provider linguistic competancy </a></ul>
<ul><a>-Provider cultural competancy </a></ul>
<ul>Patient Engagement</ul>
<ul>Health Literacy</ul>
</div>
<!--Physical Environment-->
<div>
<h4>Physical Environment</h4>
<p>From the infrastructure of our cities to the quality of the air we breathe, the physical environment is a important factor that contributes to our health, but it has the smallest impact at only 7%.</p>
<p>The physical environment determinant is divided into 4 macrodeterminant categories, 16 microdeterminants, and is supported by 4 recorded metrics.</p>
</div>
<!--PE drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip10").click(function(){
$("#panel10").slideDown("slow");
});
});
</script>
<style>
#panel10, #flip10 {
padding: 5px;
text-align: center;
}
#panel10 {
padding: 30px;
display: none;
}
</style>
<div id="flip10"><h6>View the divisions</h6></div>
<div id="panel10">
<h3>Physical Environment</h3>
<p>Below is the break down of the physical environment determinant listing the macrodeterminants and their related microdeterminants and metrics. </p>
<ul>Pollution</ul>
<ul><a>-Tobacco use exposure </a></ul>
<ul><a>-Air quality</a></ul>
<ul><a>-Lead exposure levels </a></ul>
<ul><a>-Carcinogen exposure </a></ul>
<ul><a>-Water quality </a></ul>
<ul>Location</ul>
<ul><a>-Access to healthy foods</a></ul>
<ul><a>-Crime level </a></ul>
<ul><a>-Transportation quality </a></ul>
<ul><a>-Crowding conditions</a></ul>
<ul><a>-Job opportunities </a></ul>
<ul><a>-Public space quality</a></ul>
<ul><a>-Educational opportunities </a></ul>
<ul><a>-Access to vocational training </a></ul>
<ul><a>-Recreational activity access</a></ul>
<ul><a>-Walkability </a></ul>
<ul><a>-Residence quality </a></ul>
<ul>Exposure to Firearms</ul>
<ul>Allergens</ul>
</div>
<!--Poster buy-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip").click(function(){
$("#panel").slideDown("slow");
});
});
</script>
<style>
#panel, #flip {
padding: 5px;
text-align: center;
background-color: #87C9D9;
}
#panel {
padding: 50px;
display: none;
}
</style>
<div id="flip"><h3>Buy the SDoH Poster</h3></div>
<div id="panel"><p>The SDoH poster is available for purchase for $150. The poster comes framed and is printed at 24"x 36"</p><p> Buy Now</p></div>
<!--Poster download-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip2").click(function(){
$("#panel2").slideDown("slow");
});
});
</script>
<style>
#panel2, #flip2 {
padding: 5px;
text-align: center;
background-color: #87C9D9;
}
#panel2 {
padding: 50px;
display: none;
}
</style>
<div id="flip2"><h3>Download the Free PDF </h3></div>
<div id="panel2"><p>Download: SDoH-poster.jpg</p></div>
<!--Methodology-->
<div class= "guide-section" id="methodology">
<h2 class="guide-section-title"> Methodology </h2>
<p>A list of determinants were collected from 10 different health organizations and were used to create a single combined list of determinants.</p>
<p>The following categories of health determinants were chosen due to their consistency across most organizations: genetics, medical care, social circumstances, environment, and individual behavior. </p>
<p>The relative contribution of each of the determinant categories to one’s health was found by averaging the estimated values referenced by each primary source. </p>
</div>
<!--About the Data drop down-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip4").click(function(){
$("#panel4").slideDown("slow");
});
});
</script>
<style>
#panel4, #flip4 {
padding: 5px;
text-align: center;
}
#panel4 {
padding: 30px;
display: none;
}
</style>
<div id="flip4"><h6>About this data</h6></div>
<div id="panel4">
<h3>Studied Health Organizations</h3>
<ul>-National Institute of Health</ul>
<ul>-National Committee for Quality Assurance</ul>
<ul>-Group Health</ul>
<ul>-National Committee on Vital and Health Statistics</ul>
<ul>-Capital BlueCross</ul>
<ul>-Kentucky Cabinet for Health and Family Services</ul>
<ul>-College of Nursing and Health, Wright State University</ul>
<ul>-National Academy of Scienes</ul>
<ul>-Corepoint Health</ul>
<ul>-Care First</ul>
<h3> The Math Behind the Determinants</h3>
<p>Each determinant category was then averaged based on the values from each of the aforementioned sources. </p>
<ul><a>Behavior: (50 + 38 + 40 + 39 + 36 + 45 + 30) / 6 = 46.33 </a></ul>
<ul><a>Social: (15 + 40) / 2 = 27.5. Genetics: (20 + 30) / 2 = 25</a></ul>
<ul><a>Environment: (20 + 7 + 5 + 5.4 + 3 + 10) / 6 = 8.4</a></ul>
<ul><a>Medical care: (10 + 10 + 20) / 3 = 13.33</a></ul>
<p>The ratio for each determinant was then found by taking the average values found for each of the determinant categories and dividing them by the total determinant value. </p>
<ul><a>Behavior: 46.33 / 120.56 = 38.43%</a></ul>
<ul><a>Social: 27.5 / 120.56 = 22.81%</a></ul>
<ul><a>Genetics: 25 / 120.56 = 20.74%</a></ul>
<ul><a>Environment: 8.4 / 120.56 = 7%</a></ul>
<ul><a>Medical care: 13.33 / 120.56 = 11.06%. 38.43 + 22.81 + 20.74 + 7 + 11.06 = 100.4%1</a></ul>
<p> The final percentages are as follows. </p>
<ul>Behavioral determinants at 38%</ul>
<ul>Social determinants at 23%</ul>
<ul>Genetic determinants at 21%</ul>
<ul>Medical care determinants at 11%</ul>
<ul>Environmental determinants at 7%</ul>
</div>
<hr>
<!--Applications-->
<div class= "guide-section" id="application">
<h2 class="guide-section-title"> Applications </h2>
<p> The implementation of the determinants of healthcare would improve public health across the nation. By having healthcare workers take greater care in learning about a patient’s life experience and understanding how these experiences impact their overall health will result in better treatment and diagnoses. </p>
<p>The determinants of healthcare will also help establish a standard health record (SHR) that all medical personnel would use when meeting with patient’s. The creation of a SHR would greatly help with public research on population health, as well as the healthcare system as a whole. The SHR would also result in massive amounts of data that would be available for clinicians, students, patients and laboratories across the country. </p>
</div>
</div>
<!--The Data-->
<div class="header">
<h1 class="guide-section-title"> The Data </h1>
</div>
<!--Behind the Determinants-->
<div class="guide">
<div class="container">
<div class= "guide-section" id="behind">
<h2 class="guide-section-title"> Behind the Determinants </h2>
<p>We collected a list of metrics from 10 separate health care organizations relating to the data they think is critical to be part of the patient’s health record. However, there was no consistency in the metrics used by these organizations: out of the total 169 recorded metrics, only 58 of them overlapped.</p>
<div class="component">
<ul>80% of the organizations asked for a list of medications</ul>
<uL>50% asked for marital status </ul>
<ul>40% asked for education level </ul>
<ul>30% asked for race/ethnicity </ul>
<ul>10% asked about an individual’s financial status</ul>
</div>
</div>
<hr>
<!--Explore the Data-->
<div class= "guide-section" id="explore_dat">
<h2 class="guide-section-title"> Explore the Data </h2>
<img src="./assets/images/data_simple.png" alt="Collected Metrics Visual" align=middle>
<p>Each point on the circle correlates with a metric that was included in an organization’s health record. Each color represents one of the ten organizations we studied for this project.</p>
<p>To view the entire interactive data visual, please visit our desktop site. </p>
</div>
<!--Data Accesss-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip3").click(function(){
$("#panel3").slideDown("slow");
});
});
</script>
<style>
#panel3, #flip3 {
padding: 5px;
text-align: center;
background-color: #87C9D9;
}
#panel3 {
padding: 50px;
display: none;
}
</style>
<div id="flip3"><h3>Download the Data Set</h3></div>
<div id="panel3"><p>Download: SDoH-metrics.xl</p></div>
<!--Contact US-->
<div class= "header">
<h1 class="guide-section-title"> Contact Us </h1>
</div>
<div class="guide">
<div class="container">
<div class= "guide-section" id="contact">
<h2 class="guide-section-title"> Get in Touch! </h2>
<p>If you would like to learn more about the Healthcare Determinants, or would like to find out about other resources available to implement the determinants in your work place, please send us a message!</p>
<div class="component">
<ul> Involution Studios </ul>
<ul>Phone: 617-803-7073 </ul>
<ul>Email: [email protected] </ul>
<ul>Address: 661 Massachusetts Ave, 3rd Floor, Arlington, MA, 02476</ul>
</div>
</div>
</div>
</div>
</body>
</html>