Photoshop ile Web Tasarımı

Merhaba arkadaşlar şimdi size gördüğünüz en güzel sitelerin, site şablonlarının, hazır css dosyalarının yada adına her ne diyorsanız html sayfaların görüntü kısmını oluşturma işlemini yayınlıyorum. Photoshop programı ile site tasarlandığını birçoğumuz duymuştur ama nasıl yapıldığını pek az kişi biliyor. Aşağıdaki resim gibi rasgele bir resim çizin fakat bir site ön planına benzetin resimi.


Şimdi bu resimi html'ye çevirme olayına geldik. Photoshop'ta sol taraftaki araç kutusunda slice tool ile sayfamızı aşağıdaki gibi bölümlere ayırıyoruz.


Daha sonra aşağıdaki resimdeki yolu izleyerek dosyamızı kaydediyoruz.


Karşımıza böyle bir pencere açılacak;


Ayarlarımızı yaptıktan sonra kaydet butonuna tıklıyoruz ve sitemiz hazır dilerseniz dahada detaylandıralım. Bu yaptıklarımız bir tablo içine kesik kesik resimler halinde yerleştirilip karşımıza geliyor. Resim olarak göründüğü içi öalınması daha kolay bizde bu resmi arkaplan olarak gösterirsek bizim için daha güvenli ve sade bir görüntü olmuş olacak. Bunun için kaynak kodlara gelerek;


<td colspan="7" width="1000" height="214"><img src="../Fatih Site Şablon/images/İndex_02.jpg" width="1000" height="214"></td>

Şeklindeki eklenen resimleri silerek,

<td colspan="7" width="1000" height="214" background="images/İndex_01.jpg"></td>

Şeklinde arkaplan resimleri oluşturacağız. Fakat her bölüm için ayrı ayrı işlem yapmamız gerekiyor. Bölüm sayısı arttıkça ortaya daha profesyonel ve daha zahmetli iş çıkıyor. İyi çalışmalar...


Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

Corel Draw Arrange/Organizasyon Menüsü Kullanım Alanları

Resim
CorelDRAW X4 versiyonu üzerinden anlatımla, CorelDRAW öğrenmeye giriş bölümünü oluşturma amaçlı bir küçük görsel anlatım. Bu derslerimizi oluştururken gözden kaçırdığımız veya ifadelerde bir takım eksik noktalar yada detaylar olabilir, lütfen konu hakkında gerçek bilgi ve tecrübesi olan arkadaşlarımız beni/bizi yalnız bırakmazlarsa hedefe ulaşabilmek için büyük bir adım olacaktır, Sitemizdeki mevcut bilgilerin güncellenmesi adına... Corel DRAW 'a Yeni Başlayanlar İçin Güncel Ders Anlatımı / Menüleri Tanıyalım; This image has been resized. Click this bar to view the full image. The original image is sized 3287x1470. Arrange /Organizasyon Menüsü Transformation - Dönüşümler : Corel sayfasında seçili nesnelerin konum, eğim, eğrileme, çevirme, ölçülendirme gibi ayarlamaları yapmayı sağlar Position - Konum (Alt+F7) : Seçili nesnenin x ve y koordinatlarında konumunun değiştirilmesini sağlar Rotate - Dönme (Alt+F8) : Seçili nesnenin bir açı değeri girilerek çevril...
Devamı

Corel Draw Effects Menüsü Kullanım Alanları

Resim
CorelDRAW X4 versiyonu üzerinden anlatımla, CorelDRAW öğrenmeye giriş bölümünü oluşturma amaçlı bir küçük görsel anlatım. Bu derslerimizi oluştururken gözden kaçırdığımız veya ifadelerde bir takım eksik noktalar yada detaylar olabilir, lütfen konu hakkında gerçek bilgi ve tecrübesi olan arkadaşlarımız beni/bizi yalnız bırakmazlarsa hedefe ulaşabilmek için büyük bir adım olacaktır, Sitemizdeki mevcut bilgilerin güncellenmesi adına... Corel DRAW 'a Yeni Başlayanlar İçin Güncel Ders Anlatımı / Menüleri Tanıyalım; Effects /Efektler Menüsü Adjust - Ayarla : Corel sayfası içerisine çağırılan (import edilen) resim dosyalarının ışık, kontrast ve renk ayarlamalarının yapılmasını sağlar ----------------------------------------------------------------------------------------- Bu bölüm çok önemli ve özeldir şöyle ki; Corel kullanıcı arkadaşların göz ardı ettiği; fotoğraf ve resim düzenlemek için pixel tabanlı çalışma imkanının olduğunun bir sekme menüsüdür, Photo-Pain...
Devamı

Corel Draw 10 Üzerinden Kullanım Anahatları - Önemli Bilgiler

Resim
1. GİRİŞ CorelDRAW programı, vektör tabanlı bir grafik tasarım programıdır. CorelDRAW illüstratörlerin, tasarımcıların ve profesyonel sanatçıların çalışmalarına yeni boyutlar katacaktır. CorelDRAW resim meydana getirmek için benzersiz yöntemler kullanır. CorelDRAW bit eşlem grafik tasarım paketlerinden farklıdır. Vektör tabanlı bir programdır; yani resimleri matematiksel olarak belirlenmiş vektörler olarak yaratır ve bu şekilde kullanır. Vektörler, hem büyüklüğü ( boyutu ) hem de yönü ( açı, eğri vb.) olan nesnelerdir. İçinde grafik tabanlı resim saklanan dosyalar listeler halinde yazılmış satırlardan oluşur. Bu satırlarda vektörel grafiğin yeri,yönü uzunluğu, rengi ve eğrisiyle ilgili bilgi bulunur. Resimleri vektörel tanımlamak, piksel tanımlamaktan daha etkilidir. Çünkü; piksel tanımlamada bir çizimde binlerce piksel bulunur. Oysa vektor tanımlama da çizimi matematiksel tanımlayarak daha az yer tutmasını sağlayabiliriz. Vektör grafiklerin , piksel tabanlı gr...
Devamı