OSBSA Bilişim
Kariyer9 dakikalık okuma

Web tasarımcısı nasıl olunur?

Diploma şart mı, hangi araçlar öğrenilmeli, portfolyo nasıl kurulur? İşe alırken baktığımız beceriler ve bugün öğrenilmesi boşa giden konular.

Yazan: OSBSA Bilişim

Bu soruyu bize genellikle iki grup soruyor: üniversite tercihi yapan öğrenciler ve meslek değiştirmeyi düşünenler. İkisine de aynı şeyi söylüyoruz. Diploma kapıyı açar, portfolyo işi alır.

Aşağıdaki liste, işe alırken gerçekten baktığımız şeylerden çıktı. Sektörün tamamını temsil etmez, ama küçük ve orta ölçekli bir ajansta çalışmak istiyorsanız ihtiyacınız olan asgari set budur.

Web tasarımcısı tam olarak ne yapar?

Terim biraz bulanık, çünkü iki ayrı iş için kullanılıyor.

Arayüz tasarımcısı ekranı kurar: düzen, tipografi, renk, bileşen sistemi, akış. Çıktısı tasarım dosyalarıdır.

Önyüz geliştirici o tasarımı tarayıcıda çalışır hale getirir. Çıktısı koddur.

Büyük ekiplerde bu ikisi ayrı kişidir. Küçük ajanslarda genellikle aynı kişi yapar ve "web tasarımcısı" denilen rol de budur. Hangi tarafa yatkın olduğunuzu erken anlamak, öğrenme sıranızı belirler.

Diploma gerekli mi?

Hayır. İşe alırken diplomaya bakmıyoruz, çalışan iş istiyoruz.

Bunun anlamı eğitimin değersiz olduğu değil. Bilgisayar mühendisliği, grafik tasarım ya da ilgili bir bölüm size iki şey kazandırır: yapılandırılmış bir temel ve zaman. Kendi başınıza öğrenirken en zor kısım, neyi hangi sırayla öğreneceğinizi bilmemektir.

Sertifika kurslarının durumu daha karışık. Kısa kurslar genellikle bir aracı kullanmayı öğretir, sorun çözmeyi öğretmez. Kurs bitiminde elinizde üç bitmiş proje varsa değerlidir. Sadece katılım belgesi varsa, işe alırken hiçbir ağırlığı yok.

Bugün ne öğrenilmeli?

Sıralama önemli. Aşağıdakileri bu sırayla öğrenmenizi öneririz.

SıraKonuNeden
1HTML, semantik etiketlerHer şeyin temeli. Yanlış etiket erişilebilirliği ve SEO'yu bozar
2CSS, flexbox ve gridDüzen kurmayı öğrenmeden çerçeve öğrenmek işe yaramaz
3Duyarlı tasarımMobil öncelikli düşünme alışkanlığı
4Erişilebilirlik temelleriWCAG 2.2, klavye gezinimi, kontrast, form etiketleri
5JavaScript temelleriDOM, olaylar, asenkron işlemler
6Sürüm kontrolü (Git)Ekip içinde çalışmanın ön şartı
7Tasarım aracı (Figma)Tasarımcıyla ortak dil
8Bir çerçeve (React)İş ilanlarının çoğunda isteniyor
9TypeScriptOrta ölçekli projelerde artık standart
10Bir uygulama çatısı (Next.js)Sunucu tarafı render ve yönlendirme
11Temel SEO ve performansCore Web Vitals, sayfa başlığı yapısı, görsel optimizasyonu
12Temel arka uç bilgisiVeritabanı, API, kimlik doğrulama mantığı

İlk beş maddeyi atlayıp doğrudan sekizinci maddeden başlayan çok kişi görüyoruz. Sonuç genellikle şu oluyor: çerçeveyle çalışan ama basit bir düzen sorununu çözemeyen bir geliştirici.

Bugün öğrenmeye değmeyen şeyler

Bu bölümü yazmamızın bir sebebi var. Kendi eski sitemizde, ziyaretçilere Flash, FrontPage, Dreamweaver ve Fireworks öğrenmelerini tavsiye eden bir sayfa yıllarca yayında kaldı. O tavsiyeyi verdiğimiz için özür dileriz ve düzeltiyoruz.

AraçDurum
Adobe FlashDesteği 31 Aralık 2020'de sona erdi, tarayıcılar 2021 Ocak'ta içeriği engellemeye başladı
Microsoft FrontPageGeliştirilmesi 2006'da durduruldu
Adobe FireworksSon sürümü CS6, 2013'te geliştirilmesi bırakıldı
Klasik ASPYerini ASP.NET ve ardından ASP.NET Core aldı
Tablo ile sayfa düzeniCSS grid ve flexbox varken kullanılmıyor
jQuery ile başlamakÖğrenmesi zararlı değil ama yeni projelerde başlangıç noktası değil

Eski araçlarla üretilmiş bir siteyi devralırsanız bunları tanımanız işinize yarayabilir. Kariyerinize bunlardan başlamak ise zaman kaybı.

Portfolyo nasıl kurulur?

Üç bitmiş iş, on yarım işten daha değerli. İşe alırken baktığımız şey, projenin ne kadar gösterişli olduğu değil, bitmiş olup olmadığı.

Portfolyoda olması gerekenler:

  • Gerçekten yayında olan, tıklanabilir adresler
  • Her proje için ne yaptığınızın kısa açıklaması: hangi kısmı siz yazdınız
  • Kod deposu bağlantısı
  • Karşılaştığınız bir sorun ve nasıl çözdüğünüz

Son madde en çok okuduğumuz kısım. "Ürün listesi filtrelemesi mobilde yavaştı, sunucu tarafında sayfalama yaptım" cümlesi, on ekran görüntüsünden fazla şey anlatır.

Kendi siteniz de portfolyonun parçasıdır. Mobilde bozuluyorsa ya da beş saniyede açılıyorsa, diğer projelerinize bakılmaz.

Uydurma proje koymayın. "Örnek e-ticaret sitesi" diye konan şablon işler, bir ajansın göreceği ilk şeydir.

Kendi başına öğrenirken ne yapmalı?

Kurs izlemekle öğrenilmiyor, kurstakini kapatıp yeniden yazmakla öğreniliyor. Pratik bir yol şu: sevdiğiniz bir sitenin bir sayfasını, koduna bakmadan sıfırdan yapmaya çalışın. Takıldığınız her nokta, öğrenmeniz gereken konunun adıdır.

İkinci öneri, gerçek bir müşteri bulmak. Mahalledeki bir esnafa ücretsiz ya da düşük bedelle site yapmak, on kişisel projeden daha öğretici. Çünkü ilk kez kendi zevkinize göre değil, başkasının ihtiyacına göre karar vermek zorunda kalırsınız. Geri bildirim almak, kapsamın büyümesiyle baş etmek ve teslim etmek de mesleğin parçası.

İşe alırken neye bakıyoruz?

Sıralamayla:

  1. Bitmiş ve yayında olan iş
  2. Kodun okunabilirliği
  3. Sorunu nasıl anlattığı
  4. Erişilebilirlik ve performans konusunda farkındalık
  5. Git kullanımı
  6. Öğrenme hızı

Diploma bu listede yok. Ama ilk maddeyi karşılamayan bir başvuruyu diploma da kurtarmıyor.

Kısa yol yok

Web tasarımcısı olmak için bir okuldan mezun olma şartı yok. Temelleri sırayla öğrenmek, bitmiş iş üretmek ve o işi anlatabilmek gerekiyor. Öğrenme listenizi yaparken de kaynağın tarihine bakın: 2015 öncesi yazılmış bir rehber, size bugün kimsenin kullanmadığı araçları öğretebilir.

Bizim bugün hangi teknolojilerle çalıştığımızı merak ederseniz web yazılım hizmet sayfamızda yığının tamamı yazılı.

  • web tasarımcısı
  • kariyer
  • öğrenme yolu
  • portfolyo

Bu sayfayı paylaş

Diğer yazılar

Projenizi konuşalım

Ne istediğinizi kısaca yazın; kapsamı, süreyi ve bedeli içeren bir teklifle dönelim.