CSS

Bakımı kolay, ölçeklenir CSS

CSS EĞİTİMİ

CSS Eğitimi uygulamalı kurumsal eğitim programı tanıtım kapağı

CSS Eğitimi, web arayüzlerini sistemli ve ölçeklenebilir biçimde biçimlendirme yaklaşımını katılımcılara aktarır. Tasarım kararlarının tüm site genelinde tutarlı uygulanması mümkün hale gelir.

Eğitim sonunda katılımcılar her ekranda düzgün çalışan responsive arayüzler kurabilir, tekrar eden kodu yönetilebilir bir yapıya dönüştürebilir. Güncel başvuru için resmi dokümantasyon kapsamlı bir kaynak sağlar.

Katılımcı Profili

CSS ile modern arayüz geliştiren profillere yöneliktir:

  • Front-end Geliştiriciler: Flexbox, Grid ve responsive layout uygular
  • UI Geliştiricileri: Component tabanlı CSS ve tasarım sistemi kurar
  • Web Tasarımcıları: Tasarımdan koda geçişi yönetir
  • Bootcamp Mezunları: Modern CSS pratiğiyle junior developer'lığa hazırlanır
  • Freelance Web Developer'lar: Çoklu proje frontend hattı kurar

Ön Gereklilikler

Şu temeller hazırsa eğitim ilk günden uygulamaya geçer:

  • HTML etiketleri ve doküman iskeleti mantığı
  • Tarayıcı dev tools ile element inceleme alışkanlığı
  • Dosya-klasör düzeni ve VS Code benzeri editör kullanımı
  • Temel JavaScript okuryazarlığı (opsiyonel, faydalı)
  • Git ile commit ve branch akışına genel aşinalık

Süresi ve Tarihi

Süre: 3 gün. Bu süre standart program içindir; ek modüllere ve hedefe göre süre özelleştirilebilir.
Eğitim tarihleri ve saatleri, katılımcı grubunun uygunluğuna göre birlikte planlanır.

Kazanımlar

Eğitim sonunda CSS pratikleri ortak bir standarda kavuşur:

  • Cascade, specificity ve inheritance mantığını doğru uygular
  • Ölçeklenebilir sınıf isimlendirme yaklaşımı kurgular
  • Flexbox ve Grid ile güvenilir layout stratejisi kurar
  • Responsive tasarımda kırılım ve akış kontrolünü yönetir
  • DevTools ile stil sorunlarını hızlı izole eder
  • Performans odaklı stillendirmeyle gereksiz maliyeti azaltır
  • Component bazlı UI için yeniden kullanılabilir CSS yazar
  • Erişilebilirlik ve okunabilirlik için tipografi kurgular

CSS Eğitimi Konuları

1. CSS Temelleri, Selector ve Cascade

  • CSS dosya bağlama: inline, internal, external
  • Selector tipleri: element, class, id, attribute
  • Cascade kuralı ve source order
  • Comment yazımı ve dosya organizasyonu
  • !important kullanım sınırları

2. Specificity ve Inheritance

  • Specificity hesaplama: inline, id, class, element
  • Kombinatörler: descendant, child, adjacent, general sibling
  • Inheritance: hangi property'ler kalıtsal
  • initial, inherit, unset, revert keyword'leri
  • :where() ve :is() ile specificity yönetimi

3. Box Model ve Sizing

  • Content, padding, border, margin katmanları
  • box-sizing: content-box ve border-box
  • width, min-width, max-width
  • Margin collapsing davranışı
  • Birim sistemi: px, em, rem, %, vw, vh

4. Display: block, inline, inline-block

  • Block ve inline element davranışları
  • inline-block ile karma kullanım
  • display: none vs visibility: hidden
  • Document flow ve normal flow
  • aspect-ratio property kullanımı

5. Position, Float ve Z-Index

  • Position: static, relative, absolute, fixed, sticky
  • Float ve clear (legacy ama hâlâ kullanılan)
  • Stacking context ve z-index hiyerarşisi
  • Sticky header ve scroll-padding
  • Containing block kavramı

6. Flexbox ile 1D Layout

  • display: flex ve flex container
  • flex-direction: row, column, reverse
  • justify-content, align-items, align-content
  • flex-grow, flex-shrink, flex-basis kısaltması
  • gap ile boşluk yönetimi
  • order ile sıralama değişikliği

7. CSS Grid ile 2D Layout

  • grid-template-columns ve grid-template-rows
  • fr birim ve minmax() fonksiyonu
  • grid-template-areas ile named grid
  • grid-column, grid-row ile yerleşim
  • auto-fit ve auto-fill ile responsive grid
  • subgrid (modern tarayıcılar)

8. Responsive Tasarım ve Media Query

  • Mobile-first yaklaşım
  • Breakpoint stratejisi: 640, 768, 1024, 1280
  • @media (min-width, max-width, orientation)
  • Container queries ile component-based responsive
  • prefers-color-scheme ve prefers-reduced-motion

9. Tipografi ve Web Fonts

  • font-family, font-size, font-weight
  • line-height, letter-spacing, word-spacing
  • @font-face ve woff2 yükleme
  • Google Fonts ve self-hosted font
  • font-display: swap ile FOUT yönetimi

10. Renk, Background ve Gradient

  • HEX, RGB, RGBA, HSL, HSLA
  • oklch() modern renk uzayı
  • background-image, position, size
  • linear-gradient ve radial-gradient
  • Çoklu background ve blend mode

11. Transition, Animation ve Keyframes

  • transition: property, duration, timing-function
  • cubic-bezier ile özel easing
  • @keyframes ve animation property
  • transform: translate, rotate, scale, skew
  • will-change ile performans hint

12. Custom Properties ve calc()

  • :root scope ile global değişkenler
  • var() fonksiyonu ve fallback değer
  • calc() ile dinamik hesaplama
  • clamp(), min(), max() fonksiyonları
  • Theme switching ve dark mode

13. Pseudo-class ve Pseudo-element

  • :hover, :focus, :active, :visited
  • :nth-child, :nth-of-type
  • :not(), :has() seçicileri
  • ::before, ::after pseudo-element
  • ::placeholder, ::selection özelleştirme

14. BEM, Component CSS ve DevTools

  • BEM naming: Block__Element--Modifier
  • CSS Modules ve CSS-in-JS karşılaştırması
  • Chrome DevTools ile CSS debugging
  • Computed, Layout, Animations panelleri
  • Lighthouse ile performans analizi

CSS Eğitimi ile İlgili
Sıkça Sorulan Sorular ve Cevapları


CSS eğitimini kurumumuza özel planlayabilir miyiz?

Evet. CSS eğitimini kurumlara özel düzenlemekteyiz; içerik, süre ve takvim firmanızın ihtiyacına ve çalışanlarınızın programına göre birlikte belirlenir. Standart program temel alınır, önceliklerinize göre uyarlanır.

CSS eğitimini hangi şehirlerde veriyorsunuz?

CSS eğitimini İstanbul, Ankara ve İzmir başta olmak üzere Türkiye'nin tüm illerinde yerinde veriyoruz; isteyen kurumlara eğitim canlı online olarak da sunulur, dünyanın her yerinden katılım mümkündür.

CSS eğitimini online veriyor musunuz?

Evet, CSS eğitimini canlı online olarak da veriyoruz; uygulamalı oturumlarla Türkiye'nin ve dünyanın neresinde olursanız olun katılabilirsiniz. Program kurumunuzun ihtiyacına göre belirlenir.

CSS eğitimi çalışanlarımızın seviyesine göre uyarlanıyor mu?

Evet. CSS eğitiminin başında katılımcıların seviyesi değerlendirilir ve içerik buna göre ayarlanır; sıfırdan başlanabileceği gibi ileri konulara da odaklanılabilir.

CSS eğitimi projemiz üzerinden ilerleyebilir mi?

Eğitim, kendi web projeniz veya uygulamanız üzerinden ilerleyebilir. Bunun için teklif öncesinde projenizi bize iletmeniz ya da tarif etmeniz gerekmektedir; böylece eğitimi gerçek işinize göre kurgularız.

CSS eğitmenleriniz hakkında bilgi alabilir miyiz?

Eğitmenlerimiz web ve yazılım geliştirme alanında sahada deneyimli, CSS'i gerçek projelerde kullanan uzmanlardır. İhtiyacınıza ve hedefinize en uygun eğitmeni sizinle eşleştiriyoruz.

Katılımcılarımıza sertifika veriliyor mu?

Evet. Eğitim sonunda katılımcılarımıza katılım sertifikası veriyoruz; sertifikada eğitimin kapsamı ve katılımcı bilgileri yer alır, kurumunuzun tercihine göre dijital ya da basılı hazırlanır.

CSS eğitiminin fiyatı ne kadar?

Sabit bir CSS eğitimi ücreti yoktur; fiyat, katılımcı sayısı, kapsam ve süreye göre belirlenir. İhtiyacınızı dinleyip kurumunuza özel bir teklif sunarız.

CSS standardını birlikte netleştirelim, teklif isteyin.
0 212 951 07 08 · Kurumsal teklif

 Vimaj