Okurlarımızdan gelen çok sayıda talep nedeniyle, bugün tasarımını veya daha doğrusu Photoshop'ta sitenin düzenini yapacağız. Tabii bununla hiç karşılaşmadıysanız, bunu yapmak oldukça zor, bugün cevaplamaya çalışacağım birçok soru ortaya çıkıyor. Görünüşe göre internette bu konuda çok fazla materyal yok. Çok sayıda tasarımcı var, ancak kimse bir web sitesi düzeninin nasıl yapılacağını söylemiyor. Belki sadece kötü görünüyordum? :)

Devamı

Genel olarak, şimdiden yapalım.

Başlangıç \u200b\u200bolarak, sizinle tamamen sökeceğimiz basit bir düzen hazırladım. Şöyle görünüyor:

Gördüğünüz gibi, şablonun karmaşık olmadığı ortaya çıktı, elbette daha sonra HTML olarak dizeceğimiz bir blog şablonu. Bu arada sadece çizelim. Şimdi gidelim.

Yazılım

İhtiyacınız olan ilk şey Photoshop. Eğer yoksa, satın al :-)

Belge oluşturma ve boyutlar

Photoshop'ta yeni bir belge oluşturmak için "Dosya" ya gitmeniz ve "Yeni" yi tıklamanız gerekir, ardından uygun boyutları ayarlamanız gereken bir pencere açılacaktır.

Boyutlar, gelecekteki sitenizin ne kadar geniş olacağına bağlıdır. Örneğin, bitmiş sitenin genişliğinin 1000 piksel olacağına karar verdiniz, bu nedenle belge boyutunun biraz daha büyük, 1200 piksel civarında bir yerde yapılması gerekiyor. Bu, öncelikle kolaylık sağlamak için yapılır, böylece düzeniniz tarayıcıdakiyle aynı görünür.

Yükseklik ile ilgili olarak, boyut şablonun temasına bağlı olarak belirlenir. Ama tercihen daha fazlasını yapın, bence 4000 piksel yeterli. Bu, gelecekte tüm unsurların uyması için yapılır. Çünkü bir şekilde küçük bir yükseklik yaptım ve sonra her şeyi yeni bir belgeye aktarmak zorunda kaldım.

Benim durumumda site 1200px genişliğinde olacak. Bu şekilde belgeyi 1300 piksel genişliğinde ve 4000 piksel yüksekliğinde yaptım. Ayarların geri kalanını olduğu gibi bırakın.

Web sitesi şablonu arka planı

Belgeyi oluşturduktan sonra, öncelikle sitenin arka planını oluşturun. Renk ya da resim olması fark etmez, ama yapın. Benim durumumda, sadece beyaz bir arka plan. Renk seçicide Doldurma aracını seçin, beyazı seçin ve ardından arka planı tıklayın.

Gelecekteki sitenin genişliği 1200 pikseldir

Şimdi, gelecekteki sitenin boyutunu, tarayıcıda görüneceği gibi görünecek şekilde ayarlamamız gerekiyor. Bunu bir cetvel kullanarak yapacağız. Sizin için aktif değilse, "Görünüm" e gitmeniz ve "Cetvel" i işaretlemeniz gerekir. Ardından görüntüleme pencerenizde görünmelidir.

Ve şöyle görünüyor:

Katmanımızı seçin, sadece bir kez tıklamanız yeterli:

Ve şimdi belgemizin ortasına bir cetvel koymalıyız ya da daha doğrusu merkezi bulmalıyız. Bunu yapmak için, imleci üzerindeki cetvelin üzerine getirin, farenin sol düğmesini basılı tutun ve çizgiyi belgemizin üzerine çizin. Ortaya doğru çekin, cetvel merkezin kendisini bulacaktır.

Merkezi bulduktan sonra 1200 piksel genişliğindeki sitemizi belgenin ortasına yani 1300 piksele yerleştirmemiz gerekiyor. Bunu yapmak için Dikdörtgen Bölge aracını seçin, Stili üstte Belirtilen Boyut olarak ayarlayın, burada şu değerleri yazıyoruz: genişlik - 1200px, yükseklik 400px. Ardından, beyaz arka planımıza tıklamanız yeterlidir ve ihtiyacımız olan genişlikte seçilmiş bir alana sahip olacağız.

Şimdi seçimimizi fareyle merkeze yerleştiriyoruz, merkezin kendisini bulacak. Ardından 2 cetvel daha çıkarmanız ve seçimin her iki tarafına da yerleştirmeniz gerekir. Böylelikle 1200 piksel genişliğe sahip olacak sitemizin sınırlarını işaretliyoruz. Ayrıca bunlar için tasarım öğelerini özelleştirmeyi de kolaylaştıracaktır. Anlamıyorsanız, aşağıdaki resimdekinin aynısını yapın.

Cetveli gelecekte kullanacağız, burada onsuz yapamayacağınız için her şeyi tam olarak ayarlamanıza izin veriyor.

Artık belgemizi neredeyse tamamen hazırladık. Ortayı bulduk ve tırmanmanız gerekmeyen tam boyutu belirttik. Şimdi en ilginç şeye, yani bir web sitesi tasarımı (düzeni) oluşturmaya geçelim.

Site tasarımının veya düzeninin oluşturulması

Önemli!

Her zaman katmanlar için gruplar oluşturun ve onlara adlar verin. Çünkü gelecekte kesinlikle kafanız karışacak!

Gruplar

Bir grup oluşturun ve ona "Başlık" (Hat) adını verin, grubun altında bir "Üst Menü" oluşturun, çünkü onunla başlayacağız. Grupta yeni bir katman oluşturun ve "arka plan" olarak adlandırın. Bu, üst menümüzün arka planı olacak.

İşte almanız gerekenler:

Üst Menü

Yine cetveli çizin ve resimdeki gibi ayarlayın:

Dikdörtgen Seçim Çerçevesi Aracı'nı seçin ve yatay cetvel boyunca seçim yapın:

Renk paletinde, bu renk # 0dbfe5 ile sürün, "Doldur" aracını seçin ve seçilen alanı doldurun, ardından "Seçim" sekmesinde seçimi kaldırmanız gerekir, "Seçimi Kaldır" a tıklayın:

Yatay Metin aracına tıklayın. Üstteki panelde "Segoe UI" yazı tipini seçin. Şimdi menünün mavi arka planına tıklayın ve sayfalarımızın adını yazın. Ardından metni istediğiniz yere taşıyabilirsiniz.

Şimdi sayfalar arasında ayırıcılar oluşturuyoruz. Ve onlara hafif bir girinti efekti verelim. Yeni bir katman oluşturun ve Çizgi aracını seçin. Ardından Shift tuşunu basılı tutun ve menümüzün tüm mavi arka planı boyunca dikey bir çizgi çizin.

Şeklin olduğu katman üzerinde, fare ile çift tıklayın, katman stilinin olduğu bir pencere açılacaktır. "Renk Kaplama" üzerine bir onay işareti koyun ve bu renk # 0aaacc ile oraya sürün.

"Gölge" öğesine gidin ve aşağıdaki parametreleri ayarlayın:

İşte almanız gerekenler:

Bundan sonra, katmanı kendi çizgimizle kopyalayın ve her kelimeden sonra yerleştirin. Ben de öyle yaptım:

Social Bookmarking Simgeleri

Burada menüye yalnızca sağ taraftaki yer imi simgelerini ekleyeceğiz. Benim durumumda, bu, ancak normal indirilen simgeleri de yükleyebilirsiniz. Buradan indirebilirsiniz.

Öncelikle, bir cetvel kullanarak, simgelerimizin yüksekliğini eşit olacak şekilde ayarlamanız gerekir. İşte yapmanız gerekenler:

Sonra bir grup oluşturuyoruz, buna "Sosyal Yer İmleri" diyoruz, içinde yeni bir katman oluşturuyoruz. Şimdi "Özel Şekil" aracına tıklayın ve istediğiniz şekli seçin:

İmleci, simgenin olacağı yere götürün, Shift tuşunu basılı tutun (böylece simge eşit görünecektir) ve istediğiniz boyuta uzatın. Ve aynı işlemi aşağıdaki şekillerde tekrarlıyoruz. Sonunda, almanız gereken şey bu:

Logoya geçiyorum. Yine logo için ve yeni bir katmanda ayrı bir grup oluşturun.

Logo

Bu siteye gidin ve yazı tipini indirin. Yatay Metin aracını seçin. Yazı tipi alanında Olivier yazı tipimizin adını arıyoruz. Logonun yerleştirileceği yere tıklıyoruz ve adını İngilizce yazıyoruz çünkü bu yazı tipi Kiril alfabesini desteklemiyor. İşte almanız gerekenler:

Bir grup "Alt Menü" ve yeni bir katman oluşturun.

Alt Menü (Ana)

Cetvelleri resimdeki gibi ayarlıyoruz:

Dikdörtgen Seçim Çerçevesi Aracı'nı seçin ve seçin. Ardından seçilen alanı bu renk # 303030 ile doldurun. İşte almanız gerekenler:

"Seçim" sekmesinde seçimi kaldırın. Şimdi Filtreler - Gürültü sekmesine gidin ve Gürültü Ekle'yi seçin. Ardından aşağıdaki değerleri belirledik:

Satır ekleyin. Üst menüdekiyle aynı şekilde yapılırlar, sadece çizgi renginin kendisi değiştirilmiştir. Bence halledebilirsin ve şunu almalısın:

Şimdi kullanıcıya sitenin neresinde olduğunu söyleyecek bilgilerle panele dönüyoruz.

Her zamanki gibi, "Başlık" grubunda, yeni bir katmanla "Bilgi Paneli" grubunu oluşturun.

Bilgi paneli

İlk olarak, aşağıdaki resimde gösterildiği gibi cetvelden çizgiler ekleyin:

"Dikdörtgen Seçim Çerçevesi" aracını seçin ve menünün hemen altındaki alanı seçin ve siyah renkle # 000000 doldurun

Seçimin seçimini kaldırın, "Yatay Metin" i alın ve yazı tipi boyutunu 48 pt ve # a4a4a4 rengine değiştirin. "Son Girişler" yazıyoruz. İşte sonuçlanmanız gerekenler:

İçerik

Gelecekteki sitemizin ortasındaki işaretlemeye geçelim. Yazı bloklarının ve site çubuğu bloğunun (Sağ sütun) nerede olacağını işaretlemek için bir cetvel kullanmamız gerekir.

Hemen 2 ayrı grup oluşturmanız gerekir:

• Etiketler - bu gruba sütunlarımızın boyutu ile metin ekleyeceğiz.
• İçerik - sitenin tüm ortasının yer alacağı grup.

Grupta, bloklarımızı kayıtlarla içerecek olan "Sol" grubu altında içerik oluşturun.

Dikdörtgen Seçim Çerçevesi Aracını seçin, belirtilen boyut stiline ayarlayın ve genişliği 800 piksel ve yüksekliği 100 piksele ayarlayın. İşte alt satır:

Resimdeki gibi cetvelden çizgiler ekleyin ve seçimi kaldırın:

"İçerik" grubunda, bunu "Sağ" (Sitebar) adlı bir grup altında yapıyoruz. Sitenin sağ sütunu için alanı işaretleyeceğiz.

Yine "dikdörtgen alanı" alıyoruz, ancak alan stilinde 350px genişliğinde biraz daha küçük bir boyut belirledik ve yükseklik 100px'de aynı kalacak. Ve sonra her şeyi resimdeki gibi yapıyoruz:

Artık kayıtların ve site çubuğunun bulunduğu blokların tam olarak nerede olacağını biliyoruz. Ve her şey pürüzsüz olacak.

Bir etiket grubu oluşturduğumuzu hatırlıyor musunuz? Orada, benimki gibi blok boyutu etiketleriyle bir katman oluşturun:

Bu etiketler düzende çok yardımcı olacaktır. Boyutları hatırlamanıza gerek kalmayacak.

Kayıtlı bloklar

Kayıtlı bloklarla başlayalım, bu durumda çok basit bir şekilde yapılırlar.

"Sol" grupta bir alt grup "blok" ve yeni bir katman oluşturun.

Dikdörtgen Seçim Çerçevesi Aracını tekrar seçin. Stilde boyutları 800 x 300 olarak ayarlayın. Çizgilere uyacak şekilde ayarlayın. Ardından bu renkle # d9d9d9 doldurun. Bu bir minyatür.

Aynı gruba yukarıdaki resimde benimki gibi bir metin kullanarak bir etiket ekleyin.

Şimdi gönderiye bir başlık ekleyelim. "Yatay Metin" alın ve boyutu 35 pt ve rengi siyah olarak ayarlayın. Küçük resmin hemen altına ekleyin:

Gönderiye bilgi ekleniyor. Yazı tipi boyutunu 14 pt'ye ve rengi griye yakın olarak ayarlayın:

Ve gönderinin açıklaması:

Şimdi metni ekleyin ve ne aldığımızı görün:

Girişleri biraz daha da ayırmak için dairelerden basit bir ayırıcı oluşturalım.

Bir "Ayırıcı" grubu oluşturun, "Oval alan" ı seçin ve bir katman oluşturun. Kayıt bloğunun altında, Shift tuşunu basılı tutarak bir daire çizin, ardından bu #efefef rengiyle doldurun.

Seçimi kaldırın ve cetveli kullanarak dairenin ortasını bulun

Üzerinde dairemiz bulunan katmanı seçin, farenin sağ tuşuna basın ve "Katmanı Kopyala" yı seçin. Hafifçe sola doğru sürükleyin.

Üst panelde, "Düzenleme" sekmesine gidin - Dönüştür ve Ölçeklendirme'yi seçin. Ve Shift tuşunu basılı tutarken çemberi birincisinden biraz daha küçük hale getiriyoruz, böylece daire eşit olacak.

İşte almanız gerekenler:

Bu küçük dairenin katmanını tekrar çoğaltın ve sola doğru hareket ettirin. Ayrıca boyutunu tam olarak yukarıda yazıldığı gibi küçültürüz, böylece şöyle görünür:

Şimdi orta daireyi kopyalayıp sağa hareket ettirmeniz ve aynısını küçük daire için yapmanız gerekiyor. Daha net hale getirmek için resimdeki gibi yapın:

Ve işte sadece normal boyutta olan şey:

Şimdi kayıt bloğunu bloğun altına yerleştiriyoruz. "Blok" grubumuzun bir kopyasını oluşturun Araç çubuğunda imleci seçin (en üstteki). Ve kayıt bloğumuzu aşağıya sürükleyin. ve biz de bunu 5 kez yapıyoruz.

Kenar çubuğu (sağ sütun)

"Kenar Çubuğu" grubumuzu buluruz ve içinde bir "Ara" alt grubu oluştururuz. Bir hat yardımıyla bunu şöyle yaparız:

Dikdörtgen Seçim Çerçevesi Aracı'nı seçin ve arama alanını seçin, ardından bu renkle doldurun #eeeeee

Seçimi iptal etmeyi, "Yatay Metin" aracına tıklamayı ve gri alana Ara kelimesini yazmayı unutmayın.

Solda, Serbest Şekil aracını seçin ve üstte bir büyüteç şekli arayın. Standart şekillerde mevcuttur. "Ara" grubunda bir katman oluşturun, alanın üzerine gelin ve Shift tuşunu basılı tutarken şeklimizi çizin.

Arama alanı hazır. Şimdi widget'lara geçelim.

Bir grup "widget" ve içinde yeni bir katman oluşturun. Ardından resimdeki gibi çizgiler ekleyin. Bu, başlığımızın arka planı olacak ve onu #eeeeee rengiyle dolduracak.

Şimdi başlığın kendisini başlığımıza eklememiz gerekiyor, bunu metin yardımı ile yapıyoruz. Ayrıca başlığa bir simge ekleyeceğiz. Bunu yapmak için beğendiğiniz ve anlama uyan herhangi bir şekli seçmeniz gerekir :) Şekil eklerken Shift tuşunu basılı tutmayı unutmayın. Ve bu rengi # 0dbfe5 ile doldurun

Ve elbette widget'larımıza girişler eklememiz gerekiyor. Yatay metin aracını seçin, ardından boyutu 16 pt olarak ayarlayın. Ve aşağıdaki resimdeki ka'yı yapın

Ardından grubu çoğaltın ve widget'ı aşağı sürükleyin. Yazılarla aynı şeyi yapıyoruz.

Şimdi, gelecekteki sitemiz için neredeyse bitmiş ve basit bir düzen gözlemleyebiliriz.

Altbilgi (Sitenin alt kısmı)

Peki, onsuz nasıl olabilir? Bu şablonda da çok karmaşık değil.

Her zamanki gibi, bir "Altbilgi" grubu ve içinde bir katman oluşturun. Ve onu bir cetvelle işaretleyin, zaten favori aracımız olan "dikdörtgen alan" ı seçin, onu seçin ve # 0dbfe5 ile doldurun

Seçimi iptal edelim. "Yatay Metin" i alın, indirdiğimiz yazı tipini bulun (Olivier) ve logomuzu girin, yalnızca metin rengini biraz daha koyulaştırın.

Ve altbilgimizin sağ tarafına, yukarıdakiyle aynı, ancak çizgisiz bir menü ekleyin. Hatta kopyalayıp aşağı taşıyabilirsiniz.

Hepsi bu, arkadaşlar, ns'nin zaten yazabileceğiniz hazır bir düzeni var :)

Ayrıca, PSD dosyası burada. İndirin ve anlamadığınız bir şey olup olmadığına bakın.

Arkadaşlar, hiçbir şey anlamıyorsanız, yorumlarda sorduğunuzdan emin olun.

Yakında görüşürüz.

Adobe Photoshop CS5'te görüntü oluşturmak ve düzenlemek için kullanılan yardımcı araçları düşünün. Bunlar cetveller, kılavuzlar ve bir ızgaradır.

Photoshop'ta cetveller

Cetveller, görüntünün dışında solda ve üstünde görülebilir. Menüyü kullanarak cetvelleri açın ve kapatın Görünüm - Cetveller.

Cetvel birimleri ayarlarda değiştirilebilir. Değiştirmek için şuraya gidin: Editör - Tercihler - Birimler ve Cetveller, ve üst paragrafta ihtiyacınız olanı seçin.

Cetveller için varsayılan referans noktası üst köşedir. Cetvellerin kesişme noktasına farenin sol tuşu ile tıklayıp resmin üzerine sürükleyerek başlangıç \u200b\u200bnoktasını değiştirebilirsiniz. kökenini planladığınız yere. Ardından fare düğmesini bırakın.

Referans noktasını yerine geri döndürmek için cetvellerin kesişme noktasına çift tıklayın.

Photoshop'taki kılavuzlar

Kılavuzlar, bazı nesneleri ve seçimleri yapıştırabileceğiniz çizgilerdir. Kılavuz oluşturmak için cetvele sol tıklayın ve serbest bırakmadan çizim üzerinde aşağı doğru sürükleyin. Bu cetvele paralel bir kılavuz belirir. Cetvellerin yardımıyla, resimdeki kılavuzları kenardan önceden belirlenmiş bir mesafede tam olarak konumlandırabilirsiniz.

Örneğin, yuvarlak veya oval bir nesne seçmek istiyorsunuz. Bunu yapmak için, istenen nesneyi bunlarla sınırlamak için dört kılavuz yapın: iki yatay ve iki dikey. Bundan sonra aracı seçin Oval alan, ve kılavuzların ilk kesişim noktasından ikinci kesişme noktasına çapraz olarak bir seçim yapın. Seçim tam olarak kılavuzlara bağlı kalacaktır.

Seçimden sonra, seçilen alanla istediğinizi yapabilirsiniz, örneğin daha zıt veya daha parlak hale getirebilir veya rengi değiştirebilirsiniz.

Mevcut bir kılavuzu taşımak için basılı tutun Ctrl, ve kılavuzu yeni bir konuma taşıyın. Aracı da kullanabilirsiniz Hareketli.

Kılavuzları Photoshop'ta ayarlarken, daha hassas hale getirmek için yakınlaştırmayı kullanın.

Nesnelerin ve seçimlerin kılavuzlara yapıştırılması menü kullanılarak devre dışı bırakılabilir veya etkinleştirilebilir Görünüm - Yapış. Seçimi kullanarak farklı bağlantı elemanlarını seçmek de mümkündür. Görünüm - Şuraya yasla. Bu noktada kılavuzlara, ızgara çizgilerine, katmanlara, belge sınırlarına yapışabilirsiniz.

Kılavuzları kaldırmak için menüye gidin Görünüm - Kılavuzları Kaldır. Görüntünün dışına sürükleyerek de kılavuzları kaldırabilirsiniz.

Ek olarak, menü kullanılarak Photoshop'ta yeni bir kılavuz oluşturulabilir Görünüm - Yeni kılavuz. Oluştururken, kılavuzun yönünü ve konumunu seçtiğiniz bir iletişim kutusu görünür. Bu yöntem, rehberin tam olarak nerede olması gerektiğini bildiğiniz zaman iyidir.

Kılavuzun yönünü dikeyden yataya veya tersi yönde de değiştirebilirsiniz. Bunu yapmak için tuşunu basılı tutun Alt, daha sonra 90 derece döndürülmesini beklediğiniz kılavuza tıklayın.

Photoshop'ta ızgara

Izgara, Photoshop'ta kolaj oluşturma, montaj ve nesnelerin doğru bir şekilde konumlandırılmasına ihtiyaç duyduğunuz diğer durumlar için kullanışlı başka bir araçtır.

Izgaranın görünmesi için menüden seçin Görünüm - Göster - Izgara. Izgara boyutu, Adobe Photoshop CS5 programının ayarlarında ayarlanır. Ayarlara gitmek için. menüden seçin Düzenleme - Tercihler - Kılavuzlar, Izgara ve Dilimler. Ayarlarda belirtebilirsiniz. noktalar kullanılarak ızgara çizgilerinin ne sıklıkla yerleştirileceği Her satır ve İç bölüm, ana ve küçük ızgara çizgilerinin frekansını ayarlar.

Şimdi, cetvelden bir kılavuz çıkarırsanız, otomatik olarak ızgara çizgilerine yapışacaktır. Bir seçim oluşturursanız, ağın çizgilerine ve düğümlerine de yapışır. Yapışma menü kullanılarak devre dışı bırakılabilir Görünüm - Tuttur - Kılavuz Çizgileri.

Izgarayı kaldırmak için şuraya gidin: Görünüm - Göster, ve kutunun işaretini kaldırın Kafes.

Web tasarımı üzerine başka bir ders. Burada, 960 Izgara Sistemini kullanarak web sitesi düzenlerini nasıl oluşturacağınızı gösteriyoruz. Bu yerleşim teknikleriyle doğru konumlandırma sürecinin nasıl net ve şeffaf hale geldiğini göreceksiniz. Ayrıca bu dersin sonunda siteniz için şık, temiz bir cilde sahip olacaksınız.

Aşama 1

Photoshop'ta 1680 piksel genişliğinde ve 1100 piksel yüksekliğinde yeni bir belge oluşturarak başlayın, ardından arka planı soluk gri # F9F9F9 ile doldurun.

Adım 2

Web'de çok sayıda mizanpaj ızgarasının yanı sıra bunların nasıl oluşturulacağına ilişkin dersler mevcuttur. Bu dersin amacı, daha önce bu tür ızgaralarla hiç karşılaşmadıysanız sizi hızlandırmaktır. Onların yardımıyla, düzen süreci önemli ölçüde hızlandırılabilir ve sayfa şablonlarının yüksek kaliteli prototiplerine yol açabilir. 960 Grid System işaretlemesini indirin. Bağlantıdan indirdikten sonra, dosyayı açın ve bu klasörü açın. “960 12 sütun ızgarasını” Photoshop'a yükleyin.

Şimdi ızgarayı belgemize aktarmamız gerekiyor. “12 col Grid” grubunu seçin, tek bir katman halinde birleştirin ve ardından ana belgeye aktarın. Izgaranın yüksekliği belgeden biraz daha küçük olacaktır, bu nedenle uçları belgenin üstüne ve altına temas edecek şekilde dikey olarak uzatmanız gerekir.

Şimdi ayrıca bir string tabanı oluşturmamız gerekiyor. Bu ızgara, girintileri öğeler arasında dikey olarak doğru bir şekilde yerleştirmemize ve paragraflar ve mantıksal bloklar arasında metindeki satır aralığını kontrol etmemize yardımcı olacaktır. İlk olarak, Photoshop'ta başka bir 24 x 24 piksel dosya oluşturun, arka planı kaldırın ve çalışma yüzeyinin en son satırı boyunca tek bir 1 piksellik çizgi çizin. Onu şablon olarak kaydetmemiz (Düzenle\u003e Desen Tanımla) ve ona ayırt edici bir isim vermemiz gerekiyor.

Çalışma alanını üç kılavuzla işaretlemeye devam ediyor. Yeni bir dikey kılavuz oluşturun: Görünüm\u003e Yeni Kılavuz, Dikey'i seçin ve 360 \u200b\u200bpiksel olarak konumlandırın. Benzer şekilde, 840px ve 1320px'de iki kılavuz daha oluşturun. Bu yüzden 360px ve 1320px işaretleri arasında 960px'lik bir alan seçtik ve belgenin tam ortasında bir kılavuz yaptık.

960 Grid System ile doğrudan bir dosyadan çalışıyorsanız, içinde zaten ayarlanmış uygun kılavuzlar vardır. Görünüm\u003e Göster\u003e Kılavuzlar'ı açmanız yeterlidir.

Aşama 3

Artık hazır bir işaretleme şablonumuz olduğuna göre, site yapısını tasarlamaya başlayabiliriz. Sayfa tasarımı 5 bloğa bölünecektir: Üstbilgi, Belirtme Çizgisi, İçerik - Sol, İçerik - Sağ, Altbilgi.

4. adım

Her şeyden önce, yukarıdan aşağıya hareket edeceğimiz için başlık ile ilgileneceğiz. Dikdörtgen Seçim Çerçevesi Aracı'nı alın ve en üstte 120 piksel yüksekliğinde belgenin tüm genişliği boyunca bir alan seçin (yatay mizanpajınızın görünürlüğünü etkinleştirerek, 120 piksel yüksekliğini hesaplamak çok daha kolaydır - yalnızca 5 her biri 24px satır). Şapkayı koyu gri (# 2C2C2C) ile doldurun. Başlık site logosunu ve gezinme menüsünü içerecektir.

Adım 5

Şimdi logonuzu sayfanın sol üst köşesine, ikinci sütunla hizalayarak (40 piksellik bir dolgu) yerleştirin. Logo için Century Gothic yazı tipinde ve 50 punto boyutunda iki bölümden oluşan sıradan bir yazıt kullandım. Harflerin ilk kısmı açık mavi (# ADC7D9), ikincisi kalın ve beyazdır (#FFFFFF). Ardından logoya bir iç gölge ekledim (İç Gölge stili); stilin opaklığını% 25'e düşürdü ve aşağıdaki parametreleri ayarladı: Mesafe - 2px, Choke -% 0, Boyut - 5px.

6. Adım

Burada navigasyon menüsünü ayarlayacağız. Sayfayı temiz ve düzenli tutmak için menüdeki metin bağlantılarını kullanacağız. 18pt Arial yazı tipini seçin ve bağlantıların başlıklarını oluşturun. Aktif düğmeyi beyaz (#FFFFFF) ve geri kalanını açık gri (#BBBBBB) ile doldurun. Dikey olarak hizalayın ve başlığın orta şeridine yerleştirin.

7. Adım

Bu bloğa belirtme çizgisi adını verdim çünkü tek gereken sayfa hakkındaki bilgiyi kullanıcıya iletmek. Başlık için olduğu gibi aynı işlemi tekrarlayın (Dikdörtgen Seçim Aracı ile seçim), ancak bu sefer 240 piksellik blok yüksekliğini aklınızda bulundurun, seçimi logonun parçası olarak aynı açık mavi (# ADC7D9) ile doldurun. Bu katmana hafif bir degrade eklemek istiyoruz, bu yüzden Katman Stilleri panelini açmak için üzerine çift tıklayın ve Degrade Kaplama stilini seçin. Saydam renge giden bir degrade seçin, stilin karışım modunu Kaplama olarak değiştirin ve Opaklığını (Opaklık)% 30'a düşürün.

8. Adım

Şirketimizi "Mavi ızgara" olarak adlandırdığımızdan, açıklama metninin arka planında ince hücreler göstereceğiz. Bunu yapmak için, yatay çizgiler oluşturmak için kullanılan aynı tekniği kullanıyoruz. İlk olarak, 25 x 25 piksel boyutunda yeni bir belge oluşturun. Bundan sonra, arka planı kaldırarak şeffaf hale getirin ve 1 piksel kalınlığındaki bir piksel alt satırını ve aynı olanı bir tarafa boyayın. Bu dosyayı model olarak kaydedin (Düzenle\u003e Desen Tanımla).

9. Adım

Lider katmanın üstünde yeni bir katman oluşturun ve onu az önce oluşturduğunuz şablonla doldurun (Düzenle\u003e Doldur).

Bu katmanı 15 derece döndürün, Beyaz Renk Kaplama verin ve belirtme çizgisi panelinin üzerine yerleştirin.

Karıştırma Modunu Yumuşak Işık olarak ayarlayın. Ardından, Dikdörtgen Seçim Çerçevesi Aracı ile veya Ctrl + tuşlarına basarak lider panelini seçin. Bundan sonra, Dikdörtgen Seçim Çerçevesi Aracı modunda, seçili alana farenin sağ tuşuyla tıklayın, Tersi öğesini seçin ve ardından Sil'e basın. Şimdi ağın lider panelin ötesine uzanan gereksiz kısmını kaldırdık.

Bir sonraki adım, ızgarayı yalnızca 960 pikseldeki çalışma alanı genişliğinde görünür kılmaktır. Gizlediyseniz kılavuzları açın (Görünüm\u003e Göster\u003e Kılavuzlar), ardından kafes katmanına bir maske ekleyin.

Katmanlar paletinin altındaki ilgili düğmeye basarak maske moduna geçin, ardından Degrade Aracını (G) seçin ve şeffaftan siyaha doğru bir degrade tanımlayın. Bir gradyan ve bir maske yardımıyla, ağın 960px merkez alanının dışına çıkan kısımlarını kaldıracağız.

Doğrusal Degrade Stilinin seçildiğinden emin olun. Doğrudan sınıra dokunana kadar degradeyi, belirtme çizgisinin orta çalışma yüzeyinin kenarından sınırlayıcı kılavuzlara doğru biraz uzatmaya başlayın. Aynısını diğer tarafta da tekrarlayın.

10. adım

Metni belirtme çizgimize yerleştirelim. 45pt (# 2C2C2C) boyutundaki Arial yazı tipini alın ve bazı kelimeleri kalın harflerle vurgulayarak bir slogan yazın. Metin girişini altına daha küçük bir boyutta (17pt) yerleştirin ve tümünü belirtme çizgisi panelinin sol tarafına taşıyın.

11. adım

Şimdi alanı slayt gösterisi için hazırlayacağız. Dikdörtgen Seçim Çerçevesi Aracı'nı seçin ve en sağ ve orta kılavuzlar arasında bir seçim yapın. Seçilen alan 8 yatay çizgi yüksekliğinde olmalı, üstte ve altta birer boş cetvel bırakılmalıdır. Bu dikdörtgeni koyu gri bir renkle (# 2C2C2C) doldurun.

Slayt gösterisi için arka planınıza bir gölge ekleyin: Katman Stilleri panelini getirmek için çift tıklayın, Alt Gölge'yi seçin, rengi # 2C2C2C olarak değiştirin, Uzaklık değerini 1px ve Boyutu 10px olarak ayarlayın.

Ardından, slayt olarak, bir web sitesinin ekran görüntüsünü arka plana yerleştirmeniz gerekir - önemli değil. Karşılaştığım ilk blogun ekran görüntüsünü aldım, koyu gri arka planımıza tam olarak uyacak şekilde yeniden boyutlandırdım ve ardından 10 piksel genişliğinde doldurdum (Seç\u003e Değiştir\u003e Sözleşme 10px, ardından seçimi tersine çevirip Sil'e basarak içeriğini sil).

Adım 1/2

Ana bölümle çalışmaya başlamak için arka plana hafif bir gradyan eklemeniz gerekir. Dikdörtgen Seçim Çerçevesi Aracını kullanarak, bilginin altındaki tüm alanı seçin, ardından # F0F0F0'dan Degrade Aracını (G) seçerek saydamlaştırın ve degradeyi aşağı sürükleyin. Çok ileri gitmeyin - arka plan, sayfanın alt kısmına doğru # F9F9F9'a akmalıdır.

13. adım

Ana bloğun soluna bir giriş paragrafı ekleyin. Yazı tipi - Arial, boyut - 18 pt, renk\u003e # 9C9C9C ve bağlantının rengi # A3BBCC yapar ve ona bir alt çizgi verir.

14. adım

Bir hizmet listesi ekleyelim. İlk olarak, başlığın stilini belirleyin: Arial, 25pt, Bold, color # 262626. Arial # 9C9C9C yazı tipi ile 18pt boyutunda elemanların listesini yapın. Liste öğelerini Eliptical Marquee Tool ile veya alt kodları (Alt + 7) açık mavi yazı tipi rengiyle (# A4BCCD) ve kılavuz hizalamayla düzenleyin.

Gerekli bilgileri aynı şekilde ekleyin.

15. adım

Ana bölümün sağ bloğu en son haberleri gösterecektir. Önce öncekiyle aynı stilde bir başlık ekleyin (Arial, 25pt, Bold, color # 262626) ve bunu sağlanan hizmetler bölümüyle hizalayın. Şimdi Arial, 18pt, # A4BDCD'deki haberlerden biri için bir başlık oluşturun ve içeriği 16pt boyutunda ve # 9C9C9C renginde yazın. 3 haberi bu şekilde yazın ve altına Arial yazı tipinde altı çizili, 16pt ve renkli # A4BDCD ile haber akışının bağlantısını yerleştirin.

16. adım

Son bloğumuz, bir giriş ve şifre girmek için bir form, kişiler ve birkaç bağlantı içerecek olan bodrum katı olacaktır. Dikdörtgen Seçim Çerçevesi Aracı ile belgenin alt kısmını seçin ve koyu gri (# 262626) ile doldurun.

Şimdi bir kullanıcı adı ve şifre girmek için bir form eklememiz gerekiyor. İlk olarak, Arial Bold, 20pt, beyaz, altbilginin sol tarafına uygun metni yazın. Ardından, girdi kutuları olarak işlev görecek iki dikdörtgen oluşturmak için Dikdörtgen Seçim Çerçevesi Aracını kullanın. Alanları Arial 16pt yazı tipi, renk # 9C9C9C ile etiketleyerek adlandırın.

Gönder düğmesi için de aynısını tekrarlayın, yalnızca bu sefer Yuvarlatılmış Dikdörtgen Aracını (U) kullanın. Ardından, bu öğelere bir İç Gölge ekleyin, bu efektin Opaklığını% 30'a düşürün, Yayılmayı 0'a ve Uzaklığı 10px'e ayarlayın. Kayıp parolanızı kurtarmak için bağlantı ekleyin (Arial, 13pt, altı çizili stil, renk # A4BDCD).

17. Adım

Altbilgiye bir iletişim bloğu ekleyerek düzeni tamamlayın: Arial 20pt, Kalın beyaz (#FFFFFF) ile başlayın ve oturum açma formu başlığıyla hizalayın. Ardından, iletişim bilgilerinizi basit bir Arial 16pt yine beyaz ile ekleyin.

Adım 18

Dengeyi ve hizalamayı kontrol edin. Rehberlerinizin ve yöneticilerinizin yardımıyla, her şeyin yerinde olup olmadığını, her şeyin dengeli olup olmadığını kontrol edin. Değilse düzeltin.

Adım 19

Umarım bu eğitim size grid sistemleri hakkında bilgi edinmeniz için iyi bir başlangıç \u200b\u200bsağlamıştır ve ayrıca siteniz için kendi temiz düzeninizi yaratmıştır. Bu ızgaraları bir alışkanlık haline gelene kadar gelecekte kullanmanızı şiddetle tavsiye ederim. Zamanla, bu yaklaşım işinizi büyük ölçüde kolaylaştıracaktır.

Dersinizi paylaşın

yasal bilgi

Www.tutorial9.net sitesinden çevrilmiş, çevirinin yazarı dersin başında belirtilmiştir.

Photoshop, bir belgedeki görüntü öğelerini doğru şekilde konumlandırmaya yarayan bir dizi araca sahiptir. Örneğin, tam ortasına bir eleman yerleştirmek ve kullanılır.

Ancak, örneğin, üst kenardan 50 piksel girinti yapmanız gerekirse ne olur? Ya da, belgeye 10 öğe yerleştirdiğinizde ve bunların her birinin kesin olarak belirlenmiş mesafelerde birbirine göre konumlandırılması gerektiğinde ne yaparsınız? Bu sorunları çözmek için, konumlandırma araçlarına dönmeniz gerekir: cetveller, kılavuzlar ve kılavuzlar.

Cetveller iki ölçeklidir: biri üstte, diğeri sol tarafında. Cetveller, seçilen ölçü biriminin bölümleriyle işaretlenir. Evet, basitçe söylemek gerekirse, hepimizin bir kağıda uyguladığı bir okul yöneticisi gibi.

İçin photoshop'ta cetvellerin görüntülenmesini etkinleştir, şu komutu çalıştırın:

Görünüm - Cetveller veya kısayol tuşu Ctrl + R.

Varsayılan birim piksel... Ancak bu değiştirilebilir. Bunu nasıl yapacağınızın aşağıdaki yolları vardır:

Yöntem 1

Cetvel ölçeğine sağ tıklayın. Photoshop'ta bulunan tüm ölçü birimleriyle bir bağlam menüsü görünecektir: pikseller, inçler, santimetre, milimetre, noktalar, tepe noktaları ve yüzdeler.

Yöntem 2

Varsayılan ölçü birimlerini değiştirmek için aşağıdaki Photoshop ayarlarına gitmelisiniz: Düzenleme - Tercihler - Birimler ve Cetveller... Açılan pencerede en üstte bir öğe var Birimlerve içinde Cetveller.

Açılır listeden gerekli öğeyi seçin ve kaydedin. Photoshop şimdi bu birimi varsayılan olarak kullanacaktır.

Cetvelin başlangıç \u200b\u200bnoktası 0'dır. Varsayılan olarak bu, belgenin sol üst köşesidir. Ancak bu, ölçeğin başlangıcı başka bir yerde ayarlanarak da değiştirilebilir. Bunu yapmak için, iki cetvelin kesişme noktasına tıklayın, ardından fare düğmesini bırakmadan yana doğru sürükleyin. Bir artı göreceksiniz. Cetvelin başlamasını istediğiniz merkeze yerleştirin.

Not

Cetveli orijinal konumuna geri döndürmek için, iki cetvelin kesişme noktasını çift tıklayın.

Photoshop'taki kılavuzlar

Cetveller göründüğüne göre artık kılavuzlar oluşturabilirsiniz.

Kılavuzlar - Bunlar, Photoshop belgesinde işaretlemeyi oluşturmaya yardımcı olan mavi dikey ve yatay çizgilerdir.

Kılavuzlar yardımcıdır, bu nedenle resmi kaydettiğinizde görünmezler. Ancak PSD formatında kalırlar.

Kılavuzların yapışkan bir etkisi vardır; bu, bir görüntünün bir öğesini bir rehbere yaklaştırdığınızda, o öğenin aniden çizgiye yapıştığını hissedeceğiniz anlamına gelir. Bu, konumlandırma için çok kullanışlıdır. Bu durumda, bir kılavuz yardımıyla öğeyi piksel piksel konumlandırdığınızdan emin olursunuz.

Not

Photoshop'taki yapıştırma efekti denir Snap... Menüde açılır ve kapanır Görünüm - Yapış... Kutuyu işaretlediğinizden emin olun.

Buradan tüm kullanım taktiklerini takip edin: ilk olarak kılavuzu yerinde doğru bir şekilde ayarlamanız gerekir. Bunun için istenilen mesafeyi ölçmeniz gerekiyorsa bir cetvel ölçeği kullanılır. Ardından, her şey yerinde olduğunda, bir görüntü öğesini kılavuza sürükleyin ve o satıra yapışır. İşte bu, konumlandırıldı!

Photoshop'ta kılavuzlar nasıl oluşturulur

Öncelikle, kılavuzların ekranının açık olduğundan emin olmanız gerekir. Bunu yapmak için, menüde olduğundan emin olun. bir onay işareti vardı. Ve ayrıca cetveller etkinleştirilmelidir.

Şimdi onları yaratmanız gerekiyor. Farklı durumlar için iki yol vardır:

Yöntem 1 Keyfi kılavuzlar

Bu yöntem, hızlı bir şekilde bir çizgi oluşturmanız ve rastgele bir yere yerleştirmeniz gerektiğinde uygundur.

Bunu yapmak için cetvel ölçeği alanına tıklayın:

• yatay bir çizgi için - üst cetvelde;
• dikey bir çizgi için - sol cetvel değil.

Ardından, fare düğmesini bırakmadan elinizi belgeye doğru uzatın. Ardından, hareketinizle birlikte kılavuzun hala karanlık olan çizgisi çizilecektir. Sonra doğru yere yerleştirin ve maviye dönecektir.

Gördüğünüz gibi cetvel ölçeğini geçiyor, bu da mesafeyi hesaplamanın ve kılavuzu doğru yere yerleştirmenin zor olmayacağı anlamına geliyor.

Yöntem 2 Kılavuzun nerede görünmesi gerektiğini belirtme

Menü aracılığıyla Görünüm - Yeni Kılavuz bir iletişim kutusu açılacaktır. Hangi düzlemde onu (yatay veya dikey) oluşturacağınızı ve ayrıca istenen konumun değerini girmeniz gereken alanı belirtmeniz gerekir. Örneğin, görüntünün üstünden 100 piksel uzaklıkta görünen yatay bir kılavuz istiyorsunuz.

Kılavuzun konumu nasıl değiştirilir

Satırı yeni bir konuma taşımak için öğesini seçin, ardından imleci satırın üzerine getirin. İmleç iki paralel çubuğa dönüşür. Böylece kılavuzu tıklayıp yeni bir konuma sürükleyebilirsiniz.

Bu arada, kılavuzlar sabitlenebilir, yani yanlışlıkla hareketten korunabilir. Bunu yapmak için menüye bir onay işareti koyun Görünüm - Kılavuzları Kilitle.

Kılavuzlar nasıl kaldırılır / kaldırılır

Yöntem 1 Cetvel ölçeğine geçin

Bu yöntem, bir kılavuz oluşturma sürecini tekrarlar. Kaybolmasını sağlamak için cetvel ölçeğinin alanına geri sürüklemeniz gerekir.

Bu yöntem, kılavuz setinin tamamını değil, yalnızca birkaçını kaldırmanız gereken durumlar için idealdir.

Yöntem 2 Menü komutu

Program menüsü aracılığıyla: Görünüm - Kılavuzları Kaldır... Bu durumda, oluşturulan tüm satırlar bir anda kaybolacaktır.

Yöntem 3 Görüntüyü devre dışı bırak

Kılavuzları müdahale etmemeleri için geçici olarak kaldırmanız gerekirse, komutun işaretini kaldırın. Görünüm - Yardımcılar veya Ctrl + H sıcak kombinasyonunu kullanın.

Tüm çizgiler kaybolacak, ancak onları tekrar görüntülemeniz gerekiyorsa, onay işaretini oraya geri döndürün ve ardından tüm kılavuzlar tekrar yerlerinde olacak ve onlarla çalışmaya devam edebilirsiniz.

Photoshop'ta düzen ızgarası

Damalı bir defterin neye benzediğini hatırlayın. Aynı ızgara, Photoshop'ta belgenin üstüne yerleştirilebilir. Bunu yapmak için şu komutu çalıştırın:

Görünüm - Göster - Izgara

Izgara ayarı, Photoshop ayarlarında gerçekleştirilir: Düzenleme - Tercihler - Kılavuzlar, Izgaralar ve Dilimler.

Ana (büyük) hücrelerin ne kadar geniş olacağını ve kaç ek iç bölümden oluşacağını belirtebilirsiniz. Örneğin, ana hücrelerimin her biri 2 santimetredir ve ek olarak 4 küçük hücreye bölünmüştür. Böylece her küçük hücre 0,5 santimetre uzunluğundadır.

Bu ızgara, metin gibi birçok farklı öğeyi hizalamanız gerektiğinde kullanışlıdır.

Metinde bir hata fark ettiyseniz, onu seçin ve Ctrl + Enter tuşlarına basın. Teşekkür!

Grafik programlarda gerçekleştirilen oldukça fazla sayıda işlem, bir görüntünün bir parçasının ön görsel seçimini, bir fotoğrafı bölgelere ayırmayı veya nesneleri yerleştirmek için uyarıcı bir düz çizgi çizmeyi gerektirir. Photoshop'taki kılavuzlar tam da bu amaç için var. Bu satırlar programdaki çalışmayı büyük ölçüde kolaylaştırmakta, işin hızını arttırmakta ve daha doğru hale getirmektedir.

Kılavuz neye benziyor

Photoshop'un herhangi bir sürümünde kılavuz çizgiler, renkli olarak özelleştirilebilen ince ve düz dikey ve yatay çizgilerdir. Varsayılan olarak mavidirler. Görselin herhangi bir yerine ve herhangi bir miktarda manuel olarak kurulabilirler.

Kılavuzları Etkinleştirme, Birinci Yöntem

Photoshop'ta kılavuzları açmanın en az iki yolu vardır. İlk durumda, Cetvel modu açıkken çalışmanız gerekir. Sonra şu şekilde ilerliyoruz:

• Photoshop'ta kılavuzları oluşturmadan önce, "Görünüm" menü öğesini seçin ve "Cetveller" seçeneğine tıklayın.
• Bundan sonra, görüntü penceresinin iç kenarlarında ölçüm cetvelleri görünecektir.
• Parametreleri, üzerlerine sağ tıklayarak ayarlanabilir. Bu mod, Ctrl + R klavye kısayoluna basılarak da etkinleştirilebilir. Bu kombinasyon, diğerleri gibi, "Etkinleştir - Devre Dışı Bırak" ilkesine göre çalışır. Yani, karşılık gelen tuşlara tekrar basarsanız, cetveller artık görüntülenmeyecektir.

• Kılavuzları açmak için, fare işaretçisini cetvellerden birine koymanız, sol tıklamanız ve basmadan resim yönünde çekmeniz gerekir.
• İşaretçi cetvelin ötesine geçer geçmez ince bir çizgi görünür: İşaretçi yatay cetvel üzerindeyse ve aşağı çekmişseniz yatay, işaretçi dikey cetvel üzerindeyse ve sağa çekmişseniz dikey.

Photoshop'ta hem görüntünün kendisinde hem de çalışma alanında (görüntü ile pencere kenarlıkları arasındaki gri alan) bir kılavuz ayarlayabilirsiniz. Bu durumda, daha fazla doğruluk için hem görüntünün kendisine hem de cetvellere odaklanabilirsiniz.

Etkinleştirme Kılavuzları - İkinci Yöntem

Photoshop'ta kılavuzu ayarlamada mutlak kesinlik için, ikinci yöntemi kullanarak çizgiler için tam değerleri ayarlayabilirsiniz:

• Ana menüde, tekrar "Görüntüle" öğesini ve ardından - "Yeni Kılavuz" u seçin.
• Bu, ilgili iletişim kutusunu getirir. İçinde hangi çizgiyi oluşturmak istediğinizi seçmeniz gerekir - dikey veya yatay.
• Daha sonra "Değer" seçeneği kutusunda gerekli numarayı sürmeniz gerekir. Bunun "Yatay 1,2 cm" olduğunu varsayalım. Bu durumda, resmin üst kenarından 1,2 cm uzaklıkta yatay bir çizgi görünecektir. Veya "Dikey, -1,2 cm". Bu, çalışma alanına resmin sol kenarından 1,2 cm uzaklıkta dikey bir kılavuz çizecektir.

Photoshop'ta kılavuzlarla daha fazla çalışma

Program, çizilen çizgilerle daha fazla çalışma yapmanızı sağlar:

1. Hareket ettirilebilirler. Bunu yapmak için, fare işaretçisini kılavuz çizgisinin üzerine getirin, farenin sol düğmesine basın ve çizgiyi istediğiniz yönde sürükleyin.
2. Çıkarılabilirler. Bu durumda, çizgiyi aynı şekilde cetvele uzatmanız gerekir - kılavuz kaybolur. Görünüm menü öğesinden Kılavuzları Sil komutunu seçerek tüm satırları silebilirsiniz.
3. Geçici olarak devre dışı bırakılabilirler. Bu, görüntü değerlendirmesine müdahale ettiklerinde gereklidir. Gerekirse, Ctrl +; tuşlarına basın; kılavuzlar kaybolacaktır. Aynı tuşlara tekrar basmak önceden çizilen yönergeleri getirecektir. Yukarıda açıklanan yöntemlerden herhangi birini kullanarak yeni bir çizgi çizerseniz, bunlar da yeniden görüntülenecektir.

Renk ve tür ayarı

Yukarıda bahsedildiği gibi, bu çizgilerin rengi özelleştirilebilir. Bunu yapmak için, "Düzenle" menüsünde "Ayarlar" alt öğesini ve ardından - "Kılavuzlar, kılavuz vb." Öğesini seçin. "Kılavuzlar" bölümünde, önerilen renklerden birini seçin ve gerekirse "Stili" değiştirin: geliştiriciler ya düz çizgi ya da noktalı çizgi sunar.

Aslında, bazı görüntü işleme türlerinde mavi veya pembe çizgiler görsel algıyı engelleyebilir, ancak kesikli gri veya siyah çizgiler aynı anda hem yararlı hem de neredeyse görünmez olabilir.

Kılavuzlara ihtiyaç duyulduğunda

Photoshop'ta kılavuz kullanmanız gerektiğinde en popüler durum, seçilen kısmı kırpmak veya kopyalamak için uygun araçla seçmeden önce resmin bir alanını ayırmaktır. Örneğin, bir grup fotoğrafındaki portrelerden birini kesmeniz gerekiyorsa, kenarlıkları önce kılavuzlarla "sığdırmak" ve sonra kesip çıkarmak daha kolaydır.

Ek olarak, kılavuzlar, çizimin kompozisyonunu belirlemede çok yardımcı olur. Dolayısıyla, bu satırlarla bir kitap kapağı oluştururken, kapağın gelecekteki alanlarını belirtmek kolaydır: kitabın başlığı, yayınevinin logosu, dekoratif öğeler, resimler.

Bu çizgiler, nesneleri birbirine göre veya çizim ayrıntılarına göre hizalamak için de kullanışlıdır.

Son olarak, hassas düz çizgiler çizmek için herhangi bir çizim aracı böyle bir yatay veya dikey olarak sabitlenebilir (Görünüm - Kılavuzlara Tuttur). Örneğin, dekoratif bir fırçayla düz bir dikey çizgi çizmek istiyorsanız, Fırçalar aracını seçebilir, yakalama modunu açabilir ve farenizi kılavuzun üzerine sürükleyebilirsiniz. Hareketleriniz kesin olmasa bile, çizgi ona yapışacak ve geometrik olarak doğru olacaktır.

Böylece, Photoshop'taki her kılavuz amacını yerine getirebilir ve bu satırların kullanımı çok yönlü olabilir ve görüntü işlemenin en çeşitli amaçlarını karşılayabilir.