Sevgili okurlarımın kendilerini unuttuğumu düşünmelerini asla istemem yeni işim sayesinde artık bildiğim web programlama dilleri arasına xhtml, css ve php’nin yanına asp’yi de katmış bulunmaktayım. Tamamen asp kodlama ile kurulmuş birçok siteyi düzenlemek ve yenilerini yazmakla yükümlüyüm artık.  Uzun sürecek olan vize maratonumunda başlaması ile bir süre sizlerden ayrı kalacağım sanırım  ama bellide olmaz bakarsınız yarın dayanamayıp sizler için web tasarım dersleri yazılarıma bir yenisinide ekleyebilirim yeterki siz beni izlemeye devam edin (;

Sevgilerimle Akif ŞEN

Evet, arkadaşlar daha önceki yazımda tasarım için gerekli hazırlıklarımızı yaptık ve şimdi tasarımımızın css kodlama bölümüne geçiyoruz.  İlk olarak sizlere Font ve Text özelliklerinden bahsetmek istiyorum.

İlk olarak Font etiketinden başlayalım css de sitemizdeki yazıların yazı tipleri, renkleri,  büyüklükleri gibi özellikleri Font etiketi ile tanımlıyoruz.  Fakat bir çok özelliği barındırsada Font etiketi ile yapamadığımız birkaç özelliği de text etiketi sayesinde kullanabiliyoruz.

Font Etiketi Özellikleri

Font-size: Font büyüklüğü

Kullanımdaki standart değerler tercih edilebileceği gibi direkt olarak punto (pt)

değeri de verilebilir.

Standart değerler:

• xx-large (en büyük )

• x-large (biraz büyük)

• large (büyük)

• medium (orta)

• small (küçük)

• x-small (biraz küçük)

• xx-small (en küçük)

Alt Özellikler:

• font-family : Yazı tipini belirler. Arial, Arial Black, Verdana  gibi yazı tipi

isimlerini alabilir.

• font-weight : Yazı tipinin kalınlık incelik durumunu belirler.

• bold : Yazıyı kalın yapar.

• normal : Yazının normal halde olmasını sağlar. Bu özellik yazılmadığında

normal özellik alınır.

• font-style : Yazının yatık olup olmamasını sağlar.

• italic : Yazının sağa doğru yatık olmasını sağlar.

• color : Yazının rengini belirler. Gray, yellow, green gibi renklerin ingilizce

karşılıklarını alabilir.

Font Etiketi Kullanımı:

Bu örnekte paragraf etiketi olan “p” yi kapsayan font özelliklerini tanımlıyoruz.

p {

font-size : 16pt;

font-family : Arial Black;

font-weight : bold;

font-style : italic;

color : #0707FF;

}

Text Etiketi Özellikleri

text-transform :

• lowercase : Yazının tümünün küçük harf olmasını sağlar.

• uppercase : Yazının tümünün büyük harf olmasını sağlar.

• capitalize : Yazının istenilen şekilde kalmasını sağlar.

text-decoration :

• underline : Yazının altının çizili olmasını sağlar.

• overline : Yazının üstünün çizili olmasının sağlar.

• line-through : Yazının üstünün çizili olmasını sağlar.

• none : Yazının herhangi bir yerine çizgi çekilmemesini sağlar.

text-align:

• left: Yazının sola bitişik olmasını sağlar.

• center : Yazının ortada olmasının sağlar.

• right : Yazının sağa bitişik olmasını sağlar.

• line-height :Yazının normal satırdan çizgi yüksekliğini belirler. 3px, 5px

gibi değerler alır.

• text-ident : Yazının soldan ne kadar boşlukla içeriden başlayacağını

belirler. 5px, 10px gibi değerler alır.

Kullanımı:

Bu örnekte paragraf etiketi olan “p” yi kapsayan text özelliklerini tanımlıyoruz.

p {

text-transform : uppercase;

text-decoration : overline;

text-align : right;

line-height : 5px;

text-indent : 10px;

}

Evet arkadaşlar daha önceki yazılarımda sizlere xhtml,css gibi kavramların yanında web tasarımda renklerin uyumu gibi konulardan bahsetmiştim. Şimdi tüm gerekli unsurların bulunduğunu (web sitesi’nin konusu, renk tonlamaları gibi) varsayarak sitemizi xhtml ve css yardımı ile kodlamaya başlayacağız.

Sitemizi Kodlamaya başlamadan önce sitemizi tanımlayan bir isimde klasör oluşturalım daha sonra o klasörün içine index.html dosyamızı, images ismi klasörümüzü ve style.css dosyamızı oluşturalım (dosya uzantılarını gösterme açıkken metin dosyası oluşturun isimlerini index.html ve style.css yaparak bu dosyaları oluşturabiliriz.)

Tüm gerekli unsurlarımız hazırsa index.html dosyamızı her hangi bir metin editörü yada Frontpage benzeri bir web tasarım editöründe açarak kod bölümüne geçişde yapabiliriz benim tercihim kod geliştiricilerinin en çok kullandığı derleme programlarından biri olan notepad++

Daha önceki klasik html kodlamalarında sayfanın başına eklenen <html> gibi tagların yanında xhtml DTD zorunlu elemanları tanımlar. Tüm XHTML dökümanlarının DOCTYPE tanımlama zorunluluğu vardır. Html, head ve body bulunmalı ve title head içinde yer almalıdır.

DOCTYPE zorunlu olarak mevcut olmalıdır. Geçerli 3 adet XHTML döküman tipi vardır:

a- XHTML Strict

XHTML Dökümanlarını css dökümanları ile beraber kullanmanız gerektiğinde kullanılır. HTML’nin dizayn unsurlarını içermez.

Tanımı:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

b- XHTML 1.0 Transitional (Önerilen)

CSS anlamayan web gezginlerini desteklemek ve HTML’nin dizayn unsurlarını kullanmak istiyorsanız bu döküman tipini kulanın.

Tanımı:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0

Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-

transitional.dtd”>

c- XHTML 1.0 Frameset

Eğer XHTML dökümanları pencerelere bölünmüş olarak gösterilecekse bu döküman tipini kullanın.

Tanımı:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>

Bunları ekledikten sonra standart olan html taglarınıda sayfamıza ekliyoruz. Fakat bi fark var buda sayfamıza stil şablonumuz olan style.css dosyamızı import etmemiz.

Bunu 3 farklı biçimde yapabiliriz.

1. Yerel, yani sayfada sadece bir kez, Yerel stil şablonlar bir html etiketi

için özel olarak kullanılırlar.

2. Global, yani tüm sayfa için, Global stil şablonlar sayfadaki tüm html

etiketlerinin belirlenen özellikte olması istendiğinde kullanılırlar.

3. Bağlantılı, yani birden çok sayfa için, Bağlantılı stil şablonlar birçok

sayfada aynı biçimde olması istendiğinde kullanılırlar.(Önerilen)

Yerel Kullanım Örneği

<html>

<head>

<title>Css</title>

</head>

<body>

<h2>CSS Kullanımı</h2><br>

<h2 style=font-size:20pt; color:blue>CSS Kullanımı</h2>

</body>

</html>

Burada ilk h2 standart özelliklerinde gözükürken ikincisinde font büyüklüğü 20 ve rengi mavi olarak görüntülenir.

Global Kullanım Örneği

<html>

<head>

<title>Css</title>

<style>

<!– h2 {font-size:20pt; color:blue} –>

</style>

</head>

<body>

<h2>Web Teknikleri</h2>

</body>

</html>

Burada sayfanın <head> bölümünde tanımladığımız h2 özelliklerini tarayıcı tanıyarak <h2> tagının kullanıldığı yerlerde bu özelliklere göre bize sayfayı görüntüler

Bağlantılı Kullanım Örneği

<html>

<head>

<title>Css</title>

<link rel=”stylesheet” type=”text/css” href=”stil.css”> </head>

<body>

<h1>Web Teknikleri</h2>

<h2>Web Teknikleri</h2>

<h3>Web Teknikleri</h2>

</body>

</html>

Burada daha önceden oluşturduğumuz style.css stil şablonumuzu sayfamıza import ederek ordaki belirlediğimiz özellikleri sayfamızda çağırabiliriz bu yöntem daha düzenli bir kodlama için en çok tercih edilen yöntemdir.

Sanırım Bu sefer diğerlerine göre biraz uzun bir makale oldu  fakat bu sadece başlangıç safası ön hazırlarımızı yapınca çok güzel işler çıkaracağımıza eminim

To Be Continued…

Bu yazıda sizlerle yeni asp kodlamaya başlayanların karşılaşabileceği IIS sorunlarından bahsedeceğiz, Yazıma başlamadan önce bu yazıyı yazmam için bana gerekli bilgileri gönderen Orhan Arslan arkadaşıma teşekkür ederim. Bu yazıdan yeni asp kodlamaya başlayan bir çok arkadaşımın faydalanacağından şüphem yok

Gelelim şimdi sorunlara ve onların çözüm yollarına;

Hata:
Microsoft JET Database Engine (0×80040E09)
Güncelleştirilemiyor. Veritabanı veya nesne salt okunur.

Çözümü

mdb. access dosyasına gidilir.  sağ tuş özellikler denir.

USERS(Bilgisayar adı ” sizin bilgisayarınız adı “)USERS)  ‘e Tam denetim verilir.

Hata:

LOCALHOST web sayfasında açılmıyor hata veriyorsa veya

IIS şifre istiyorsa IIS şifre sorunu

Çözümü:

Aşağıdaki Ayarlar sırasıyla kontrol edilir.

1-  Başlat / Denetim Masası / Yönetimsel Araçlar / Internet Information Services (IIS)  açılır.

2- Bilgisayar adı (sizin bilgisayarınız) / Web Siteleri / sağ tuş / Özellikler  / Dizin Güvenliği /Düzenle ‘ den

a)  Anonim Erişim secili olmalıdır.

b) “IIS parolayı denetleye bilsin” secili olmalıdır.

3- Bilgisayar adı (sizin) / Web Siteleri / sağ tuş / Özellikler  / Dizin Güvenliği / Giriş Dizininde

Okuma ve Yazma seçili olmalıdır.

Hala Açmıyor ise.

4 – Başlat / Denetim Masası / Yönetimsel Araçlar / Hizmetler / IIS Yönetim Sağ tuş özellikler den

Yerel işletim sistemi hesabı secili olmalıdır.

Hizmetin Masaüstü etkileşimine izin ver secili olmalıdır.

Sonra IIS yönetim Sağ tuş Yeniden Başlat denir

5 – Bilgisayarım tıklanır   / Araçlar / Klasör Seçenekleri  / Görünüm’den

Basit Dosya paylaşımı kullan kaldırılır..

C:\Inetpub dizini ile

C:\Inetpub\wwwroot dizinine sağ tuş  / özellikler /  Güvenlik’den

Bilgisayarınızdaki kullanıcı ile

Users (Bilgsiayar adı ) \ Users )  Tam Denetim verilmelidir.

6-  Üsteki ayarlara RAĞMEN Açmıyor ise.

Bilgisayar adı (sizin) / Web Siteleri / sağ tuş / Özellikler  / Dizin Güvenliği /Düzenle ‘ den

Anonim Erişim kaldırıp Tümleşik Windows seçilmelidir.

BÜTÜN BUNLARA RAĞMEN AÇMIYOR İSE IIS’İ KALDIRIP YENİDEN KURMALISINIZ

Evet, önceki yazımda sizlere web site tasarımında renklerin önemine kısaca değinmiştim. Aslında birçoğumuz renklerin uyumundan giyim vb. konularda çok iyi anlasa da iş web site tasarımına gelince nedense biraz değişiyor.  Şimdi bu konuyu biraz derinlemesine inceleyelim.

Her yıl televizyonlarda modacıların bu sene şu renkler moda gibi açıklamalarını çeşitli magazin veya kadın programlarında, dergilerinde duymuş yada okumuşsunuzdur. Ama web tasarım da iş biraz değişik, web sitesinde renk seçimi yaparken dikkat edilecek konu moda olan renklerden çok sitenin konusudur. Örneğin bir şirket sitesi yaparken renk seçimi şirketin konusu ve şirket logosu ile doğru orantılıdır. Ayrıca seçilen renklerin birbirleri ile uyumlu olması bir birinin yanında sırıtmaması veya kaybolmaması sitenin görselliği açısından çok önemlidir.

Renk seçimi yaparken ilk başta arka plan rengini seçmeliyiz ve sitemizi bu renk ile uyumlu olan renklerle bezemeliyiz. Peki, sitemizin arka planını belirledikten sonra o renge uyumlu olan renkleri nasıl belirleyeceğiz işte bu en basit kısımlardan birisi bu renkleri bizim için bulan birçok site var mesela birkaç örnek vermek gerekirse. Bu veya bu ya da bu siteye bakabilir ya da google’a renk uyum tablosu yazarak bir biri ile uyumlu renkleri kolayca öğrenebiliriz.

Renk uyumlarına dikkat edilerek yapılan bir site hem göze hitap eder hem de kullanıcılar bakımından daha kullanışlı olur. Yani kullanıcılar bir biri içine girmiş uyumsuz renklerin içinde bazı önemli bilgileri kaçırabilir, fakat tam aksine renkler uyumlu olduğu zaman en ufak ayrıntıyı bile fark ederek sizin onlara iletmek istediğiniz bilgileri tam olarak alabilirler.

BEYLER PCYİ AÇIYORUM NORMAL AÇILIYOR AÇILINCA MAUSENİN EKRANDAKİ GÖRÜNTÜSÜ VAR VE SİMSİYAH EKRAN HİÇ AÇILMIYO NAPICAZ

Aslında bu virüs tam olarak yazılımlarımıza müdahale etmiyor sadece kayıt defterimizde ufak bir oynama ile bizi formata kadar götürecek şekilde mağdur ediyor. Eğer sizde aşağıda söyliyeceğim adımları uygularsanız bu sorundan kurtulabilirsiniz.

İlk olarak Windows Logosu+R ‘yi kullanarak çalıştırı açıyoruz (bunu ctrl+alt+delete ile görev yöneticisine giderekte çalıştırabiliriz.) Daha sonra çalıştıra regedit yazıp enterliyoruz. Karşımıza gelen pencerede HKEY_LOCAL_MACHINE > Software> Microsoft > Windows NT > CurrentVersiyon > Winlogon ‘un altındaki Shell isimli kayıda iki kere tıklayıp gelen pencereye (muhtemelen win ile başlayan bir şeyler yazmakta olacak ama farklıda olabilir) Explorer. exe yazarak tamam diyoruz daha sonra ise tekrar Windows Logosu +R ile çalıştıra Explorer yazarak çalıştır dediğimizde sorunun ortadan kalktığını göreceğiz.

Aslında yapmayı pek etik bulmamakla birlikte çözüm yolunu izleyerek ordaki shell kaydındaki Explorer. exe yazısını değiştirerek gıcık olduğumuz kişilerin bilgisayarlarınıda aynı şekilde kitleyebiliriz.

kaynak: Öğr. Görevlisi Hasan ÖZALP

Evet, Arkadaşlar Aklımda planladığım sizlerle web tasarım dersleri yayınlama ve bu konuda bir tasarımıncı’nın ihtiyaç duyabileceği tüm konularda sizlerle bilgilerimi paylaşma projemden önce aslında itiraf etmek istiyorum ki kendimi biraz yetersiz buldum ve bu doğrultuda web site tasarımı ve php kodlama konusunda iki adet kitap sipariş ettim.

Kendimi en kısa sürede kendimce yeterli seviyeye getirene kadar size bu konuda ön bilgiler vermek istiyorum.  Bu doğrultuda daha önce yayınladığım css nedir, xhtml nedir ve w3c standartları ile ilgili yazılarımı okumanızda fayda görüyorum ve gelelim bu makalemizdeki asıl konuya; bir web tasarımcısının yapacağı tasarıma başlamadan önce belirlemesi gereken bazı ilkeleri olmalı ve tasarımı bu doğrultuda yapmalı peki nedir bunlar?

Bir web site tasarımcısı tasarıma başlamadan önce yapacağı sitenin konusunu belirlemeli bu diğer ilkelerimizinde belirleyicisi olacak bir konu ki web tasarımı para için yapacak bir arkadaşımın konusu saten aldığı işi yaptıracak kişi veya şirket tarafından belirlenmiş olacağı için bu konuda pek sıkıntı çekeceklerini sanmıyorum.

Konumuzu belirledik ve tasarıma hazırız ve ikinci adıma geçiyoruz konu hakkında bilgi toplama yani eğer bir şirket sitesi tasarlayacaksak o şirketin faaliyette bulunduğu sektörde araştırmalar yapmalı ve o sektörde pazarlama tekniklerinin nasıl olduğunu öğrenmeliyiz çünkü bir şirket sitesinin asıl amacı pazarlamadır.

Konumuz belli ve bilgilerimiz hazır şimdi geldik sitenin yerleşimine ve renk tonlamasına. Sitemizi yapabileceğimiz en basit şekilde tasarlamalıyız ki giren ziyaretçi aradığını kolayca bulabilsin ve renk tonlamalarımız konumuza uygun olmalı ki kullanıcılar sitemize itibar versin önemsesinler. Şöyle ki eğer bir tekstil firmasının sitesini tasarlayan bir kişi renk tonlamalarında orta koyulukta renkler seçebilir ve yerleşimi yaparken kullanıcının aradığı bilgiyi bulması için bilgileri kategoriliye bilir.

Sitemizi Kodlamaya başladıktan sonra dikkat etmemiz gereken konu aynı Türkçe bir metin yazarken nasıl noktalama ve imla kurallarına dikkat ediyorsak kodlama kurallarına da öyle dikkat etmeliyiz ki sitemiz web tarayıcıları tarafından daha hızlı ve doğru biçimde görüntülenebilsin. Sitemizin hızla ve doğru biçimde görüntülenmesi kullanıcı memnuniyeti açısından en önemli konudur. Çünkü kullanıcılar bilgiye en hızlı ve anlaşılır biçimde ulaşmayı severler yani siteniz ne kadar hızlı açılır ve düzgün gözükürse kullanıcılar tarafında o kadar sevilir.

Sitemizi kodlarken yazım kurallarına dikkat etmemiz aynı zamanda google tarafından indexlenmemiz ve sıralamada yükselmemiz açısından önemlidir. Çünkü google hızlı açılan ve yazım kurallarına uyularak kodlanmış siteleri sever onlara daha çok değer verir.

Bu makaleyi burada bitirmek istiyorum ama tasarım konusunda daha çok söylenecek şey var daha çok bilmemiz gereken bilgiler var ama bunları tecrübe ederek öğrenmeniz sizin için daha kalıcı ve sağlıklı olacaktır diye düşünüyorum. Web tasarım derslerini yayınlamaya başlamak için inanın can atıyorum bir sonraki makaleye kadar sağlıcakla kalın… Akif ŞEN

Cascading Style Sheets yani css günümüz web tasarım dünyasının vazgeçilmezidir. Peki, bu css nedir? Ne işe yarar? Css html’de uzun ve yazması sıkıcı kodlarla yapabileceğimiz birçok şeyi sadece bir kaç satır kodla yapabilmemizi sağlayan stil şablonlarıdır. Yani sizin anlıyacağınız css ile kalıp oluşturarak onu sitemizin çeşitli yerlerinde kullanabiliriz bunun için tek yapmamız gereken hangi şablonu kullanacağını belirtmemiz.

Css günümüz web tasarım dünyasının temel öğesidir ister asp çalışın ister php çalışın css’den vazgeçemezsiniz. Hepsinin kullanıcı arayüzünde temel öğedir css ve en önemli özelliği kolay öğrenilmesidir.  Css öğrenmek istiyorsanız önce temel html bilgisine sahip olmanız ve az çok İngilizce kelimelerden kaba bir tabirle çakıyor olmanız gerekmektedir.

Css kodlaması 3 öğeden oluşmaktadır bunlar sırası ile seçici, özellik ve tanımlama bunu hemen bir örnekle gösteriyim

a{font-size:10pt}  buradaki ‘a’ link vermekte kullanılan “a” yı işaret ediyor. Yani seçicimiz font-size ise yazı boyutu özelliğini belirteceğimizi ve 10pt’de yazı boyutu özelliğini 10 punto olarak belirlediğimizi göstermektedir.

Eğer css kullanmasaydık ve 10 tane link vermemiz gerekiyorsa linklerin yazı boyutunu girmek için uzun uzun hepsine ‘ font size=”10” ‘ olarak kodlamamız gerekmekteydi css ile bunu  sadece tek satırlık bir kodla çözmüş olduk.

İlerleyen günlerde sizlere css ile ilgili çok güzel ve faydalı olacağını düşündüğüm dersler paylaşacağım beni izlemeye devam edin…

to be continued…

İşte Lockerz’daki ürünlerden bir resim…

ı zamanda elektronik bir kalem vazifeside görüyor ilginç ve çekici bir tasarıma

sahip olan mause’un kullanışlı olup olmadığı ise şuanda tartışma konusu

İşte Karşınızda eVouse Türkiye’de İlk Benim Sitemde