WEB TASARIMIN TEMELLERİ

Benzer belgeler
BTP 207 İNTERNET PROGRAMCILIĞI I. Ders 3

3. Metin ve Görünüm Etiketleri

WEB TASARIMIN TEMELLERİ

12 TBT / WEB TASARIM ve PROGRAMLAMA ( Not 3 )

Temel Bilgisayar Terimleri Yrd. Doç. Dr. Devkan Kaleci

<html> <head> <title>sayfa Başlığı</title> </head> <body> Bu benim ilk sayfam <b>bu metin koyu</b> </body> </html>

Karabük Üniversitesi, Mühendislik Fakültesi...

HTML & CSS. Öğr.Gör. M.Ersin AKAY

Sevdiğiniz editörü açın, Notepad, vi, pico vb. Daha sonra da aşağıdaki kodu yazın:

MODÜL BİLGİ SAYFASI KODU :

BTP 207 İNTERNET PROGRAMCILIĞI I. Ders 4

Basamaklı Stil Şablonları (CSS) BIM206 Web Programlama

5. Tablo İşlemleri. Bu bölümü bitirdiğinizde,

HTML Etiketleri Genel Özellikler (Global Attributes)

HTML 5 ve CSS 3. Yrd. Doç. Dr. Murat Olcay ÖZCAN

CSS(CASCADING STYLE SHEETS)

HTML Sayfaları. Bütün html sayfaları

Doç. Dr. İsmail Rakıp Karaş Hazırlayan: İdris Kahraman

Web Site Tasarımı (Html-Css) (SD0139) Murat KARA 2017

BİLGİSAYAR 4 MOLEKÜLER BİYOLOJİ VE GENETİK BÖLÜMÜ YARD. DOÇ. DR. MEHTAP YALÇINKAYA

1.1 Web Kavramlar URL terimini tanımlayınız ve anlayınız.

HTML Bloklar. CSS Display özelliği

BTU 100 Bilgisayar okuryazarlığı EXCEL BTU 100 BİLGİSAYAR OKURYAZARLIĞI. Excel de Dosya Tablo ve Grafik Oluşturma

İNTERNET PROGRAMCILIĞI

BMT 202 Web Tasarımı Bahar Dönemi. Yük. Müh. Köksal GÜNDOĞDU 1

BTP 207 İNTERNET PROGRAMCILIĞI I. Ders 5

Ekle Menüsü İşlevleri ÜNİTE 3. Bu üniteyi çalıştıktan sonra; Ekle Menüsü Çizimler Grafikler Bağlantılar Metin

MICROSOFT OFFİCE WORD PROGRAMI DOSYA İŞLEMLERİ

BİLGİSAYAR 4. MOLEKÜLER BİYOLOJİ VE GENETİK BÖLÜMÜ HTML DERS NOTLARI 9. DERS Tablolar (HTML Giriş) YARD. DOÇ. DR.

4. Bağlantı (Köprü) Oluşturma

KELİME İŞLEMCİ MİCROSOFT OFFİCE WORD KULLANIMI

WORD 2010 KULLANIMI OFFICE DÜĞMESİ HIZLI ERİŞİM ARAÇ ÇUBUĞU MENÜLER ŞEKİL, RESİM EKLEME TABLO EKLEME ETKİNLİKLER

CSS. 1. CSS nin Yapısı Sınıf (Class) Seçicisi

Web Tasarımının Temelleri

Web Tasarımının Temelleri

HTML herhangi bir text (metin) editörü (Notepad, Word, Notepad++, Dreamweaver,...) ile hazırlanabilir. Bizler Notepad++ üzerinde kodlama yapacağız.

Elbistan MYO Güz Dönemi Öğr.Gör. Murat KEÇECİOĞLU

WEB SİTESİ YÖNETİM PANELİ KULLANMA YÖNERGESİ

Kopya Hakkı 2005 The European Computer Driving Licence Foundation Ltd

WEB SİTESİ YÖNETİM PANELİ KULLANMA YÖNERGESİ

Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri

7. Çerçeveler. Bu bölümü bitirdiğinizde,

2. HTML Temel Etiketleri

WORDPAD. Hızlı erişim araç çubuğu ve dosya menüsü. Kayıt, yazdırma ve sayfa yapısına yönelik işlemlerin

WEB TASARIMININ TEMELLERİ

WEB TASARIMI veprogramlama DERSİ CSS DERS NOTLARI

Metin Tabanlı İçerik Oluşturma Araçları

Metin İşlemleri, Semboller

Temel Bilgi Teknolojileri - II Ayrıntılı Ders İçerikleri

Web sayfaları içinde tablolara sıkça ihtiyaç duyarız. Bu eğitim belgesinde temel tablo etiketlerini ve kullanımlarını öğreneceğiz.

TASARIMIN TEMEL İLKELERİ

Html temelleri. Ders 4

HTML TABLO OLUŞTURMA HALİL İBRAHİM AKGÜN

HTML 5 ve CSS 3. Yrd. Doç. Dr. Murat Olcay ÖZCAN

HTML içerik oluşturmak için düşünülen bir işaret dilidir. Örnek

ÖNDER BİLGİSAYAR KURSU. Microsoft Office Kursu Eğitim İçeriği

HTML - 8 Hypertext takıları iki ana değişik şekilde karşımıza çıkar: Anchors ve Images. Anchors, resim veya yazıya bir olay eklemek için kullanılır.

HTML 5 ve CSS 3. Yrd. Doç. Dr. Murat Olcay ÖZCAN

MIS213T İNTERNET VE WEB PROGRAMLAMA GÜZ 2016 LAB DOKÜMANI #2. 1. Bölüm: Temel HTML Etiketleri - Resimler

.docx veya.doc (2007 ve üzeri sürümlerde.docx iken sürümlerinde.doc tur.) 1.Belge Başlığı

Site Tasarım Çalışması -3

Basamaklı Stil Şablonları (CSS) BIM206 Web Programlama

2. Belgeye Metin Ekleme

PAKET PROGRAMLAR DERSİ

Kopyalanmış veya kesilmiş içeriği imlecin bulunduğu yere yapıştırır. Bir konumdaki biçimlendirmeyi kopyalar ve başka bir konuma uygular.

7. BELGEYE RESİM EKLEME, YAZIM ve ÇİZİM ÖZELLİKLERİ

Web sayfalarında yapılan her çalışma ve düzenleme tablolar aracılığı ile yapılır. Dolayısıyla çoğu web sayfalarında tablo kullanmak zorunluluktur.

BTP 207 İNTERNET PROGRAMCILIĞI I. Ders 2

WEB TASARIMI. c) Çeviriciler: Kullanıcının değişik biçimlerde hazırladığı belgeleri HTML biçimine dönüştürmeye sağlayan programlardır.

Kullanım Kılavuzu Milli Eğitim Bakanlığı 2010

4 Front Page Sayfası Özellikleri

MİCROSOFT WORD PROGRAMI ÇALIŞMA KAĞIDI

Aaraçlar Menüsünden Seçeneklerden Görünüm

ÖĞRENME FAALİYETİ 1 ÖĞRENME FAALİYETİ 1 1. FORMLAR

h a k a n b a b a c. n e t HTML Web Tasarımı ve Programlama

WEB TASARIMI. Đnternet Nedir?

ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI

Hizalama Word dokümanlarınızda oluşturduğunuz veya oluşturacağınız metinlerin hizalamasını yapabilirsiniz. Bu işlem için:

WORD 2010 PROGRAMI 1-miseR 2-miseR Pencere Durum Düğmeleri: Başlık Çubuğu:


BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME

görüntüleyebilirsiniz. HTML, programlama dilleri bir programlama mantığı taşımadığından öğrenilmesi gayet kolay bir dildir.

Word Otomatik Düzelt

HTML. Doç. Dr. İsmail Rakıp Karaş Dersin Course Page: 2. Bölüm

Ekran Çıktısı. FONT-WEIGHT: bold; COLOR: #00688F; FONT-FAMILY: Tahoma, Arial, sans-serif; style="text-decoration none" }

PHP I PHP I. E. Fatih Yetkin. 26 Eylül 2011

Zengin Metin İşaretleme Dili (HTML) BIM206 Web Programlama

5-Hafta Genel Sayfa Yapısı

BÖLÜM 5. HTML Biçimleme Belirteçleri

TS EN ISO EŞLEŞTİRME LİSTESİ

CSS ile Web Sayfası Oluşturma

08119 Web Tasarımının Temelleri. Elbistan MYO Güz Dönemi Öğr.Gör. Murat KEÇECİOĞLU

Yine benzer şekilde hücreler içine yazılan yazıların renklerini değiştirebiliriz. Bunun için tüm satırı veya sütunu yine fareyle seçmek durumundayız.

Doç.Dr. Yaşar SARI, Web Tasarımı Ders Notları 1

Zemin özellikleri Font özellikleri Kutu modeli özellikleri Tablo özellikleri Pozisyon özellikleri Liste özellikleri

Arayüz Geliştirme Dokümantasyonu

İÇİNDEKİLER BİRİNCİ BÖLÜM BİLGİSAYARDA BELGE AÇMAK VE TEMEL İŞLEMLER YAPMAK

Web Programlama Kursu

T.C BALIKESİR ÜNİVERSİTESİ WEB SAYFALARI YÖNETİM PANELİ YARDIM KILAVUZU

Transkript:

WEB TASARIMIN TEMELLERİ ~ Sunu 4 ~ Öğr. Gör. Mehmet Fatih TAN http://blog.kmu.edu.tr/mftan mftan@kmu.edu.tr Bilgi paylaşıldıkça kıymetlenir.. Kaynak göstermek şartıyla sunu içeriğini çalışmalarınızda kullanabilirsiniz.

DERSİN İÇERİĞİ HTML Etiketleri <body> Etiketleri Metin Biçimlendirme Etiketleri Sunu içerisinde anlatılanlar ornek02 klasörü içerisinde ornek02.html dosyasında kodlanmıştır. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 2

<BODY> Etiketi İnternet sayfasının içeriğini, yani ana gövdesini oluşturan etikettir. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 3

<BODY> Etiketinin Özellikleri text : Sayfadaki metnin rengini belirler. bgcolor : Sayfanın arkaplan rengini belirler. topmargin : Sayfanın üst kenar boşluğu leftmargin : Sayfanın sol kenar boşluğu Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 4

<BODY> Etiketinin Özellikleri link : Sayfadaki bağlantıların rengini belirler. alink : Sayfadaki aktif bağlantıların rengini belirler. vlink : Sayfadaki ziyaret edilen bağlantıların rengini belirler. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 5

<FONT> Etiketi ve Özellikleri Etiket içerisindeki metnin biçimlendirmesi için kullanılır. Sonlandırmalı etikettir. color : Metnin rengini belirler. face : Metnin yazı tipini belirler. size : Metnin büyüklüğünü belirler. 1-7 arasında değerler alır. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 6

<B> Etiketi Etiket içerisindeki metnin kalın yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 7

<I> Etiketi Etiket içerisindeki metnin sağa eğik (italik) yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 8

<U> Etiketi Etiket içerisindeki metnin altı çizili yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 9

<S> Etiketi Etiket içerisindeki metnin üstü çizili yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 10

<SUB> Etiketi Etiket içerisindeki metnin alt simge olarak yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 11

<SUP> Etiketi Etiket içerisindeki metnin üst simge olarak yazılması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 12

<STRONG> Etiketi Etiket içerisindeki metnin kalın yazılması için kullanılır. <b> etiketi ile aynı işlevi görür. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 13

<P> Etiketi Etiket içerisindeki metnin paragraf olarak yazılması için kullanılır. Sonlandırmalı etikettir. align : Paragrafın hizalanması için kullanılır. left, right, center, justify Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 14

<BR> Etiketi Etiketten sonraki ifadeler bir alt satırdan başlar. Yani yeni bir satırbaşı yapmak için kullanılır. Sonlandırmasız etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 15

<NOBR> Etiketi İnternet tarayıcıları kullanıcı ekranının çözünürlüğüne, tarayıcı penceresi içerisinde yatayda sığmayan metinleri kaydırarak görüntüler. Bu etiket arasına yazılan ifadeler pencere küçültülse bile yatayda kaymak, pencere içerisine yatay kaydırma çubuğu çıkar. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 16

<H1>,<H2>,<H3>,<H4>,<H5>,<H6> Başlık Etiketleri Etiket içerisindeki metnin başlık olarak yazılması için kullanılır. Harfin yanındaki 1-6 değerleri başlığın büyüklüğünü belirtir. Sonlandırmalı etiketlerdir. align : Paragrafın hizalanması için kullanılır. left, right, center Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 17

<HR> Etiketi İnternet sayfası içerisine yatay çizgi eklemek için kullanılır. Sonlandırmasız etikettir. align : Çizginin yataydaki hizasını belirler. left, right, center size : Çizginin kalınlığını belirler. width : Çizginin genişliğini belirler. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 18

<HR> Etiketi color : Çizginin rengini belirler. noshade : Çizginin gölgesiz olacağını belirler. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 19

<BLOCKQUOTE> Etiketi Sayfa içerisindeki verileri gruplandırmak için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 20

<CENTER> Etiketi Etiket içerisindeki ifadelerin sayfaya yatayda ortalanması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 21

<SPAN> Etiketi Etiket içerisindeki ifadelerin gruplanması için kullanılır. Sonlandırmalı etikettir. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 22

İç İçe Etiket Kullanımı Etiketler iç içe kullanılarak bir nesneye birden fazla özellik veya biçimlendirme verilebilir. Dikkat edilmesi gereken nokta, etiketlerin başlangıçlarının sırası kapanışta simetrisi olmalıdır. Yani ilk sıradaki etiketin kapanışı en sonda olmalıdır. Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 23

İç İçe Etiket Kullanımı Doğru Kullanım <b><u><i>ermenek MYO</i></u></b> <İ> etiketi kapsama alanı <u> etiketi kapsama alanı <b> etiketi kapsama alanı Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 24

İç İçe Etiket Kullanımı Yanlış Kullanım <b><u><i>ermenek MYO</b></u></i> <İ> etiketi kapsama alanı <u> etiketi kapsama alanı <b> etiketi kapsama alanı Öğr. Gör. Mehmet Fatih TAN Web Tasarımın Temelleri 25