Jak w prosty sposób upiększyć bloga? - 10 rad Karoliny z Karografia.pl

Jak w prosty sposób upiększyć bloga?

Nie tylko ludzi oceniamy po wyglądzie. Także portale, strony firmowe czy blogi, które odwiedzamy po raz pierwszy. Nowy czytelnik w ciągu kilku sekund decyduje, czy zostać, czy iść dalej. Niestety nawet wysokiej jakości treści się nie obronią, bo czytelnik zaatakowany kakofonią wzorów, nieczytelnych czcionek i nadmiaru banerków, ucieknie z Waszego bloga gdzie pieprz rośnie. 

Obecnie korzystam z płatnego szablonu dla Bloggera, jednak wcześniej, przez ponad 3 lata, mój blog wisiał na darmowym, podstawowym szablonie, który sama zmodyfikowałam. Dlatego z doświadczenia wiem, że jeżeli zastosujecie się do kilku prostych zasad, możecie uzyskać czytelny i przyjemny dla oka wygląd bloga. 

A jakie to zasady? Opowie Wam o nich ktoś o wiele bardziej doświadczony w temacie wyglądu bloga niż ja. Karolina z bloga Pasje Karoliny i firmy Karografia to specjalistka od upiększania blogów na Bloggerze. Karolina jest autorką wielu pięknych darmowych i płatnych szablonów, a także sprawczynią aktualnego wyglądu Chilli Czosnek i Oliwa. Oddaję głos Karolinie. 



Karolina Gierdziejewska
Matka trzech młodych mężczyzn, żona fantastycznego faceta i pasjonatka wszystkiego, za co się weźmie. Autorka bloga Pasje Karoliny oraz głównodowodząca w firmie Karografia, zajmującej się m.in.
upiększaniem blogów. Wielbicielka kotów i przyciągająca uśmiechniętych
ludzi. Swój czas dzieli między najbliższych, a swoje życie
zawodowe, które jest jej pasją.

Jak w prosty sposób upiększyć bloga?



Początkowo chciałam zatytułować ten wpis "10 zasad ładnego bloga", ale czasem zasady są po to, żeby je łamać. Powiedzmy więc, że ten wpis to spis rad, dzięki którym Twój blog może wyglądać lepiej, bez poważnych zmian w kodzie. Wystarczy zadbać o kilka spraw, by Twój blog stał się przejrzystszy i przyjemniejszy dla oka, a co za tym idzie, sprawiał, by chciało się do niego wracać.

  

1. Zadbaj o zdjęcia


Zaczynamy od zdjęć, bo obrazy działają z większa mocą niż słowa. Zwłaszcza w przypadku blogów kulinarnych warto zadbać o tą kwestię. Nie będę się jednak skupiać na jakości zdjęć czy kompozycji (w tym temacie więcej swobody mowy ma Zuzanna), ale aspektach związanych z wyglądem bloga. 

Jeśli chcesz, żeby Twój blog prezentował się przejrzyście i schludnie, zadbaj o wielkość zdjęć. To one przykuwają uwagę w pierwszej kolejności, więc dobrze będzie, jeśli będą odpowiedniej wielkości. Według mnie, w przypadku blogów kulinarnych, "duży rozmiar" to rozmiar to minimum. Jeszcze lepiej prezentuje się wpis, w którym zdjęcia wyrównane są do szerokości posta.

Jak w prosty sposób upiększyć bloga?

Nie każdy szablon oferuje taką możliwość, ale jest na to prosta rada. W edycji posta wybieraj oryginalny rozmiar zdjęcia, a w arkuszu CSS dodaj ten kod (Panel bloga - Szablon - Dostosuj - Zaawansowane - Dodaj arkusz CSS):

.post-body img {
  max-width:100%;
  height: auto;
  margin-left: -1em;
  padding:0px;
}
.post-body .tr-caption-container {
   padding: 0;
}
.post-body .tr-caption-container img {
   max-width: 100%;
   height: auto;
   margin-left: 0;
   padding: 0;
   display: block;
}


Oprócz wielkości, zwróć uwagę na proporcje zdjęć, zwłaszcza pierwszych - to od nich zależy jak będzie się prezentować cała strona główna. Najlepiej jeśli każde pierwsze zdjęcie dodawane do posta będzie w tych samych proporcjach (poziome lub pionowe). Jeśli zadbasz o tą kwestię, każdy szablon będzie pasował idealnie!

I jeszcze jedno - znak wodny! To rzecz, która źle użyta, potrafi popsuć nawet najpiękniejsze zdjęcie. Dodając znak wodny zadbaj o to, by to nie on przykuwał uwagę w pierwszej kolejności. Zamiast wyraźnego napisu warto dać półprzeźroczysty i umieścić go tak, by komponował się z całym obrazem.

Jak w prosty sposób upiększyć bloga?

2. Wybierz kolory przewodnie i trzymaj się ich


Wybierz 2-3 kolory główne. Najlepiej, żeby były neutralne, a jeden z mocniejszym akcentem. Na blogach kulinarnych zdjęcia są wystarczająco różnorodne. Zbyt duża ilość kolorów może rozpraszać i sprawiać wrażenie chaosu. 

Jeśli kompletnie nie masz pojęcia jakie połączenie kolorów będzie odpowiednie, możesz skorzystać ze stron, które trochę to zadanie ułatwiają. Ja najbardziej lubię czerpać inspiracje z Design Seeds lub Pinteresta (wpisując w wyszukiwarkę chociażby "branding colors"). Ciekawym narzędziem jest także colorhunter.com/. Tutaj możesz wpisać kod koloru HEX (np dla czarnego jest to #000), a poniżej pojawią Ci się propozycje najbardziej trafnych zestawień kolorystycznych.


3. Zdecyduj się na 2-3 fonty


Żeby blog był przejrzysty i czytelny nie szalej z fontami - wybierz dwa, góra trzy. Jeśli zdecydujesz się na jakiś ozdobny, dobrze by był jedynie dodatkiem - tylko wtedy spełni swoją funkcję dekoracyjną. Zwróć też uwagę, czy wybrany font posiada polskie znaki - nic tak nie psuje efektu, jak wyróżniające się ś,ć,ń... Font w treści posta powinien być przede wszystkim czytelny i odpowiednio duży- zrezygnuj z cieni!

Wybrane ozdobne fonty z których warto zrezygnować - brak polskich znaków: Cherry Cream Soda, Chewy, Coming Soon, Covered By Your Grace,  Crafty Girls, Damion, Dancing Script, Homemade Apple, Indie Flower, Mountains of Christmas, Rock Salt, Unkempt.

Jak w prosty sposób upiększyć bloga?
Niestety przeglądając fonty dostępne w Bloggerze można zauważyć, że większość polskich znaków nie posiada. Z tych typowo ozdobnych właściwie tylko Lobster i Sacramento nadają się na polskie blogi. Jednak równie pięknie prezentują się np. Georgia czy moja ulubiona Playfair Display. Najchętniej wybierane jako główny font są: Arial, Verdana, Lato i Roboto, ale tak naprawdę wybór zależy tylko od Ciebie - ważne, by zadbać o kwestie wymienione powyżej.


4. Neutralne tło i umiar z ozdobnikami


Nie jestem przeciwniczką dodawania tła na bloga, ale jeśli już decydujesz się zastosować tło, to warto, by było neutralne. Już same zdjęcia wnoszą dużo koloru, a tło w końcu ma być jedynie dodatkiem, prawda?  

I nie chodzi mi tu o sam kolor, ale również fakturę - warto podejść do tego z głową i zrezygnować z pstrokatych kolorów, czy ciężkich wzorów. To samo tyczy się wszelkich ozdobników. Dekoracyjny kursor, obrazkowe "czytaj dalej", kwiatki przy tytułach w pasku bocznym... - co za dużo to niezdrowo. Nie mówię, żeby całkowicie zrezygnować z ozdobnych dodatków, ale zachowaj umiar i zadbaj, by elementy były ze sobą spójne.


5. Wyrównanie tekstu


Środkowanie tekstu używaj tylko w uzasadnionych przypadkach. Główny tekst powinien być wyjustowany lub wyrównany do lewej. Którą z tych opcji wybrać? Na wielu forach ten temat powraca jak bumerang - zdania zarówno czytelników, jak i blogerów są podzielone. Jedno jest pewne - nie środkuj całych tekstów. Wyśrodkowanie może się przydać, np. przy liście składników, cytatach itp - tę opcję pozostaw "na specjalne okazje".

Jak w prosty sposób upiększyć bloga?

6. Używaj wypunktowań i nagłówków


Teksty o wiele lepiej się czyta, gdy są podzielone na partie. Dzięki używaniu nagłówków i wypunktowań (np. przy liście składników) post prezentuje się przejrzyściej, łatwiej znaleźć interesujący nas fragment...  a przy okazji, takie zabiegi nie pozostają bez wpływu na SEO :)


7. Usuń niepotrzebne gadżety


Zbyt duża ilość gadżetów naprawdę psuje efekt. Pozostaw to, co jest naprawdę przydatne w nawigacji bloga. 

Na pewno powinnaś zostawić wyszukiwarkę, odesłanie do socialmediów, czy archiwum. Nie potrzebujesz jednak kolejnego licznika odwiedzin (tu nawet warto uważać, bo czasem zewnętrze gadżety tego typu przekierowują blog na podejrzane strony), czy mapy z zaznaczonymi punkcikami odwiedzających. Te same informacje znajdziesz w Google Analytics.


8. Usuń / Uporządkuj banery


Nie jestem zwolenniczką dodawania banerów w pasku bocznym. Lista banerów wcale nie podnosi "prestiżu" bloga, a zajmuje sporo miejsca i potrafi zepsuć nawet dopracowany szablon. Najczęściej każdy baner ma inny wymiar, o kolorach nie wspominając. Wiem jednak, że sporo osób podejmując współpracę zobowiązuje się do umieszczenia reklamy w pasku bocznym. Co wtedy zrobić, żeby blog prezentował się lepiej?

Po pierwsze - chyba nie zobowiązujesz się do trzymania tego baneru na wieczność? Utwórz nową stronę "Współpraca" lub "Współpracowałam z" i po zakończonej współpracy tam przenieś konkretny banerek.

Po drugie - banery, które musisz mieć w pasku bocznym ładnie ułóż i wyrównaj rozmiary. Dzięki temu pasek będzie wyglądał choć trochę przejrzyściej.

Jak to zrobić?
  1. możesz dociąć banerki do takiej samej szerokości w programie graficznym, np. darmowym PhotoScape
  2. możesz skorzystać z poniższych kodów, które automatycznie dopasują wielkość banerów. Wystarczy dodać gadżet HTML/Java i wkleić jeden z poniższych kodów (po a href= wkleić link do strony, a po img src= dodać link do banerka).

Sposób 1


<center>
<div id="banery">
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
</div>
</center>
<style>
#banery img {width:150px;display:block;margin:20px 0}
</style>

lub

Sposób 2


<center>
<div id="banery">
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
<a href="LINK DO STRONY"><img src="LINK DO ZDJĘCIA"/></a>
</div>
</center>
<style>
#banery img {width:38%;display:inline-block;margin:4%}
</style>


Jeśli masz możliwość wyboru banerka, to wybieraj te w jak najbardziej neutralnych barwach lub kolorach zbliżonych do Twojej "blogowej palety".


9. Usuń niepotrzebne tytuły 


Zauważyłam, że wiele osób dodaje zbędne tytuły do każdego zdjęcia. To prawda, że Blogger wymaga wprowadzenia tytułu obrazu, ale można to w prosty sposób ominąć - wystarczy w miejscu tytułu wpisać <!>. Dzięki temu małemu trickowi możesz dodać samo zdjęcie - to się przydaje zwłaszcza, gdy umieszczasz sporo banerów, a nie chcesz skorzystać z punktu ósmego.


10. Uporządkuj etykiety


Używanie etykiet jest bardzo ważne, na blogach kulinarnych zwłaszcza. Warto pod każdym postem dodać informację o etykietach - dzięki temu czytelnik łatwo będzie mógł przeskoczyć do ciekawych przepisów z tej samej kategorii. Można też pomyśleć o umieszczeniu etykiet w pasku bocznym, ale...

No, właśnie i tu pojawia się małe "ale". Ogromna chmura tagów wcale nie wygląda ładnie i wbrew pozorom utrudnia nawigację, a przecież ma być na odwrót? O wiele lepiej będzie pokazać jedynie "wybrane etykiety", te najbardziej istotne z punktu widzenia czytelnika. Możne je też pogrupować np. "przepisy wg składnika", "przepisy wg dnia" itp...

Jak to zrobić? Wystarczy edytować gadżet "etykiety" (lub dodać nowy, jeśli go jeszcze nie masz) i w ustawieniach zaznaczyć opcję "Wybrane etykiety", a następnie nacisnąć napis "Edytuj", który pokazał się poniżej. Teraz na wyświetlonej liście zaznaczasz wybrane etykiety, wciskasz "Gotowe" i zapisujesz gadżet.



To tylko kilka rad, które mam nadzieję są dla Was przydatne. Można by oczywiście wymienić więcej, ale właściwie wszystko sprowadza się do jednego - "mniej, znaczy więcej". Często już samo usunięcie zbędnych gadżetów i bajerów sprawia, że blog nabiera świeżości.

*
Dziękuję Ci Karolino za podzielenie się tymi wskazówkami. Ten kod pomagający uporządkować banery sama mam zamiar wykorzystać :)
Jestem ciekawa, czy stosujecie na swoich blogach wymienione przez Karolinę zasady, czy są one dla Was nowe? W jaki sposób zadbaliście o ładny wygląd Waszych blogów?
Jeżeli spodobał Ci się ten wpis, pozostańmy w kontakcie. Możesz śledzić moją stronę na Facebooku lub Google +, aby być na bieżąco z kolejnymi wpisami. Obserwuj mnie też na Instagramie, gdzie znajdziesz migawki z mojego codziennego życia.

Brak komentarzy:

Prześlij komentarz

Serdecznie dziękuję za wizytę na moim blogu i pozostawione komentarze:) Jeżeli wypróbowałaś/eś przepis z mojego bloga, prześlij mi zdjęcie, a umieszczę je w galerii na Facebooku.