Skip to content
Menu
Beytullah Güneş
  • Ana Sayfa
  • Araçlar
    • SEO Analizi Yap
    • En Yeni SEO Analizleri
    • Domain Yaşı Sorgula
    • Google Önbellek Analiz
    • Yapılandırılmış Veri Aracı
  • Blog
    • Bilgisayar
    • Dijital Pazarlama
    • Google
    • Güvenlik
    • İnternet
    • Oyun
    • SEO
    • Sosyal Medya
    • Teknoloji ve Bilim
    • Yazılım Tasarım Kodlama
  • Hakkında
    • Hakkında
    • İletişim
    • Referanslar
    • Sıkça Sorulan Sorular
Beytullah Güneş
Dreamweaver CS4 ile web sayfası yapmak

Dreamweaver CS4 ile web sayfası yapmak

Yayınlanma Tarihi 8 Temmuz 2012 | Kategori Bilgisayar

Bu dersimizde dreamweaver cs4 kullanacağız. sebebi ise: daha önceki sürümlerde html1.0 mantığına göre çalışıp sizi yanlış yönlendirirken güncel sürüm html 4.0 standardına göre çalışıyor ve hata yapma oranı çok düşüyor.

Şimdi yeni başlayanlar için temel noktalara bakalım:

1- Dil ayarı: Öncelikle Dil ayarını yaparsanız açtığınız dosyaları UTF-8 yapmasını engellersiniz.

Edit -preferences kısmını açın ve aşağıdaki iki yeri değişin.

Aşağıdaki ayar yeni dosyalarınızın direkt Türkçe ile başlamasını sağlar.

2- Yeni Dosya : Yeni bir Web sayfası yaparken dosya tipi olarak HTML 4.0 seçmeniz sizin avantajınıza olacaktır. Fakat bu beraberinde başka şeyleri bilmeyi de gerektirir. Örneğin Html 4.0 ile mümkün olduğunca daha çok Css kullanmanız gerekir.yeni teknoloji olduğu için bir şekilde öğreneceksiniz bari geç kalmış olmayalım.

Dosya-Yeni (File-New) diyerek dosya oluşturuyoruz. sağdaki kısma dikkat edin. Html 4.0 sürümünü seçiyoruz.

3- Sağlı sollu bölme: Dw(dreamweaver) cs4 ile en sevdiğim özelliklerden biri yeni gelen pencere bölmeleyicinin dikine ayırması. Bunu açınca ne olduğunu anlayacaksınız.

Önce üstteki düğmelerden Split kısmına basın. sonra üst menülerden View > Split Vertically diyeceğiz.

Böylece Dreamweaver iki parçaya ayrılarak bize hem Dizayn tarafını hemde Kod tarafını gösteriyor. Belki şu aşamada kodlardan koruyor olabilirsiniz. ama ileride burası en sevdiğiniz bölüm olacak. Şimdilik sadeceDesign olarak kullanabilirsiniz. Ama Php öğrenmeye başlayınca bunun yerini unutursanız buradan bakabilirsiniz.

Web sayfası yapmaya başlıyoruz. Bunun için elinizde Resimler ve yazılarınız hazır olmalı. Örnek olarak masaüstüne yeni bir klasör yapın ve kullanacağız dosyaları içine koyun. size örnek olsun diye şuraya iki dosya koydum.

klasor

Zipli dosyayı açıp içindekileri masaüstüne çıkarın. aşağıdaki gibi üç dosya göreceksiniz. arkaplan.JPG resmini sayfanın arkaplanı olarak kullanacağız. Beğenmediyseniz kendinize başka arkaplan bulun

ilgili konu  Wordpress Woocommerce Yeni Ürünleri Anas ayfada Gösterme ve Tema Entegre

Şimdi Dreamweaver ile sayfa.html yazan dosyayı açın ve ilk basit sayfamızı yapmaya başlayalım.

1. Bölüm, Sayfa başlığı

Yukarıda söylediğim ayarları yaptıysanız aşağıdaki gibi bir ekrana bakıyor olmanız gerekiyor.

Şimdi sayfanın sol tarafında işlem yapacağımız iki bölüm var Head ve body. bu kavramlara alışmanız gerekiyor.

Head:(Başlık) Sayfada direkt görünmeyen ama sayfa için gerekli kodların olduğu bölümdür. bunları birbirinden ayırmak için şeklinde taglar kullanılmıştır. bu ikisi arasına yazılan hiçbirşey kullanıcıya görünmez.

Body:(Gövde) Sayfanın içeriği buradadır. arasına yazılır. buraya yazdığınız yazılar ekranda görünür.

Şimdi sayfada HEAD kısmına bir stil dosyası yazacağız. hemen korkmayın. aslında çok basit. bir satır yazınca anlayacaksınız.

Soldaki kelimesinin üzerine aşağıdaki kdoları yazın. (sonra görüntüyü tazelemek için F5 e basın)

body{ background:url(arkaplan.jpg)}

Bunu yazdığınız anda sayfanın arkaplanı değişecektir. kelimelerin anlamını bilirseniz daha kolay anlarsınız.

body{ background: url() }

gövde { arkaplan: adresi ()}

Türkçe olsaydı herşey daha kolay olacaktı. fakat bunun için elimizden birşey gelmiyor çünkü css kuralları tüm dünyada aynı olmak zorunda. türkçe olsaydı bile tüm dünyanın Türkçe olarak kullanması gerekirdi. şimdilik Dünya için kendimizi feda edelim ve ingilizce öğrenelim.

Eğer sayfadaki yazıların rengini de değiştirmek isterseniz aşağıdakini ekleyebilirsiniz.

body{ background:url(arkaplan.jpg); color:blue }

Birinci bölümü tamamladık. bundan sonra Css nedir, Css nasıl kullanılır diye soru sormanız gerekir. ve Aslında yurt dışında sadece Css ile iş yapan insanlar vardır. yani üç harf gibi basit birşey değil. ama onları da size öğreteceğim. merak etmeyin.

2. bölüm. sayfaya yazı ve resim eklemek:

Sayfaya ekleyeceğiniz diğer bileşenler için kod kısmını kullanmanız gerekmiyor.
(Aslında css için de kodlara girmek gerekmiyor ama herşeyi bedavacılıkla yaparsanız işin aslını öğrenemezsiniz)

ilgili konu  Windows Server 2003 emekliye ayrılıyor

Sayfaya yazı eklemek için istediğiniz yazıyı  kelimesinden sonra yazmanız yeterlidir.

Deneme Yazısı

veya Sağ taraftaki Design kısmına ne yazarsanız direkt  içersinde oluşur.

Şimdi de sayfaya resim ekleyelim. hadi bu sefer size kıyak geçeyim. sağ taraftaki menülerden bir tıklama ile resmi ekleyelim.

Sağdaki images düğmesine basınca karşınıza resmin adını soran bir pencere gelecek.

Buradan animasyon isimli dosyayı seçin ve tamam diyin. bu sefer de resmin adını soran bir pencere gelecek. bunun esas amacı görme engellilerin kullandığı internet tarayıcılarda onlara resimde ne olduğunu söylemektir. Html 4 ile mutlaka girilmesi gerekir.

Resim için açıklamayı da girdiyseniz basit web sayfanız hazır demektir.

Şimdi bu sayfayı internete gönderip kullanıcılarınıza sunabilirsiniz. tabii bir internet sayfası için basit olduğunu düşünüyorsanız acele etmeyin daha yeni başladık ve öğreneceğimiz birçok konu var.

internet sayfasına dosyaları yollarken ftp programı kullanacaksınız. ve dikkat edin. sayfada kaç tane resim kullandıysanız hepsini FTP ile yollamanız gerekir.

Dreamweaver CS4 ile web sayfası yapmak
Dreamweaver CS4 ile web sayfası yapmak
  • adobe dreamweaver cs4 download
  • adobe dreamweaver cs4 free download for windows 10 64 bit
  • adobe dreamweaver cs4 indir

Bir cevap yazın Cevabı iptal et

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Beytullah GÜNEŞ

Beytullah GÜNEŞ

GNSNetwork Founder

beytullahgunes.com ve GNSNetwork kurucusu. Aktif olarak 2002, profesyonel olarak 2012 yılından bu yana web tasarım, geliştirme ve SEO alanında hizmet vermekte. 2019 yılından bu yana hizmetlerini GNSNetwork üzerinden sunmayı sürdürmektedir.

Yeni Neler Var?

  • Yoast SEO WordPress Erişilebilirlik Eklentisi
  • Google Arama Güncellemeleri
  • Açık Kaynak ChatGPT Klonu
  • OpenAI ChatGPT İçin Eklenti Desteği
  • WordPress Ödeme Eklentisi Güvenlik Açığı

SEO Araçları

  • SEO Analizi Yap
  • En Yeni SEO Analizleri
  • Domain Yaşı Sorgula
  • Google Önbellek Analiz
  • Yapılandırılmış Veri Aracı

Kategoriler

  • Bilgisayar
  • Dijital Pazarlama
  • Google
  • Güvenlik
  • İnternet
  • Oyun
  • SEO
  • Sosyal Medya
  • Teknoloji ve Bilim
  • Yazılım Tasarım Kodlama

Başlıca

  • Ana Sayfa
  • Bilgisayar
  • Dijital Pazarlama
  • Google
  • Güvenlik
  • İnternet
  • SEO

Kurumsal

  • Hakkında
  • Sıkça Sorulan Sorular
  • Kullanım Koşulları
  • Çerez Politikası
  • Gizlilik politikası
  • KVKK
  • Beytullah Güneş İletişim

Sosyal

  • Facebook
  • Twitter
  • Instagram
  • tumblr
  • Linkedin

Beytullah Güneş İletişim

[email protected]

Tuğçe Güneş | Mutfaktan Yemek Tarifi | Kullanıcı Yorumluyor | Güzel Anlamlı Sözler | Açıklanamayan Doğaüstü Olaylar

DMCA compliant image btk
GNS Network - SEO Tasarım Reklamcılık