My Community
Duyurular: Makalelerinizi gönderin isminizle yayınlayalım.
 
*
Merhaba, Ziyaretçi. Lütfen giriş yapın veya üye olun. Ocak 24, 2017, 12:08:05 ÖS


Kullanıcı adınızı, parolanızı ve aktif kalma süresini giriniz


Sayfa: [1]   Aşağı git
  Yazdır  
Gönderen Konu: Slice Tools  (Okunma Sayısı 3624 defa)
ayvuz
Jr. Member
**

Karma: 4
Offline Offline

Mesaj Sayısı: 52



Üyelik Bilgileri WWW
« : Ağustos 19, 2008, 07:17:27 ÖS »

PSde slice tools adındaki araç çubuğu ile web sayfaları basit bir şekilde oluşturuluyor.
bunu gimpde nasıl yapabiliriz.
Logged

to live is to die
ayvuz
Jr. Member
**

Karma: 4
Offline Offline

Mesaj Sayısı: 52



Üyelik Bilgileri WWW
« Yanıtla #1 : Ağustos 19, 2008, 07:33:28 ÖS »

buldum (:
orjinal:
http://wiki.pardus-linux.org/index.php/Gimp_ile_bir_resmi_dilimlemek


Gimp ile bir resmi dilimlemek
Wiki.Pardus-Linux.Org sitesinden
Git ve: kullan, ara

Web sitesi yapımında resimleri parçalara ayırmak önemlidir. Genel yaklaşımla sitenizin öngörünüm sayfa resmini Gimp ile oluşturabilir ( örnek Gimp ile web sitesi tasarlamak , Gimp ile blog teması tasarlama , ) ve sonra bu sayfa resmini HTML çıkışlı ya da HTML siz dilimlere ayırabilirsiniz. Gimp web sayfa resminizi daha küçük parçalara dilimlemenizde size düz-ileri birkaç yol sunar. Ben burada size üç farklı yol göstereceğim. Bu yolları kısaca isimlendirelim :

1 ) düz yol : ben tek tek uğraşmaktan zevk alırım diyenlere hitap ediyor. Uyarı : uzun gereksiz bir yol. Bence sadece okuyup geçin. Yazmış olmak için yazıyorum. Uygulama gibi yazımı da zaman kaybı aslında.

2 ) HTML siz dilimlemek (Guillotine) : Gimp sadece bölsün html tablo oluşturmayı ben kendim yaparım diyenlere hitap ediyor. Web tasarımda uzman değilseniz ya da tablo oluşturmakla uğraşmak istemiyorsanız bence bunu da sadece okuyup geçin. Bilgi dağarcığımız artsın diye yazıyorum.

3 ) HTML li dilimlemek (slice) : Resmi parçalara ayırır, htlm tablo (bir nevi css diyelim) oluşturur. Hızlı, pratik , güzel...


hadi başlayalım....

1 ) düz yol :

Temelde bu basit bir kopyala/yapıştır yöntemidir. Parçalar sadece siz yapıştırıp dosya olarak kaydettiğinizde oluşur. Kopyala/yapıştırdan önce dilimlemek için kullanacağımız seçim araçlarından bahsedelim. Eğer yapacağınız tek şey web sayfa resminizi parçalara ayırmaksa “dörtgen seçim aracı” işinizi görür. Kopyala/yapıştır işlemi için düzen menüsünü kullanabilir ya da kısa yolları tercih edebilirsiniz. Resmin seçili bir bölümünü kopyalamak için Ctrl+C ve yapıştırmak için Ctrl+V tuşlarını kullanınız. Kopyala/yapıştır işlemleri arasında yeni bir resim oluşturmanız lazım. Çünkü kopyaladığımız resmi yapıştırmamız için bir yere ihtiyacımız var. Bunun için dosya>yeni yolu ( ya da Ctrl+n kısa yolu ) ile bir resim oluşturup dilimimizi yeni resme yapıştıralım.

Kısaca üç adımda resmi dilimliyoruz. 1 ) CTRL+C ile istediğimiz bölümü kopyalıyoruz. 2 ) CTRL+n ile yeni bir resim oluşturuyoruz. 3 ) CTRL+v ile dilimimizi yeni resme yapıştırıyoruz.

bu arada CTRL+n ile CTRL+v arasında başka biryere basma ya da başka bir şey yapma ki oluşan yeni resmin boyutu dilimimizle aynı olsun. Aksi halde yanlış boyut oluşabilir ve yeniden boyutlandırmak zorunda kalabiliriz. Bu arada bi hatırlatma ; yanlış bir işlem yaptığınızda CTRL+z ile işlemi geri alabilirsiniz. Gimp istediğiniz kadar geri alma imkanını size verir.

Gimp'de yeni yapıştırılan resimler kaydedilmeden önce çıpalanmalıdır (katman>katmanı çıpala). Bu tuhaf gelebilir ama resmin çıpalanması için tuval üstünde yüzmesine izin verildiği düşünüldüğünde mantıklı oluyor. Gerçi bizim kopyaladığımız bölüm tuvalle aynı boyutta olduğundan yüzeceği bir yer yok. Dolayısıyla Ctrl+h kısa yoluyla resmi çıpalayalım ve Ctrl+s kısa yolu ile .jpg veya .gif olarak kaydedelim. 255 veya daha düşük renkler için gif daha büyükleri için jpeg ya da png tercih edilebilir.


2 ) HTML siz dilimlemek (Guillotine) : Resmi gimp ile açın. Resim>klavuzlar>new guide ile resminize yeteri miktarda yatay (horizontal) ve düşey (vertical) klavuzlar ekleyin. Ctrl+m tuşlarına basdıktan sonra bu kılavuzları fare ile resmin üstünde istediğiniz yere sürükleyebilirsiniz. Bu şekilde yatay ve düşey kılavuzları resmin nasıl parçalanmasını istiyorsanız öyle yerleştirin. Yerleştirme işlemi bittikten sonra Resim>dönüştür> Guillotine yolunu takip edin. Birkaç saniye içinde masaüstünde parça şeklinde bir çok resim oluşacak. Herbir resmi ayrı ayrı kaydedin.

3 ) HTML li dilimlemek (slice) : Resmi gimp ile açın. Resim>klavuzlar>new guide ile resminize yeteri miktarda yatay (horizontal) ve düşey (vertical) klavuzlar ekleyin. Ctrl+m tuşlarına basdıktan sonra bu kılavuzları fare ile resmin üstünde istediğiniz yere sürükleyebilirsiniz. Bu şekilde yatay ve düşey kılavuzları resmin nasıl parçalanmasını istiyorsanız öyle yerleştirin. Yerleştirme işlemi bittikten sonra Filtreler>web>slice yolunu takip edin. Açılan pencerede :

path for html export  : resimlerin ve html belgesinin oluşmasını istediğiniz dizini seçin

image format .png tavsiye edilir

seperate image folder yes

ve diğer bilgileri kendinize göre doldurun ya da boş bırakın. tamam düğmesine basın. Seçtiğiniz dizinde resim parçalarını ve html belgenizi bulabilirsiniz.
Logged

to live is to die
admin
Administrator
Sr. Member
*****

Karma: 18
Offline Offline

Mesaj Sayısı: 453



Üyelik Bilgileri WWW
« Yanıtla #2 : Ağustos 19, 2008, 11:08:08 ÖS »

Teşekkürler bu dersi daha önce de görmüştüm. Ama dilimlemek dışında html ve css kısmı var onları da öğrenip uyarlamak lazım. Biraz ayrıntılı bir makale. ileride inşallah videosunu hazırlamayı düşünüyorum.
Logged

Gimp:
Hayal Gücünüzün Gerçek Dünyadaki Görünüşü. [Real-world view of your imagination]
Güneş enerjisi dükkanı = http://elektrosolar.blogspot.com
Android Program Depo = http://www.apkbuy.com
ayvuz
Jr. Member
**

Karma: 4
Offline Offline

Mesaj Sayısı: 52



Üyelik Bilgileri WWW
« Yanıtla #3 : Ağustos 22, 2008, 03:16:21 ÖS »

fakat yinede Fireworks ve PS deki gibi pratik değil bunun daha pratik yolu olmalı.
Logged

to live is to die
ivme
Administrator
Sr. Member
*****

Karma: 28
Offline Offline

Mesaj Sayısı: 391



Üyelik Bilgileri WWW
« Yanıtla #4 : Eylül 03, 2008, 08:43:03 ÖÖ »

pardus-linux forumundaki bir soru için bu yazıyı hazırlamıştım. yazıda da belirttiğim gibi benim bildiğim üç yol var. daha pratik bir yol maalesef bildiğim kadarı ile yok. webdersleri sitesinden izlediğim kadarı ile Potoshop programında da benzer yöntemler var. o da gimp gibi otomatik css oluşturamıyor. bu konuda profosyonel çalışmalar yapabilmek için css bilmeniz şart. css öğrenmesi kolaydır. google da arama yaparsanız pek çok Türkçe kaynak bulabilirsiniz. tavsiyem fatih hayraoğlu'nun pdf formatındaki kitabının okumanız. kitaba buradan ulaşabilirsiniz.
Logged
admin
Administrator
Sr. Member
*****

Karma: 18
Offline Offline

Mesaj Sayısı: 453



Üyelik Bilgileri WWW
« Yanıtla #5 : Eylül 03, 2008, 09:15:34 ÖÖ »

Bu ücretsiz kitabı kesinlikle tavsiye ederim. Çok anlaşılır ve harika bir kitap. CSS ve mantığını öğrenebilirsiniz.
Aynı zamanda kitabın yazarının şahsi blog sayfası da var blog sayfasından.

Teşekkürler.
« Son Düzenleme: Eylül 03, 2008, 09:56:18 ÖÖ Gönderen: admin » Logged

Gimp:
Hayal Gücünüzün Gerçek Dünyadaki Görünüşü. [Real-world view of your imagination]
Güneş enerjisi dükkanı = http://elektrosolar.blogspot.com
Android Program Depo = http://www.apkbuy.com
Sayfa: [1]   Yukarı git
  Yazdır  
 
Gitmek istediğiniz yer:  

MySQL ile Güçlendirildi PHP ile Güçlendirildi Powered by SMF 1.1.20 | SMF © 2006-2008, Simple Machines

XHTML 1.0 Geçerli! CSS Geçerli! Dilber MC Theme by HarzeM
echo