Äçìéïõñãþíôáò Backgrounds

 
¸íá HTML background åßíáé ìéá áðåéêüíéóç ðïõ åìöáíßæåôáé óõíÝ÷åéá óôçí ïèüíç óôï browser ôïõ window "ðßóù" áðü ôï êåßìåíï êáé ôéò åéêüíåò ôïõ foreground.  Ãéá íá êÜíåéò load ìßá áðåéêüíéóç-åéêüíá ôïõ background ìðïñåßò íá ÷ñçóéìïðïéÞóåéò ôçí åôéêÝôá (tag) <BODY>. Ãéá ðáñÜäåéãìá, ãéá íá êÜíåéò load ìéá áðåéêüíéóç ôïõ background ðïõ ïíïìÜæåôáé SLATE.GIF, ãñÜöåéò ôï ðáñáêÜôù: 
<BODY BACKGROUND="SLATE.GIF">

ÌåôáôñïðÞ óôç Seamless ÌÝèïäï Ìïôßâïõ

Åíáò áðü ôïõò åõêïëüôåñïõò ôñüðïõò ãéá íá äçìéïõñãÞóåéò ìéá background áðåéêüíéóç ÷ñçóéìïðïéþíôáò ôï Paint Shop Pro, åßíáé íá öôéÜîåéò ìéá åðéëïãÞ êáé ìåôÜ íá ÷ñçóéìïðïéÞóåéò ôçí åðéëïãÞ Selections | Convert óå Seamless Pattern, áöïý Ý÷åéò æùãñáößóåé ìéá êáéíïýñãéá Üäåéá åéêüíá ìå Ýíá ÷ñþìá, ÷ñçóéìïðïéþíôáò Ýíá áðü ôá PSP's paper textures. Áêïëïõèåß Ýíá ðáñÜäåéãìá: 
  1. Ìå Ýíá óêïýñï-êßôñéíï, üðùò, ôïõ background êáé Ýíá êáöÝ ÷ñþìá üðùò ôïõ foreground, Üíïéîå (open) ìéá êáéíïýñãéá 200x200 åéêüíá.
  2. ÐÜñå ôï åñãáëåßï airbrush, äéÜëåîå ìéá ìåãÜëç âïýñôóá êáé ìéá ôáðåôóáñßá ìå êüêêïõò îýëïõ.
  3. ×ñùìÜôéóå ïëüêëçñç ôçí åéêüíá.  Ìçí åßóáé ðïëý áäÝîéïò êáôÜ ôç äéÜñêåéá ðïõ ÷ñùìáôßæåéò êáé ìç óå åíäéáöÝñåé êáé ðïëý áí ôï ÷ñþìá åßíáé ëßãï áíïìïéüìïñöï.
  4. Ñýèìéóå ôï ÷ñþìá áðü ôçí åðéëïãÞ Colors | Áí èåò, ÷ñùìÜôéóå.
  5. ÐÜñå ôï åðéëåãìÝíï åñãáëåßï êáé ìåôÜ åðÝëåîå ìéá ðåñéï÷Þ ôçò ìå êüêêïõò îýëïõ ôçò åéêüíáò óïõ.  ÄéÜëåîå ìéá ðåñéï÷Þ ðïõ âñßóêåéò åõ÷Üñéóôç êáé äåí åßíáé ðïëý êïíôÜ óôï Üêñï ôçò åéêüíáò.
  6. ÄéÜëåîå ôçí åðéëïãÞ Selections | ×ñùìÜôéóå óå Seamless Ìïôßâï.

    7.  

    Áí ç ìåôáôñïðÞ óå Seamless Ìïôßâï åßíáé ãêñéæáñéóìÝíç, êÜíå Ýëåã÷ï ãéá íá äåéò áí Ý÷åé  åðéëåãåß.  Áí ç ìåôáôñïðÞ óôï Seamless Ìïôßâï åßíáé äéáèÝóéìç, áëëÜ, äÝ÷åóáé ìÞíõìá ëÜèïõò üôé ç åðéëïãÞ åßíáé ðïëý êïíôÜ óôï Üêñï ôçò åéêüíáò, ôüôå ðÞãáéíå ðßóù êáé åðÝëåîå ìéá ðåñéï÷Þ ðïõ åßíáé ðéï ìáêñéÜ áðü ôéò Üêñåò.

  7. ÊÜíå Save óôçí åéêüíá ðïõ êáôÝëçîåò åßôå óáí JPEG åßôå óáí GIF. 
  8. Óôçí ðñáãìáôéêüôçôá, ðñïóðÜèçóå êáé ôá äýï êáé äåò ðéï áðü ôá äýï åßíáé êáëýôåñï. (ôá JPEGs åßíáé ìéêñüôåñá áëëÜ åðåéäÞ ðñïêáëïýí "áðþëåéåò åíÝñãåéáò", ìåñéêÝò öïñÝò üôáí ÷ñçóéìïðïéïýíôáé ãéá background åéêüíåò, óõã÷Ýïõí ôá üñéá ðïõ õðÜñ÷ïõí.)
Ðáñüëï ðïõ ç ìÝèïäïò åßíáé åýêïëç, óõ÷íÜ ìáò äßíåé ëéãüôåñá áðü ôá áíáìåíüìåíá áðïôåëÝóìáôá, üëá áðü ìüíç ôçò. Åäþ åßíáé ìåñéêÝò åéêüíåò ðïõ äçìéïõñãÞèçêáí ìå PSP's paper textures êáé ìå ìåôáôñïðÞ óå Seamless Ìïôßâï: 
 
 		  
ÊÜíå êëéê óå êÜèå ìéá áðü áõôÝò ôéò åéêüíåò ãéá íá äåéò ðùò èá åßíáé óáí HTML background.

Ìå ëßãåò ðñïóáñìïãÝò, ìåñéêÝò áðü áõôÝò èá ãßíïõí áðïäåêôÝò.  Êáé ÷ùñßò íá êÜíïõìå ôßðïôá, üëåò áõôÝò ïé åéêüíåò ìðïñïýí íá ãßíïõí ùñáßá backgrounds.  Ãéá ðáñÜäåéãìá, ñõèìßæïíôáò ôï êïíôñÜóô êáé ôï öùôéóìü ôïõ ìðëå ðëÝãìáôïò ôçò ðáñáðÜíù åéêüíáò, èá ðÜñù ôï ðáñáêÜôù:

ÊÜíå êëéê óôçí åéêüíá ãéá íá äåéò ðùò èá åßíáé óáí background.

Ãéá åéêüíåò ìå áóáöÞ üñéá Þ "öáóáñéüæéêá" ìïôßâá, áõôÞ ç ìÝèïäïò ëåéôïõñãåß ðñáãìáôéêÜ ðïëý êáëÜ.  Óôçí ðñáãìáôéêüôçôá, ôï ðáñüí ìïôßâï ðïõ ÷ñçóéìïðïéåßôáé óôï site áõôü äçìéïõñãÞèçêå ìå áõôüí ôïí ôñüðï. Áêïëïõèåß Ýíá áêüìá ðáñÜäåéãìá.:

  1. ¢íïéîå ìéá 200x200 åéêüíá ìå Üóðñï background.
  2. ÄéÜëåîå Image | Noise | Add.
  3. ÅðÝëåîå Random êáé áýîçóå ôç ðïóüôçôá noise ìÝ÷ñé íá ðÜñåéò êÜôé ðïõ óïõ áñÝóåé.
  4. ÄéÜëåîå Colors | Greyscale ãéá áëëÜîåéò üëá ôá ÷ñþìáôá óå áðï÷ñþóåéò ôïõ ãêñé.
  5. Áí íïìßæåéò ðùò ï öùôéóìüò êáé ôï êïíôñÜóô èÝëïõí ñýèìéóç, ÷ñçóéìïðïßçóå ôá Colors | Adjust | Brightness/Contrast.
  6. Áêïëïýèçóå ôéò ïäçãßåò ðïõ äüèçêáí ðáñáðÜíù ãéá íá ÷ñçóéìïðïéÞóåéò ôç ÌåôáôñïðÞ(Convert) óå Seamless Ìïôßâï.

Åäþ åßíáé Ýíá ðáñÜäåéãìá ìéáò ìÜëëïí åðéôõ÷çìÝíçò åöáñìïãÞò ìå áõôÞ ôç ìÝèïäï ðïõ ôáéñéÜæåé óå öùôïãñÜöï.
 
 

×åéñïðïßçôá Seamless Ìïôßâá

Ôï íá öôéÜîåéò seamless ìïôßâá áðü ïðïéáäÞðïôå åéêüíá ÷ñåéÜæåôáé ðñïóï÷Þ êáé ÷ñüíï, áëëÜ ôá áðïôåëÝóìáôá èá åßíáé ðïëý ùñáßá. Åäþ åßíáé Ýíá ðáñÜäåéãìá åíüò background ðïõ Ýãéíå âÜóç áõôÞò ôçò ìåèüäïõ. Ìðïñåßò áêüìá íá ñßîåéò ìéá ìáôéÜ óôï Handmade Brick Background ìÝóá óôï How-to section ãéá Üëëï ðáñÜäåéãìá, ðáñÜëëçëá ìå ôéò ïäçãßåò.

ÁõôÞ åßíáé ç éäÝá ãéá ôï ðþò ÷ñçóéìïðïéåßôáé áõôÞ ç ôå÷íéêÞ:

- ¢íïéîå ôçí åéêüíá áðü ôçí ïðïßá èÝëåéò íá äçìéïõñãÞóåéò ôï ðëáêÜêé. Êüøå ôï, áí åßíáé áðáñáßôçôï, ãéá íá ðÜñåéò ôï âáóéêü ðëáêÜêé ðïõ èÝëåéò.
- ÌåôÜ êáèüñéóå ôá üñéá óå ëßãá ü÷é êáé ôüóï åýêïëá âÞìáôá.
- ÊÜíå Select All êáé ìåôÜ áíôÝãñáøå (Copy) ôçí åðéëïãÞ óïõ óôï clipboard.
- Áýîçóå ôï ìÝãåèïò ôïõ öüíôïõ óôï äéðëÜóéï ýøïò êáé äéðëÜóéï ðëÜôïò áðü ôçí áñ÷éêÞ åéêüíá. (ÅðéëïãÞ Åéêüíáò | ÌÝãåèïò Öüíôïõ êáé ñýèìéóç êáôÜëëçëïõ ýøïõò êáé ðëÜôïõò.)
- Åðéêüëëçóå (Paste) ôçí åðéëïãÞ áðü ôï clipboard êÜôù áðü ôçí áñ÷éêÞ åéêüíá, äåß÷íïíôáò ðñïóï÷Þ óôï íá åßíáé ïé Üêñåò óôï ßäéï óçìåßï, üóï ôï äõíáôüí ðåñéóóüôåñï.
- ×ñçóéìïðïßçóå ôï åñãáëåßï Retouch ãéá íá ôáéñéÜîåôå ôéò Üêñåò ìáæß..
- Åðéêüëëçóå (Paste) ôçí åðéëïãÞ áðü ôï clipboard óôá äåîéÜ ôçò ðñùôüôõðçò åéêüíáò, ìåôÜ ôáßñéáîå ôéò Üêñåò ôçò äåîéÜò êüðéáò êáé ôçò ðñùôüôõðçò, üðùò, Ýêáíåò óôï ôåëåõôáßï âÞìá ìå ôçí êÜôù êüðéá êáé ìå ôçí original åéêüíá.  Íá óéãïõñåõôåßò üôé èá ðñïóÝîåéò ôçí ïñéæüíôéá èÝóç, óôçí ïðïßá ç ðñùôüôõðç êáé ç äåîéÜ êüðéá óõíáíôéïýíôáé êáé áõôü ãéá íá ìðïñåßò äéþîåéò ôçí åðéðëÝïí êüðéá.
- Êáé ôþñá ôï ðñáãìáôéêÜ äýóêïëï êïììÜôé.  ÄéÜëåîå ôï äåîß Üêñï ðïõ ôáéñéÜæåé (áðü áñêåôÜ åéêïíïóôïé÷åßá óôçí áñéóôåñÞ Üêñç êáé ðñïò ôç äéêÞ ôïõ Üêñç) êáé áíôÝãñáøå áõôÞí ôçí åðéëïãÞ óôï clipboard. ÌåôÜ åðéêüëëçóå áõôÞí ôçí êüðéá óáí ìéá êáéíïýñãéá åðéëïãÞ êáé ôïðïèÝôçóÝ ôçí óôï áñéóôåñü Üêñï óôçí ðåñéï÷Þ ôçò ðñùôüôõðçò åéêüíáò, äåß÷íïíôáò ðñïóï÷Þ óôçí áêñéâÞ èÝóç ôçò åðéëïãÞò.  ÊÜíå ôï ßäéï êáé ìå ôçí êÜôù Üêñç, îåêéíþíôáò ôçí åðéëïãÞ óïõ ëßãá åéêïíïóôïé÷åßá ðÜíù áðü ôçí Üêñç êáé ðçãáßíïíôáò óôçí áêñéâÞ êÜôù Üêñç. ÁíôÝãñáøå áõôÞí ôçí êüðéá óôï clipboard, åðéêüëëçóå ôçí êüðéá óáí êáéíïýñãéá åðéëïãÞ êáé âÜëå ôçí áêñéâþò óôï ðÜíù Üêñï ôçò ðñùôüôõðçò åéêüíáò.
- ÅðÝëåîå ôçí ðåñéï÷Þ ôçò ðñùôüôõðçò åéêüíáò, ÷ñçóéìïðïéþíôáò ôéò êÜèåôåò êáé ôéò ïñéæüíôéåò èÝóåéò ðïõ ðáñáôÞñçóåò ðñéí óáí ïäçãïýò. ×ñçóéìïðïßçóå Image | Crop to Selection ãéá íá êüøåéò ìáêñõÜ ôéò åðéðëÝïí êüðéåò ðïõ åðéêüëëçóåò óôá ðñïçãïýìåíá âÞìáôá.

Ìå ëßãç ôý÷ç, èá Ý÷åéò ôþñá Ýíá üìïñöï ìïôßâï ìå ðëáêÜêéá.

Ï Åýêïëïò Ôñüðïò

Ï åõêïëüôåñïò êáé ï ðéï áðïôåëåóìáôéêüò ôñüðïò íá öôéÜîåéò Ýíá seamless background ìå ðëáêÜêé åßíáé íá ÷ñçóéìïðïéÞóåéò Ýíá plug-in filter åéäéêÜ ó÷åäéáóìÝíï ãé áõôü ôï óêïðü, üðùò ìåñéêÜ áðü ôá Sandy Blair's of Sandy Blair's Simple Filters.  ÐáñáêÜôù åßíáé ìåñéêÜ ðáñáäåßãìáôá áðü ðëáêÜêéá ðïõ Ýêáíá ÷ñçóéìïðïéþíôáò áõôÜ ôá ößëôñá, áêïëïõèåß ôï áðïôÝëåóìá ãéá ôï êáèÝíá ìå ìéá îå÷ùñéóôÞ åðßóôñùóç. (Image | Other | Hot Wax Coating):


 
 Ç Åéêüíá ðÜíù áñéóôåñÜ åßíáé ç ðñùôüôõðç.
Ìðïñåßò íá êÜíåéò êëéê óå êáèÝíá áðü áõôÜ ôá ðëáêÜêéá (áêüìá êáé óôï ðñùôüôõðï) ãéá íá äåéò ðùò èá öáßíïíôáé ðÜíù óå óåëßäá.

Ìðïñåß áêüìá íá èÝëåéò íá ñßîåéò ìéá ìáôéÜ óôï äåýôåñï ìÝñïò ãéá ôçí ïìÜäá Filters ãéá ìéá ðåñéåêôéêÞ óõæÞôçóç ó÷åôéêÜ ìå plug-in filters.

NextÐßóù | Ðåñéå÷üìåíá | BáóéêÜ | How-To | Links | Store | ÅðüìåíçNext