SlideShare a Scribd company logo
1 of 34
Download to read offline
Web Önyüzü Nasıl Olmalı? <Markup> : İskelet {css} : Görünüm JavaScript() : Etkileşim
Bu üç öğe olabildiğince  esnek bağlı olmalı Kötü Örnek / İyi Örnek
 
 
 
 
 
Standartlara uygun olmalı!
Standartlara uygun olmalı! <!DOCTYPE html    PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot;   &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> veya  <!DOCTYPE html>
Dinamik sayfalarda DTD'ye  nasıl uyacağız? ,[object Object]
HTML Tidy : http://tidy.sf.net/
Düzenli ifadeler
Geçerlilik kontrolü ,[object Object]
http://validator.w3.org/
CSS için
http://jigsaw.w3.org/css-validator/
JavaScript için
http://www.jslint.com/
Güncel tarayıcıların tümünde  sorunsuz çalışmalı! ,[object Object]
Yine de standartın dışına çıkacaksak ,[object Object],[object Object]
Geliştirme aşamasında  anlaşılabilir olmalı! ,[object Object]
anaSayfa.css //Sadece ana sayfaya özel stiller
iletisim.js //Sadece iletişim sayfasına özel JavaScript ,[object Object]
Scope başlangıç ve bitişleri
(bkz: kötü örnek, iyi örnek)
Ne kazandırdı? ,[object Object]
Görsel işler ile ilgilenen kişi sadece CSS
Etkileşimi sağlayan programcı sadece JavaScript ,[object Object]
Gururumuz okşandı!
Gerçek ortamda az trafik harcamalı, hızlı olmalı! ,[object Object]
İlk giriş yapan kullanıcıyı “mutlu” etmek gerekir ,[object Object],[object Object]
JavaScript : noktalı virgül sorunsalı
Gerçek ortamda az trafik harcamalı, hızlı olmalı! ,[object Object]
Google Closure Compiler http://code.google.com/intl/tr/closure/compiler/docs/gettingstarted_ui.html ,[object Object],[object Object],[object Object]

More Related Content

Viewers also liked (17)

Docker - Ankara JUG, Nisan 2015
Docker - Ankara JUG, Nisan 2015Docker - Ankara JUG, Nisan 2015
Docker - Ankara JUG, Nisan 2015
 
Git ile Sürüm Takibi
Git ile Sürüm TakibiGit ile Sürüm Takibi
Git ile Sürüm Takibi
 
Docker Nedir, Ne İşe Yarar, Nasıl Kullanılmalıdır?
Docker Nedir, Ne İşe Yarar, Nasıl Kullanılmalıdır? Docker Nedir, Ne İşe Yarar, Nasıl Kullanılmalıdır?
Docker Nedir, Ne İşe Yarar, Nasıl Kullanılmalıdır?
 
Php mysql sunum
Php mysql sunumPhp mysql sunum
Php mysql sunum
 
PHP Sunusu - 1
PHP Sunusu - 1PHP Sunusu - 1
PHP Sunusu - 1
 
Algoritma kurmak
Algoritma kurmakAlgoritma kurmak
Algoritma kurmak
 
Özgür Yazılım & GNU/Linux
Özgür Yazılım & GNU/LinuxÖzgür Yazılım & GNU/Linux
Özgür Yazılım & GNU/Linux
 
Java script
Java scriptJava script
Java script
 
Php MySQL
Php MySQLPhp MySQL
Php MySQL
 
REST yoluyla Web Servis Geliştirme
REST yoluyla Web Servis GeliştirmeREST yoluyla Web Servis Geliştirme
REST yoluyla Web Servis Geliştirme
 
Jquery Giriş
Jquery GirişJquery Giriş
Jquery Giriş
 
Linux sunum
Linux sunumLinux sunum
Linux sunum
 
Nmap101 Eğitim Sunumu - Nmap Kullanım Kılavuzu
Nmap101 Eğitim Sunumu - Nmap Kullanım KılavuzuNmap101 Eğitim Sunumu - Nmap Kullanım Kılavuzu
Nmap101 Eğitim Sunumu - Nmap Kullanım Kılavuzu
 
JavaScript sunumu
JavaScript sunumuJavaScript sunumu
JavaScript sunumu
 
Laravel 5
Laravel 5Laravel 5
Laravel 5
 
Linux'a Giris ve VirtualBox a Ubuntu Kurulumu
Linux'a Giris ve VirtualBox a Ubuntu KurulumuLinux'a Giris ve VirtualBox a Ubuntu Kurulumu
Linux'a Giris ve VirtualBox a Ubuntu Kurulumu
 
Turkce
TurkceTurkce
Turkce
 

Similar to Web Onyuzu Nasil Olmali

Mutant Web Applications
Mutant Web ApplicationsMutant Web Applications
Mutant Web Applicationsguest096801
 
Temel HTML Etiketleri - Text, Image, Link, List, Image
Temel HTML Etiketleri - Text, Image, Link, List, ImageTemel HTML Etiketleri - Text, Image, Link, List, Image
Temel HTML Etiketleri - Text, Image, Link, List, Imagecmkandemir
 
Javascript Performance Optimisation
Javascript Performance OptimisationJavascript Performance Optimisation
Javascript Performance Optimisationirfandurmus
 
Temel HTML Etiketleri ve Kullanım Örnekleri
Temel HTML Etiketleri ve Kullanım ÖrnekleriTemel HTML Etiketleri ve Kullanım Örnekleri
Temel HTML Etiketleri ve Kullanım Örneklericmkandemir
 
Html5 ile Gelen Yenilikler
Html5 ile Gelen YeniliklerHtml5 ile Gelen Yenilikler
Html5 ile Gelen YeniliklerAhmet Mermerkaya
 
Web Performans Optimizasyon Prensipleri
Web  Performans Optimizasyon PrensipleriWeb  Performans Optimizasyon Prensipleri
Web Performans Optimizasyon PrensipleriMehmet Aykut Bulgu
 
Ozgur Web Catilari Mobil Uygulama Gelistirme
Ozgur Web Catilari Mobil Uygulama GelistirmeOzgur Web Catilari Mobil Uygulama Gelistirme
Ozgur Web Catilari Mobil Uygulama GelistirmeBurak Dede
 
Pratik seo uygulamaları
Pratik seo uygulamalarıPratik seo uygulamaları
Pratik seo uygulamalarıfsolak
 
Wordpress SEO: Optimisations & Plugins
Wordpress SEO: Optimisations & PluginsWordpress SEO: Optimisations & Plugins
Wordpress SEO: Optimisations & PluginsBurak Pehlivan
 
WordPress Hız Optimizasyonu
WordPress Hız OptimizasyonuWordPress Hız Optimizasyonu
WordPress Hız OptimizasyonuMustafa UYSAL
 
AMP ile Yüksek Performanslı Mobil Deneyimi
AMP ile Yüksek Performanslı Mobil DeneyimiAMP ile Yüksek Performanslı Mobil Deneyimi
AMP ile Yüksek Performanslı Mobil DeneyimiMehmet Aktug
 
Performanslı site tasarımı ve Site performans ölçüm araçları
Performanslı site tasarımı ve Site performans ölçüm araçlarıPerformanslı site tasarımı ve Site performans ölçüm araçları
Performanslı site tasarımı ve Site performans ölçüm araçlarıbarisaydiner
 

Similar to Web Onyuzu Nasil Olmali (20)

Mutant Web Applications
Mutant Web ApplicationsMutant Web Applications
Mutant Web Applications
 
Temel HTML Etiketleri - Text, Image, Link, List, Image
Temel HTML Etiketleri - Text, Image, Link, List, ImageTemel HTML Etiketleri - Text, Image, Link, List, Image
Temel HTML Etiketleri - Text, Image, Link, List, Image
 
Javascript Performance Optimisation
Javascript Performance OptimisationJavascript Performance Optimisation
Javascript Performance Optimisation
 
Temel HTML Etiketleri ve Kullanım Örnekleri
Temel HTML Etiketleri ve Kullanım ÖrnekleriTemel HTML Etiketleri ve Kullanım Örnekleri
Temel HTML Etiketleri ve Kullanım Örnekleri
 
Html5 ile Gelen Yenilikler
Html5 ile Gelen YeniliklerHtml5 ile Gelen Yenilikler
Html5 ile Gelen Yenilikler
 
Seo 101
Seo 101Seo 101
Seo 101
 
Web Performans Optimizasyon Prensipleri
Web  Performans Optimizasyon PrensipleriWeb  Performans Optimizasyon Prensipleri
Web Performans Optimizasyon Prensipleri
 
Ozgur Web Catilari Mobil Uygulama Gelistirme
Ozgur Web Catilari Mobil Uygulama GelistirmeOzgur Web Catilari Mobil Uygulama Gelistirme
Ozgur Web Catilari Mobil Uygulama Gelistirme
 
Merhaba Sinatra
Merhaba SinatraMerhaba Sinatra
Merhaba Sinatra
 
Pratik seo uygulamaları
Pratik seo uygulamalarıPratik seo uygulamaları
Pratik seo uygulamaları
 
Java EE Struts
Java EE StrutsJava EE Struts
Java EE Struts
 
Wordpress SEO: Optimisations & Plugins
Wordpress SEO: Optimisations & PluginsWordpress SEO: Optimisations & Plugins
Wordpress SEO: Optimisations & Plugins
 
WordPress Hız Optimizasyonu
WordPress Hız OptimizasyonuWordPress Hız Optimizasyonu
WordPress Hız Optimizasyonu
 
Web
WebWeb
Web
 
Ajax
AjaxAjax
Ajax
 
Asp.net ajax
Asp.net ajaxAsp.net ajax
Asp.net ajax
 
Seo
SeoSeo
Seo
 
AMP ile Yüksek Performanslı Mobil Deneyimi
AMP ile Yüksek Performanslı Mobil DeneyimiAMP ile Yüksek Performanslı Mobil Deneyimi
AMP ile Yüksek Performanslı Mobil Deneyimi
 
Flex blaze ds
Flex blaze dsFlex blaze ds
Flex blaze ds
 
Performanslı site tasarımı ve Site performans ölçüm araçları
Performanslı site tasarımı ve Site performans ölçüm araçlarıPerformanslı site tasarımı ve Site performans ölçüm araçları
Performanslı site tasarımı ve Site performans ölçüm araçları
 

Web Onyuzu Nasil Olmali