Skip to content

Commit 26bdd9b

Browse files
shahidghafoor00shahidghafoor00
committed
Add case studies page and improve SEO rich results
Adds Review schema entries to JSON-LD so client ratings can surface as rich snippets, adds og:image dimensions, and adds lastmod to the sitemap. Adds a new case-studies.html page grouping real client projects by service type, linked from nav/footer and the sitemap, to give the site more indexable content to rank on.
1 parent 79d2bbe commit 26bdd9b

4 files changed

Lines changed: 318 additions & 9 deletions

File tree

‎case-studies.html‎

Lines changed: 290 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,290 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Case Studies — Codebase | Mobile, Web & Custom Software Projects</title>
7+
<meta name="description" content="Real client projects delivered by Codebase across mobile app development, custom software, automation, and enterprise systems — with direct client feedback from Freelancer and Upwork." />
8+
<meta name="keywords" content="software development case studies, mobile app development portfolio, custom software projects, client reviews, Codebase projects" />
9+
<meta name="author" content="Codebase" />
10+
<meta name="robots" content="index, follow" />
11+
<link rel="canonical" href="https://codebasepk.github.io/case-studies.html" />
12+
<link rel="icon" href="assets/logo.png" />
13+
<meta name="theme-color" content="#0a0a0a" />
14+
15+
<!-- Open Graph -->
16+
<meta property="og:type" content="website" />
17+
<meta property="og:site_name" content="Codebase" />
18+
<meta property="og:title" content="Case Studies — Codebase | Mobile, Web & Custom Software Projects" />
19+
<meta property="og:description" content="Real client projects delivered by Codebase across mobile app development, custom software, automation, and enterprise systems." />
20+
<meta property="og:url" content="https://codebasepk.github.io/case-studies.html" />
21+
<meta property="og:image" content="https://codebasepk.github.io/assets/logo.png" />
22+
<meta property="og:image:width" content="512" />
23+
<meta property="og:image:height" content="512" />
24+
<meta property="og:image:type" content="image/png" />
25+
26+
<!-- Twitter -->
27+
<meta name="twitter:card" content="summary_large_image" />
28+
<meta name="twitter:title" content="Case Studies — Codebase" />
29+
<meta name="twitter:description" content="Real client projects delivered by Codebase across mobile, web, and custom software." />
30+
<meta name="twitter:image" content="https://codebasepk.github.io/assets/logo.png" />
31+
32+
<link rel="preconnect" href="https://fonts.googleapis.com" />
33+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
34+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
35+
<link rel="stylesheet" href="styles.css" />
36+
37+
<script type="application/ld+json">
38+
{
39+
"@context": "https://schema.org",
40+
"@type": "BreadcrumbList",
41+
"itemListElement": [
42+
{ "@type": "ListItem", "position": 1, "name": "Home", "item": "https://codebasepk.github.io/" },
43+
{ "@type": "ListItem", "position": 2, "name": "Case Studies", "item": "https://codebasepk.github.io/case-studies.html" }
44+
]
45+
}
46+
</script>
47+
</head>
48+
<body>
49+
50+
<!-- ── NAV ── -->
51+
<nav>
52+
<div class="nav-logo">
53+
<a href="index.html#hero"><img src="assets/logo.svg" alt="Codebase" width="170" height="84" /></a>
54+
</div>
55+
<ul class="nav-links">
56+
<li><a href="index.html#hero">Home</a></li>
57+
<li><a href="index.html#about">About</a></li>
58+
<li><a href="index.html#services">Services</a></li>
59+
<li><a href="case-studies.html" class="active">Case Studies</a></li>
60+
<li><a href="index.html#team">Team</a></li>
61+
<li><a href="index.html#contact" class="nav-cta">Contact Us</a></li>
62+
</ul>
63+
<button class="theme-toggle" id="themeToggle" aria-label="Toggle theme">
64+
<svg class="icon-moon" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
65+
<svg class="icon-sun" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>
66+
</button>
67+
<div class="hamburger" aria-label="Menu">
68+
<span></span><span></span><span></span>
69+
</div>
70+
</nav>
71+
72+
<!-- ── PAGE HERO ── -->
73+
<section id="page-hero">
74+
<div class="section-inner">
75+
<div class="page-breadcrumb"><a href="index.html">Home</a> / Case Studies</div>
76+
<span class="hero-badge">Case Studies</span>
77+
<h1 class="section-title">Real projects, real client outcomes</h1>
78+
<p class="section-subtitle">520+ projects delivered and a 4.9★ rating across Freelancer and Upwork. Below is a sample of the work behind those numbers, grouped by the kind of problem we solved.</p>
79+
</div>
80+
</section>
81+
82+
<!-- ── MOBILE APP DEVELOPMENT ── -->
83+
<section id="portfolio-mobile">
84+
<div class="section-inner">
85+
<div class="portfolio-header fade-up">
86+
<span class="section-tag">Case Studies</span>
87+
<h2 class="section-title">Mobile App Development</h2>
88+
<p class="section-subtitle">Native and cross-platform apps for iOS and Android, built for real-world field use, retail, and consumer products.</p>
89+
</div>
90+
<div class="portfolio-grid">
91+
92+
<div class="portfolio-card fade-up">
93+
<div class="portfolio-cover">
94+
<span class="portfolio-cover-text">01</span>
95+
<span class="portfolio-cover-badge">Android</span>
96+
</div>
97+
<div class="portfolio-body">
98+
<h3>Aircraft Technician Log App Development</h3>
99+
<div class="portfolio-category">Mobile App Development</div>
100+
<p>"Codebase, as a company, is a great team of developers with a lot of knowledge. They communicate really well, are patient, and always answer my questions. Do not hesitate to start a project with them." — Cyril D. 🇫🇷</p>
101+
<div class="portfolio-stats">
102+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
103+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
104+
</div>
105+
</div>
106+
</div>
107+
108+
<div class="portfolio-card fade-up">
109+
<div class="portfolio-cover">
110+
<span class="portfolio-cover-text">02</span>
111+
<span class="portfolio-cover-badge">iOS & Android</span>
112+
</div>
113+
<div class="portfolio-body">
114+
<h3>Flutter Web App to iOS &amp; Android</h3>
115+
<div class="portfolio-category">Mobile App Development</div>
116+
<p>"Codebase did an outstanding job, converting this Flutter web application to iOS and Android apps, and also published the apps to the stores." — Onno P. 🇳🇱</p>
117+
<div class="portfolio-stats">
118+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
119+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
120+
</div>
121+
</div>
122+
</div>
123+
124+
<div class="portfolio-card fade-up">
125+
<div class="portfolio-cover">
126+
<span class="portfolio-cover-text">03</span>
127+
<span class="portfolio-cover-badge">iOS</span>
128+
</div>
129+
<div class="portfolio-body">
130+
<h3>Mobile App (Swift) Upgrade with Small Changes</h3>
131+
<div class="portfolio-category">Mobile App Development</div>
132+
<p>"Great to work with. Willing to explain in detail. Has patience and a nice attitude." — Khaled H. 🇺🇸</p>
133+
<div class="portfolio-stats">
134+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
135+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
136+
</div>
137+
</div>
138+
</div>
139+
140+
<div class="portfolio-card fade-up">
141+
<div class="portfolio-cover">
142+
<span class="portfolio-cover-text">04</span>
143+
<span class="portfolio-cover-badge">iOS & Android</span>
144+
</div>
145+
<div class="portfolio-body">
146+
<h3>Android and iOS App Development</h3>
147+
<div class="portfolio-category">Mobile App Development</div>
148+
<p>"Codebase and their team did a great job working on Android and iOS jobs. They completed the job on time." — Sergey P. 🇺🇸</p>
149+
<div class="portfolio-stats">
150+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
151+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
152+
</div>
153+
</div>
154+
</div>
155+
156+
<div class="portfolio-card fade-up">
157+
<div class="portfolio-cover">
158+
<span class="portfolio-cover-text">05</span>
159+
<span class="portfolio-cover-badge">Mobile</span>
160+
</div>
161+
<div class="portfolio-body">
162+
<h3>Shopping App Development</h3>
163+
<div class="portfolio-category">Mobile App Development / E-Commerce</div>
164+
<p>"Excellent and very easy to work with. Responsive and high quality work." — Armand D. 🇦🇺</p>
165+
<div class="portfolio-stats">
166+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
167+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
168+
</div>
169+
</div>
170+
</div>
171+
172+
<div class="portfolio-card fade-up">
173+
<div class="portfolio-cover">
174+
<span class="portfolio-cover-text">06</span>
175+
<span class="portfolio-cover-badge">Android</span>
176+
</div>
177+
<div class="portfolio-body">
178+
<h3>Hardware User Manual to Android App</h3>
179+
<div class="portfolio-category">Mobile App Development</div>
180+
<p>"Good independent work by freelancer on our App." — Sarmad A. 🇺🇸</p>
181+
<div class="portfolio-stats">
182+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
183+
<div class="p-stat"><div class="p-stat-num">Freelancer</div><div class="p-stat-label">Platform</div></div>
184+
</div>
185+
</div>
186+
</div>
187+
188+
</div>
189+
</div>
190+
</section>
191+
192+
<!-- ── CUSTOM SOFTWARE & AUTOMATION ── -->
193+
<section id="portfolio-software">
194+
<div class="section-inner">
195+
<div class="portfolio-header fade-up">
196+
<span class="section-tag">Case Studies</span>
197+
<h2 class="section-title">Custom Software &amp; Automation</h2>
198+
<p class="section-subtitle">Purpose-built systems and workflow automation tools designed around a specific business process.</p>
199+
</div>
200+
<div class="portfolio-grid">
201+
202+
<div class="portfolio-card fade-up">
203+
<div class="portfolio-cover">
204+
<span class="portfolio-cover-text">07</span>
205+
<span class="portfolio-cover-badge">Custom Software</span>
206+
</div>
207+
<div class="portfolio-body">
208+
<h3>Gate Code Access System Development</h3>
209+
<div class="portfolio-category">Custom Software</div>
210+
<p>"Codebase was thorough, creative, and patient. They did excellent work and delivered exactly what I needed. I highly recommend Codebase." — Steven E. 🇺🇸</p>
211+
<div class="portfolio-stats">
212+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
213+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
214+
</div>
215+
</div>
216+
</div>
217+
218+
<div class="portfolio-card fade-up">
219+
<div class="portfolio-cover">
220+
<span class="portfolio-cover-text">08</span>
221+
<span class="portfolio-cover-badge">Automation</span>
222+
</div>
223+
<div class="portfolio-body">
224+
<h3>Workflow Automation for JDN Server &amp; DocuSign</h3>
225+
<div class="portfolio-category">Backend Development &amp; Automation</div>
226+
<p>"Always easy to work with Codebase, they provide great feedback and have helpful suggestions." — Julian P. 🇨🇦</p>
227+
<div class="portfolio-stats">
228+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
229+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
230+
</div>
231+
</div>
232+
</div>
233+
234+
<div class="portfolio-card fade-up">
235+
<div class="portfolio-cover">
236+
<span class="portfolio-cover-text">09</span>
237+
<span class="portfolio-cover-badge">Enterprise</span>
238+
</div>
239+
<div class="portfolio-body">
240+
<h3>Point-of-Sale System — XML Integration</h3>
241+
<div class="portfolio-category">Enterprise Software</div>
242+
<p>"We had the pleasure of working with Codebase on the implementation of new features in our point-of-sale system, and we cannot emphasize enough how satisfied we are with the results. Codebase has demonstrated impressive technical expertise and a strong problem-solving ability throughout the entire process." — Salaydin C. 🇸🇪</p>
243+
<div class="portfolio-stats">
244+
<div class="p-stat"><div class="p-stat-num">5.0 ★</div><div class="p-stat-label">Client Rating</div></div>
245+
<div class="p-stat"><div class="p-stat-num">Upwork</div><div class="p-stat-label">Platform</div></div>
246+
</div>
247+
</div>
248+
</div>
249+
250+
</div>
251+
</div>
252+
</section>
253+
254+
<!-- ── CTA ── -->
255+
<section id="page-cta">
256+
<div class="section-inner">
257+
<span class="section-tag">Start a Project</span>
258+
<h2 class="section-title">Have something similar in mind?</h2>
259+
<p class="section-subtitle">Tell us about your project and we'll get back to you with next steps.</p>
260+
<div class="hero-actions">
261+
<a href="index.html#contact" class="btn-primary">Get In Touch</a>
262+
<a href="index.html#services" class="btn-secondary">View Our Services</a>
263+
</div>
264+
</div>
265+
</section>
266+
267+
<!-- ── FOOTER ── -->
268+
<footer>
269+
<div class="footer-inner">
270+
<div class="footer-logo">
271+
<img src="assets/logo.svg" alt="Codebase" width="170" height="84" />
272+
</div>
273+
<div class="footer-copy">© 2026 Codebase. All rights reserved.</div>
274+
<div class="footer-links">
275+
<a href="index.html#about">About</a>
276+
<a href="index.html#services">Services</a>
277+
<a href="case-studies.html">Case Studies</a>
278+
<a href="mailto:codebasepk@gmail.com">Email</a>
279+
<a href="https://github.com/codebasepk" target="_blank" rel="noopener">GitHub</a>
280+
</div>
281+
</div>
282+
</footer>
283+
284+
<button id="scrollTop" aria-label="Scroll to top">
285+
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>
286+
</button>
287+
288+
<script src="script.js"></script>
289+
</body>
290+
</html>

‎index.html‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,9 @@
1919
<meta property="og:description" content="AI integration, mobile apps, web platforms, and custom software — 520+ projects delivered, 4.9★ rated on Freelancer and Upwork." />
2020
<meta property="og:url" content="https://codebasepk.github.io/" />
2121
<meta property="og:image" content="https://codebasepk.github.io/assets/logo.png" />
22+
<meta property="og:image:width" content="512" />
23+
<meta property="og:image:height" content="512" />
24+
<meta property="og:image:type" content="image/png" />
2225

2326
<!-- Twitter -->
2427
<meta name="twitter:card" content="summary_large_image" />
@@ -52,6 +55,11 @@
5255
"reviewCount": "9",
5356
"bestRating": "5"
5457
},
58+
"review": [
59+
{ "@type": "Review", "author": { "@type": "Person", "name": "Cyril D." }, "reviewRating": { "@type": "Rating", "ratingValue": "5", "bestRating": "5" }, "reviewBody": "Codebase, as a company, is a great team of developers with a lot of knowledge. They communicate really well, are patient, and always answer my questions." },
60+
{ "@type": "Review", "author": { "@type": "Person", "name": "Steven E." }, "reviewRating": { "@type": "Rating", "ratingValue": "5", "bestRating": "5" }, "reviewBody": "Codebase was thorough, creative, and patient. They did excellent work and delivered exactly what I needed. I highly recommend Codebase." },
61+
{ "@type": "Review", "author": { "@type": "Person", "name": "Onno P." }, "reviewRating": { "@type": "Rating", "ratingValue": "5", "bestRating": "5" }, "reviewBody": "Codebase did an outstanding job, converting this Flutter web application to iOS and Android apps, and also published the apps to the stores." }
62+
],
5563
"makesOffer": [
5664
{ "@type": "Offer", "itemOffered": { "@type": "Service", "name": "AI Integration" } },
5765
{ "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Mobile App Development" } },
@@ -68,13 +76,14 @@
6876
<!-- ── NAV ── -->
6977
<nav>
7078
<div class="nav-logo">
71-
<a href="#hero"><img src="assets/logo.svg" alt="Codebase" /></a>
79+
<a href="#hero"><img src="assets/logo.svg" alt="Codebase" width="170" height="84" /></a>
7280
</div>
7381
<ul class="nav-links">
7482
<li><a href="#hero">Home</a></li>
7583
<li><a href="#about">About</a></li>
7684
<li><a href="#services">Services</a></li>
7785
<li><a href="#reviews">Reviews</a></li>
86+
<li><a href="case-studies.html">Case Studies</a></li>
7887
<li><a href="#team">Team</a></li>
7988
<li><a href="#contact" class="nav-cta">Contact Us</a></li>
8089
</ul>
@@ -476,13 +485,14 @@ <h2 class="section-title">Let's build something great together</h2>
476485
<footer>
477486
<div class="footer-inner">
478487
<div class="footer-logo">
479-
<img src="assets/logo.svg" alt="Codebase" />
488+
<img src="assets/logo.svg" alt="Codebase" width="170" height="84" />
480489
</div>
481490
<div class="footer-copy">© 2026 Codebase. All rights reserved.</div>
482491
<div class="footer-links">
483492
<a href="#about">About</a>
484493
<a href="#services">Services</a>
485494
<a href="#reviews">Reviews</a>
495+
<a href="case-studies.html">Case Studies</a>
486496
<a href="mailto:codebasepk@gmail.com">Email</a>
487497
<a href="https://github.com/codebasepk" target="_blank" rel="noopener">GitHub</a>
488498
</div>

‎script.js‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ document.querySelectorAll('.fade-up').forEach(el => observer.observe(el));
7070

7171
// ── PARTICLE BACKGROUND ──
7272
const canvas = document.getElementById('particles');
73-
const ctx = canvas.getContext('2d');
73+
const ctx = canvas ? canvas.getContext('2d') : null;
7474

7575
let particles = [];
7676
const PARTICLE_COUNT = 80;
@@ -139,11 +139,13 @@ function drawParticles() {
139139
requestAnimationFrame(drawParticles);
140140
}
141141

142-
window.addEventListener('resize', () => {
142+
if (canvas) {
143+
window.addEventListener('resize', () => {
144+
resize();
145+
createParticles();
146+
});
147+
143148
resize();
144149
createParticles();
145-
});
146-
147-
resize();
148-
createParticles();
149-
drawParticles();
150+
drawParticles();
151+
}

‎sitemap.xml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,14 @@
22
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
33
<url>
44
<loc>https://codebasepk.github.io/</loc>
5+
<lastmod>2026-08-24</lastmod>
56
<changefreq>monthly</changefreq>
67
<priority>1.0</priority>
78
</url>
9+
<url>
10+
<loc>https://codebasepk.github.io/case-studies.html</loc>
11+
<lastmod>2026-08-24</lastmod>
12+
<changefreq>monthly</changefreq>
13+
<priority>0.8</priority>
14+
</url>
815
</urlset>

0 commit comments

Comments
 (0)