Bir web portföyünü anlaşılır kılmak: içerik hiyerarşisi ve proje sunumu

Can Taşkın — Sun, 13 Sep 2026 02:00:59 +0000

Bir freelancer portföyünde ziyaretçinin önce üç soruya cevap bulmasını önemsiyorum: Ne yapıyorsun, hangi işleri gösterebilirsin ve sana nasıl ulaşabilirim? Bu yazı, web tasarım hizmetlerini sunarken kullanılabilecek basit bir içerik planı.

1. İlk ekranda tek bir ana mesaj

Hizmet listesinin tamamını ana başlığa sıkıştırmak yerine ana işi açıkça yazmak daha anlaşılır bir başlangıç sağlar. “Web tasarım ve geliştirme” ana başlık olabilir; e-ticaret, reklam yönetimi veya grafik tasarım alt bölümde açıklanabilir. Ana çağrı da somut olmalı: “Projeleri incele” veya “Projenizi anlatın”.

2. Proje görselinin yanına bağlam koyun

Ekran görüntüsü tasarımı gösterir, kısa açıklama ise ziyaretçinin işi anlamasını sağlar. Her proje kartında şu üç alanı kullanabilirsiniz:

Projenin adı ve faaliyet alanı
Sunulan çalışmanın kapsamı
İncelenebilecek proje veya portföy bağlantısı

Kanıtlanmamış dönüşüm oranları veya trafik artışları eklemek yerine gerçek kapsamı yazın. Örneğin kurumsal bir web sitesiyle çok dilli bir web sitesinin ihtiyaçları aynı değildir.

3. Başlıkları anlam sırasına göre düzenleyin

Ana sayfa başlığı, hizmetler, seçili projeler ve iletişim birbirini izleyen bir akış oluşturabilir. Başlık etiketlerini yalnızca yazıyı büyütmek için kullanmayın; görsel boyutu CSS ile, içerik yapısını anlamlı HTML ile düzenleyin.

<main>
  <h1>Web tasarım ve geliştirme</h1>
  <section aria-labelledby="projects-heading">
    <h2 id="projects-heading">Seçili projeler</h2>
    <article>
      <h3>Proje adı</h3>
      <p>Faaliyet alanı ve yapılan çalışmanın kısa açıklaması.</p>
      <a href="/projeler/ornek/">Proje detaylarını inceleyin</a>
    </article>
  </section>
</main>

Bu örnek bir yapı önerisidir; mevcut bir projenin kaynak kodu değildir.

4. Mobil görünümü içerikle birlikte kontrol edin

Uzun başlıklar, proje kartlarının kırpılması ve yan yana bağlantılar küçük ekranda sorun çıkarabilir. Sayfayı yalnızca boş şablonla değil, gerçek proje adları ve açıklamalarıyla kontrol edin. Klavyeyle bağlantılara ulaşılabildiğini ve odak göstergesinin görülebildiğini de deneyin.

5. Her dil için okunabilir bir akış

Türkçe, İngilizce ve Almanca metinleri aynı başlığa yığmak yerine ayrı dil bağlantıları veya açıkça ayrılmış bölümler kullanın. Her dilde hizmetin anlamını koruyun; kelimesi kelimesine çeviri yerine doğal cümleler kurun.

EN — Summary

A clear freelance portfolio explains the main service, presents real project screenshots with context, and provides a direct contact path. Use meaningful heading levels, descriptive links and a layout checked with real content on mobile. Keep language versions easy to navigate and avoid unsupported performance claims.

DE — Zusammenfassung

Ein übersichtliches Freelancer-Portfolio erklärt die Hauptleistung, zeigt echte Projektansichten mit Kontext und bietet einen direkten Kontaktweg. Sinnvolle Überschriften, beschreibende Links und eine Prüfung mit echten Inhalten auf kleinen Bildschirmen helfen bei der Struktur. Sprachversionen sollten leicht auffindbar sein.

Ben Can Taşkın, İzmir merkezli freelance web tasarımcıyım. Seçili çalışmalarımı ve hizmetlerimi portföyümde bulabilirsiniz: Web tasarım · English · Deutsch.

Portföyümden dört gerçek web projesi

Farklı sektörlerde içerik öncelikleri de değişiyor. Aşağıdaki çalışmalarımı, bu yazıdaki proje sunumu yaklaşımına somut örnekler olarak inceleyebilirsiniz.

MOA Furniture — Mobilya

Ürün görselleri, projeler ve kurumsal sayfalar ön planda. Canlı site · Görselli proje sunumu.

Ece Zerey Abogados — Çok dilli hukuk bürosu sitesi

Ekip, çalışma alanları ve dil seçenekleri bilgiye erişimi düzenliyor. Canlı site · Görselli proje sunumu.

Nazım Kurtuldu — Sanatçı sitesi

Sahne görselleri, program, galeri ve video akışı sanatçının çalışmalarını bir araya getiriyor. Canlı site · Görselli proje sunumu.

Rem Group — Lojistik

Hizmet sayfaları, kurumsal bilgiler ve teklif talebi bağlantıları etrafında kurulan bir yapı. Canlı site.

EN: These four projects demonstrate different content priorities for furniture, legal services, music and logistics.

DE: Diese vier Projekte zeigen unterschiedliche inhaltliche Schwerpunkte für Möbel, Rechtsberatung, Musik und Logistik.

Projelerin görselli seçkisi — Behance · Web tasarım hizmetim.

DEV Community: Can Taşkın