diff --git a/data/.DS_Store b/data/.DS_Store
index 5670e83..17b8034 100644
Binary files a/data/.DS_Store and b/data/.DS_Store differ
diff --git a/frontend/app.js b/frontend/app.js
index 7a99e7b..776f0a9 100644
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -468,12 +468,21 @@ async function updateComparisonChart() {
 }
 
 function updateComparisonTable(comparison, metric, years) {
-    // Build header
+    const firstYear = years[0];
+    const lastYear = years[years.length - 1];
+    const prevYear = years.length > 1 ? years[years.length - 2] : null;
+    
+    // Build header with explicit year ranges
     let headerHtml = '<th>School</th>';
     years.forEach(year => {
         headerHtml += `<th>${year}</th>`;
     });
-    headerHtml += '<th>Change</th>';
+    if (prevYear && prevYear !== firstYear) {
+        headerHtml += `<th title="Change from ${prevYear} to ${lastYear}">Δ 1yr</th>`;
+    }
+    if (years.length > 1) {
+        headerHtml += `<th title="Change from ${firstYear} to ${lastYear}">Δ ${firstYear}→${lastYear}</th>`;
+    }
     elements.tableHeader.innerHTML = headerHtml;
     
     // Build body - iterate in same order as selectedSchools for color consistency
@@ -487,19 +496,34 @@ function updateComparisonTable(comparison, metric, years) {
             yearlyMap[d.year] = d[metric];
         });
         
-        const firstValue = yearlyMap[years[0]];
-        const lastValue = yearlyMap[years[years.length - 1]];
-        const change = firstValue && lastValue ? (lastValue - firstValue).toFixed(2) : 'N/A';
-        const changeClass = parseFloat(change) >= 0 ? 'positive' : 'negative';
+        const firstValue = yearlyMap[firstYear];
+        const lastValue = yearlyMap[lastYear];
+        const prevValue = prevYear ? yearlyMap[prevYear] : null;
+        
+        // Calculate 1-year change
+        const oneYearChange = prevValue != null && lastValue != null ? (lastValue - prevValue) : null;
+        const oneYearChangeStr = oneYearChange !== null ? oneYearChange.toFixed(1) : 'N/A';
+        const oneYearClass = oneYearChange !== null ? (oneYearChange >= 0 ? 'positive' : 'negative') : '';
+        
+        // Calculate total change
+        const totalChange = firstValue != null && lastValue != null ? (lastValue - firstValue) : null;
+        const totalChangeStr = totalChange !== null ? totalChange.toFixed(1) : 'N/A';
+        const totalChangeClass = totalChange !== null ? (totalChange >= 0 ? 'positive' : 'negative') : '';
+        
         const color = CHART_COLORS[index % CHART_COLORS.length];
         
         bodyHtml += `<tr>`;
         bodyHtml += `<td><strong style="border-left: 3px solid ${color}; padding-left: 8px;">${escapeHtml(schoolData.school_info.school_name)}</strong></td>`;
         years.forEach(year => {
             const value = yearlyMap[year];
-            bodyHtml += `<td>${value !== undefined ? formatMetricValue(value, metric) : '-'}</td>`;
+            bodyHtml += `<td>${value != null ? formatMetricValue(value, metric) : '-'}</td>`;
         });
-        bodyHtml += `<td class="${changeClass}">${change !== 'N/A' ? (parseFloat(change) >= 0 ? '+' : '') + change : change}</td>`;
+        if (prevYear && prevYear !== firstYear) {
+            bodyHtml += `<td class="${oneYearClass}">${oneYearChangeStr !== 'N/A' ? (oneYearChange >= 0 ? '+' : '') + oneYearChangeStr : oneYearChangeStr}</td>`;
+        }
+        if (years.length > 1) {
+            bodyHtml += `<td class="${totalChangeClass}">${totalChangeStr !== 'N/A' ? (totalChange >= 0 ? '+' : '') + totalChangeStr : totalChangeStr}</td>`;
+        }
         bodyHtml += `</tr>`;
     });
     elements.tableBody.innerHTML = bodyHtml;