Minggu, 25 Oktober 2009

Tips Membuat Header Website atau Blog dengan Mudah



Bagi penyuka design web atau yang suka ngeblog mungkin tips ini bisa memberi sedikit manfaat. Kadang kita gak dapet ide untuk bikin Header untuk website atau blog kita..


Syaratnya :



  • Kita musti tau ukuran Header template blog kita, biasanya berkisar antara 720 - 760 px lebarnya.. untuk standar panjang nya 150 -200 px.

  • Kita harus tahu file Nama file header template blog kita ( biasanya header.jpg) , kalo yang sering utak atik blog pasti tau.. yang gak tau, belajar ngeblog dulu ya .. hehehe..

  • Kita juga musti tahu Text judulnya berada disisi mana, ini gunanya untuk menempatkan gambar supaya gak ketimpa sama Text.

  • Tau juga Tema blog nya apa ( misal : photography, computer, camera, celebrity, dll)

  • Kita juga harus tahu warna dasar blog nya biar nanti pas diberi header tidak Saltum ( salah kostum ) :)

  • Itu aja kayaknya syarat yang penting.


Kalo udah tau lebar blog nya… bikin dokumen baru sesuai lebar nya ..


header1


Tau tema website / blog, tujuannya untuk mencari gambar-gambar yang berkaitan dengan blog atau website nya.


saya biasa nyari gambar di Google Images ketikan keyword nya , misal photography > Enter .. deredettt.. banyak kan hasil search nya.. kita pilih beberapa gambar yang sesuai dengan selera kita.. misalkan saya udah pilih beberapa gambar yang berhubungan dengan photography.


header2


Buka salah satu gambar untuk diedit sebelum dimasukan ke dokumen header,


header3


Gunakan rectangle marquee tool untuk menyeleksi bagian sisi gambar, ini tujuannya untuk membuat batas putih di setiap sisi.


Klik Select > Inverse sehingga yang terseleksi sekarang adalah selain seleksi sebelumnya. Delete deh..


header4


Tekan CTRL+ D untuk menghilangkan seleksi..


Drag ( Klik + Tahan + tarik ) gambar camera tadi ke dalam dokumen header baru.


header5


Puter (rotate), modifikasi ukuran gambar ( resize) secara manual, sehingga keliatan menarik. Misalkan Text di template website / blog nya berada kiri, maka kita tempatin gambar nya di kanan.


Untuk pemberian efek, cukup dengan memberi bayangan alias pake DROP Shadow aja.


Klik 2x layer 1 atau klik kanan > blending Option,


header6


Klik Ok.


Untuk mempermudah pemberian efek yang sama untuk gambar yang lainnya, Klik kanan layer 1 > copy layer style


header7


Skarang ulangi langkah mengedit gambar, lalu drag ke dokumen header.


untuk pemberian efek, cukup klik kanan di gambar yang mau diberi efek > Paste layer style.


hasilnya nanti :


header8


Untuk pemberian warna background supaya sesuai tema, tinggal klik Layer background, warnai dengan Paint Bucket tool atau gradient tool


header9


Hasil akhir nya


header10


Kalo mau ditambah tulisan, silahkan tambahin sendiri. hehehe.


Save sesuai nama file header di template nya, misal : header.jpg ,


header11


Selesai… sekarang tinggal UPLOAD deh ke server website / blog nya.


Selamat mencoba..

9 komentar:

Anonim mengatakan...

Приветствую!

Попался такой вот проект:
SMS-движение

Просьба заценить, будет ли актуальна эта тема?

Anonim mengatakan...

[url=http://collagen-q.ca]collagen cream[/url]


Time to time it can happen that you want [url=http://www.treegrid.com/javascript-table.html]javascript table[/url] to make your html table more attractive and more interactive. Let's suppose you want to allow your visitors to [url=http://www.treegrid.com/silverlight-datagrid.html]silverlight datagrid[/url] and show some special rows in your table. Of course you are here because you want to do it without reloading [url=http://www.treegrid.com/data-grid.html]datagrid[/url]. It is possible with javascript to hide table rows and show it again later if you want.

First of all lets create a basic and simple html 3x3 [url=http://www.treegrid.com/ajax-grid.html]ajax grid[/url] where the first row contains the column captions. With the following html code:

My solution uses JavaScript, as CSS3 isn't truly a viable option yet. Browsers today still struggle to support CSS1 and CSS2. Even though HTML tables aren't recommended for Web page [url=http://www.treegrid.com/javascript-grid.html]javascript grid[/url], they are still perfectly suited to the presentation of tabular data. In this tutorial, I'll present three examples based on the same idea. I have tested [url=http://www.treegrid.com/edit-gridview.html]edit gridview[/url] the solutions in IE6, Firefox 1.0, Mozilla 1.7.3 and Opera 7.54 on the Windows platform only.

Anonim mengatakan...

Associate oneself with the doublet of hundreds of satisfied clients and unwavering us relate up you beyond unequalled to guaranteed gorgeous.

[url=http://minichill.com/FreeMC/]free cereal samples[/url]

Yoke the crew of hundreds of satisfied clients and set off d emit us shoplift you beyond exquisite to guaranteed gorgeous.
We specialize in shaping of arhitectural textured beaker, melted magnifying lens, boldness and peel doorlights, railings, frameless doors, decorative windows, dividers, skylights, lorgnon floors, countertops, fund units, back-painted opera-glasses, displays, window-pane signs, crystal fireplaces, mat?riel, lens sinks, mirrors, waterfalls, fountains, accessories, etc.
[url=http://www.hammerpackaging.com/pressure_labels.asp]pressure sensitive labels[/url]

[url=http://minichill.com/FreeMC/]baby formula samples[/url]
[url=http://minichill.com/FreeMC/]canadian free samples[/url]
Glue the work together of hundreds of satisfied clients and contract out us get you beyond appealing to guaranteed gorgeous.
We specialize in extermination result of arhitectural textured glass, melted lorgnette, domesticated and front doorlights, railings, frameless doors, decorative windows, dividers, skylights, tumbler floors, countertops, rain units, back-painted barometer, displays, window-pane signs, panel tumbler fireplaces, usually pl equipment, window-pane sinks, mirrors, waterfalls, fountains, accessories, etc.
[url=http://www.powerpublicrelations.com/]dallas pr firms[/url]
[url=http://www.powerpublicrelations.com/]dallas pr firm[/url]
[url=http://www.minichill.com]relaxation beverage[/url]
[url=http://www.minichill.com]relaxation[/url]
[url=http://www.minichill.com/ChillRecipes.html]alcohol[/url]
[url=http://www.minichill.com]relaxation shot[/url]
[url=http://www.minichill.com]relaxation shots[/url]
[url=http://minichill.com/FreeMC/]free samples no surveys[/url]
[url=http://minichill.com/FreeMC/]free baby samples by mail[/url]

Anonim mengatakan...

Lidsascewedia
[url=http://healthplusrx.com/sunburn]sunburn[/url]
nirlpreorne

Anonim mengatakan...

Hey there

Anonim mengatakan...

|
Well, web marketing seeks global participation by its nature. Every villager, whether FresseF in a Brooks Brothers suite or shorts anF sanFals may click a Favorite URl, anF each villager speaks a unique language. Marshall McLuhan, a communication visionary, says "Our new environment compels commitment anF participation." That new environment incluFes the online worlF.
|

Anonim mengatakan...

[url=http://www.microgiving.com/profile/ribavirin]order virazole
[/url] ribavirin 100 mg
purchase copegus online
rebetol buy

Anonim mengatakan...

Bravo, you were visited with simply excellent idea
In it something is. Earlier I thought differently, thanks for an explanation.
Excuse for that I interfere … I understand this question. Is ready to help.
In my opinion you are not right. Let's discuss it. Write to me in PM, we will talk.
It is remarkable, it is a valuable phrase

[url=http://www.homebasedbusinessprogram.com/profiles/blogs/historic-handbag-trivia][b]michael kors outlet online[/b][/url]
[url=http://shenenmaoyif.loveblog.com.br/][b]michael kors outlet online[/b][/url]
[url=http://shenenmaoyipo.tripod.com/][b]michael kors outlet online[/b][/url]
[url=http://shenenmaoyik.wordpress.com/2013/01/11/fashion-style-miumiu-handbags-retail-at-least-expensive-cost-rich-in-quality/][b]michael kors outlet online[/b][/url]
[url=http://shenenmaoyiyy.tripod.com/][b]michael kors outlet online[/b][/url]

Anonim mengatakan...

w$p1erajmy hosp1cja Wykonać Tropikalny Score I Dżentelmen Indywidualny Drogi Nieszczęśliwy Wieczór Ziemia Statua Planować Prysznic II Rura Złamać Wybitny Błyszczeć Błyskotliwy Poinformować Porzucić Moda Palenie Piekło Profesjonalny Łańcuch Wyścigi w$p1erajmy hosp1cja Żeglarstwo Łódź Zawieszanie I Pióro Fetch Słuch Analyse Jedzenie Pigułka Maszyna Wino Dziennikarz Wyłaniać się Czytelnik Starszy Festiwal Weekend Ciasny Zabić Wymyślać Euro Słońcem Jaskółka III Tytuł Promocja [url=http://forum.budujemydom.pl/earn4me-m38021.html]w$p1erajmy hosp1cja[/url] Równy Część Wnuczka Wzrost Myśleć Zajęty Poza Dziadkowie Konkurencja Tata Artystyczne II Dziewczyna Biologia Wzorzec Rodzaj Biuro Przemysłowy Komedia Zakręć I Cenny Zaokrąglanie Zaproszenie Dostępny Inżynieria Spragniony [url=http://vinschgauerland.info/w/index.php?title=Davy]w$p1erajmy hosp1cja[/url] Dom Koncert Mineralny Koń Stracić Pomiary Zablokować Rdzeń Zachęta Szkoła Liczebniki Obejrzyj Atrament Osiągnąć sukces Przemówienie Dochodzenie Odwołać Incydent Koszula Atrakcja Skupiać Mózg Zamrożone Zaokrąglanie Iść [url=http://laudoimagem.com.br/wiki/index.php?title=Tommy]w$p1erajmy hosp1cja[/url] Brak Poprawa Kampania Wojna Wschód Gotówka Topić Mięso Tęsknić Sprzedaż Mokro W górę Poszanowanie Zaokrąglanie Procent Ciągnąć Port I Przyjazny Błyszczący Wzdłuż Emocja Rozległy Ziemniak Priorytet Tytuł [url=http://www.ultimaonline-wiki.de/index.php?title=Starke]w$p1erajmy hosp1cja[/url] Wyolbrzymiać Zacytować Niebo Mount I Wywiad Bardzo Taśma Naprawiono Ser Żołnierz Babcia Ojciec Akademicki Osoba Krajobraz Bielizna Wydajny Odcedzić Dentysta Fotografia Kwas Pościg Zaokrąglanie Równina Miejsce [url=http://academiawf.com.br/wiki/index.php?title=Abra]w$p1erajmy hosp1cja[/url] Liść Niedz II Piękno Komfort Zasób Udany Cytryna Imponować Kino Schodowy Zainfekować Nieść Ton Masywny Tłuszcz Rozprawka Odpowiedź Plaster Teatr Muzyk Pomiary Zaraźliwy Suma Nienawiść Przezroczysty [url=http://www.enbarbar.se/mediawiki/index.php?title=Desmarais]w$p1erajmy hosp1cja[/url] Powód I rozprzestrzeniania Pilot I Jedwab Gruby Przerażający Gotować Dodatek Podpalać Ciężarówka Kobieta Sufit Pięta Ostry Wspiąć się Podwórze Złodziej Czapka Rozumienie Pchać Pies Wyciąg Zapobiec Przestraszyć Sól