O szablonach, ich projektowaniu i moich z tym zmaganiach...
niedziela, 30 listopada 2008

Nowy szablon na bloga utrzymany jest w jasnych kolorach. Ma bardzo prosty wygląd i jedynymi cechami, które go wyróżniają są krój Times New Roman (szablon z serii typograficznie) i dwa intensywne kolory dla ozdoby. Przygotowałam go na razie w dwóch wersjach kolorystycznych (obie intensywne) i różnych stronnościach (układach).


40 szablon oliwkowy

Szablon 40 Times, olowkowo-bordowy,
na starym kodzie, dla blogów na blox.pl. -550px- 



41 szablon indygo

Szablon 41 Times, indygo-magentowy,
na starym kodzie, dla blogów na blox.pl. -550px- 



Szablony te wygląd mają raczej uniwersalny i oszczędny. Pasują do różnych tematów. W 2012 zmieniłam im nieco kod pozbywając się zbędnych grafik ale zachowując niemal identyczny wygląd. Jedyna zmiana to dodatkowe, nieco bardziej ozdobne tło dla wyszukiwarki.

poniedziałek, 24 listopada 2008

Od dawna planowałam zmienić wygląd swojego bloga. Pierwszy termin ustaliłam sobie na lipiec ale niestety nie udało się. Projektów też było kilka. Pierwszy szablon miał być drewniany, raczej ciężki i z dość skomplikowaną wąską szpaltą bo całość nazwałabym raczej 2,5X niż 3X. Drugi projekt powstał w lipcu i był w błyszczącym i tłustym stylu Glosy (jedynym świadectwem o tym projekcie pozostał buton urodziny szablony katemac).

Nowy szablon mojego bloga powstał na początku tego miesiąca. Wczoraj przeniosłam go na docelowy blog i wtedy się zaczęło… Choć poszczególne elementy miałam zaplanowanie dość dokładnie to jednak ich działanie i wygląd nie w pełni mnie satysfakcjonowały. Dzisiaj szablon uzyskał spodziewany wygląd i choć nie wszystkie elementy są gotowe to na dzień dzisiejszy mogę ogłosić premierę nowego wyglądu szablonykatemac.blox.pl.

Wygląd

Szablon jest jasny i szeroki. Nie wiem na ile słusznie ale tym razem zdecydowałam się rozdzielić szpalty wykorzystując w grafikę w tle. Przez to szablon jest bardziej zwarty, ciasny i sporo traci na poczuciu przestrzeni. Kolory szablonu to w dalszym ciągu szarości, brązy i wpadający w czerwień róż. Zrezygnowałam z pasków w topie na rzecz paskowanego menu, które do pewnego stopnia ma korespondować z tą właśnie częścią starego wyglądu.

Szablony na bloga

Elementy

Na blogu pojawiło się lub pojawi kilka nowych elementów. Te które dopiero zostaną dodane opiszę gdy nadejdzie na nie czas. Z tych które już są warto zwrócić uwagę na paskowane menu które służyć ma nawigacji i łatwemu odnalezieniu drogi do najprzydatniejszych części bloga. Znajdują się tam linki do rss, strony about, podstawowych kategorii szablonowych itd. Nie wszystkie paski są aktywne ponieważ nie wszystkie strony są gotowe. Przykładowo FAQ postanowiłam podzielić na trzy części: o blogowaniu, o CSS i o moich szablonach. Jeżeli macie pomysły czy propozycje jakie pytania (i odpowiedzi) powinny znaleźć w części „Najczęściej Zadawane Pytania” to z chęcią dołączę wasze pytania do tych stron.

Na blogu kategorie w postaci poziomego tradycyjnego menu nad wpisami zostało ukryte. Nie potrafię pisać skryptów a więc nie jestem w stanie przerobić sobie tej części tak jak bym chciała. Pozostało mi jedynie napisanie jej na nowo. Kategorie znajdują się obecnie jako ostatni folder w trzeciej szpalcie. Zaletą takiego rozwiązania jest m.in. to, że teraz można przejść do wybranej kategorii wpisów także ze strony pojedynczej notki. O kategoriach napiszę jeszce słów kilka gdy skończę ich porząkowanie bo choć nowe kategorie już istnieją to spoto wpisów przypisanych jest w dalszym ciagu nie tam gdzie powinno.

Jedną z najbardziej rzucających się w oczy nowości na blogu jest graficzne menu polecane. O ile początkowo traktowałam własne zakładki jako coś co ma wyraźnie i skutecznie kierować w konkretne miejsca o tyle teraz tą funkcję ma spełniać graficzne menu reklamowe. W zasadzie nadal uważam, że wiele polecanych stron powoduje, ze żadna z nich nie jest de facto polecana teraz jednak postanowiłam wykorzystać zakładki nie do polecania a do uporządkowania pewnych rzeczy. W zakładkach będzie można znaleźć linki do przydatnych stron, wszystkich na jakie natrafię i jakie zwrócą moją uwagę – tym razem nie będę zwracała uwagi na ich liczbę. Polecanych natomiast tylko będzie pięć. Pierwsza pozioma belka to coś co podoba mi się najbardziej, jakaś nowość, coś szczególnego. Poniżej poziomej beli znajdują się cztery kwadraty z mieszanką przydatnych rzeczy. Pierwszy zawsze będzie jakiś szablon. Postaram się aby to nie był mój szablon a jeżeli już to raczej coś starego dla przypomnienia. Ostatnie pudełeczko to będzie strona tylko do oglądania – coś czym można się inspirować natomiast szablon jest zastrzeżony. To najczęściej będą moje projekty z dedykacja dla… ale czasami pojawiać się będą i inne layouty. Pozostałe dwa kwadraty to jakaś rada, fajny gadżet, bloksowa nowość itp.

Skrypty

Archiwum jest zwinięte skryptem Szymona. Zakładki zwinięte i wyświetlane na stronie z pojedynczą notką skryptem Eskey’a. Dodatkowo korzystam z listy odnośników społecznościowych którą stworzył Szymon i wyświetlam avatary z MBL przy komentarzach (uwaga ten skrypt został przez Debergeraca nieco zmieniony). A i ocywiście ulubione ostatnie komentarze  (by S.z.y.m.o.n of kors)

niedziela, 09 listopada 2008

W zasadzie nie maił to być szablon z tematem. Podstawowym założeniem tego projektu była prostota: jak najmniej elementów graficznych – sam CSS. Chodziło o to aby każdy mógł sobie wymienić zdjęcie w nagłówku i nadal mieć fajny szablon z czytelnym układem i estetycznymi rozwiązaniami. Mam nadzieję, że udało mi się założenia zrealizować a przy okazji przedstawić wam szablon lekko motoryzacyjny.

 

Uwagi nie całkiem techniczne:

  • Po pierwsze autorem zdjęcia w nagłówku jest Bob Jagendorf. Zdjęcie zostało udostępnione na licencji Creative Commons – jeżeli masz jakieś wątpliwości przeczytaj przystępne podsumowanie licencji.
  • Szablon jest prosty i myślę, że wprowadzanie do niego zmian nie będzie problemem i każdy będzie mógł go sobie dopasować do własnych upodobań.
  • Podstawowa kolorystyka szablonu opiera się na szarościach w różnym natężeniu. Jedynym kolorowym dodatkiem jest czerwień w dwóch odcieniach: ciemniejszym #aa0000 i jaśniejszym występującym jedynie w przypadku linków w notce #cc0000.
  • Strona statyczna jest opisana
  • Opisałam też kilka popularnych skryptów więc wystarczy dodać je do bloga:
  • zapraszam do skorzystania i realizowania własnych pomysłów
niedziela, 02 listopada 2008

Kontynuując serię muzyczną zapraszam do obejrzenia nowego szablonu na bloga. Tym razem styl tego szablonu przypomina serię tematyczną rękodzielniczą. Pod względem układu i projektu szablon jest częścią grupy, którą nazwałam typ warstwowy.


szablon muzyczny 04, kremowy

Szablon muzyczny 04, kremowy,
na starym kodzie, dla blogów na blox.pl. -500px- 


We wrześniu 2010 szablon zmienił częściowo swój wygląd, jest bardziej żółty, ma inny gramofon i kolory są mniej nasycone. Zmieniłam też czcionkę tytułów z Monotype Corsiva na Segoe Print, możliwe, że jest mniej powszechna ale poprzednia zbyt mnie irytowała. Decydując się na szablon proszę zwrócić uwagę na fakt, że właśnie Segoe Print jest pierwszym krojem dla nagłówków i nawet jeżeli ty widzisz wszędzie Trebuchet MS to część czytelników zobaczy pisankę Segoe a to moim zdaniem dość istotna zmiana.

Adres szablonu: http://muzyczny04szablonkatemac.blox.pl

fragmenty szablon m 04

Uwagi o szablonie muzycznym 05, kremowym
szerokość szablonu 860px
szerokość części na notkę 520px
szerokość pobocznej szpalty 180px (2x20px)
kolor tła kremowe z wzorkiem (#fcfcef) a w body żółtawe (#eeebb6)
kolor tekstu brązowy (#443322)
kolor linków bordowy (#8e1223)
pozostałe kolory jest ich całkiem sporo (#7b0046, #4a5e66, #005b7f, #48484a, #0d004c, #4d562a, #3b4524, #665533)
krój użyty w notce Trebuchet MS i dla nagłówków Segoe Print
wielkość tekstu notki small (około 13px)
interlinia w notce wartość względna: 150%
maksymalna wielość elementów graficznych w notce 550px
css-owe ramki przy grafikach tak
 MARGIN: 2px;
 padding: 8px;
 background: url(/resource/muz04_ziel_bg.gif) top center repeat;
wypunktowanie/numerowanie automatyczne
pogrubienie/kursywa automatyczne
blok cytatu (blockquote) przesunięcie i zmiana kroju na Segoe Print
nagłówki w notce (h1, h2, h3, h4, h5, h6) automatyczne
h3 - odstęp, jaśniejszy kolor i zmiana fontu na Segoe Print
wyróżnienie akapitów automatyczny odstęp
baza bloksowa stary kod: 0Etheme RiSpokojnystary kod: 0Etheme Spokojny
skrypty użytkowników, wklejki avatary w komentarzach, zwijane zakładki, Ostatnie komentarze, delicious, Awatary w komentarzach

dodatkowe klasy i identyfikatory

#menuTop - górne menu (długość 830px)
.boks i .tyt - dodatkowe kontenery w bocznej szpalcie

Szablon jest całkiem niezły. Kolorystyką bardzo mi odpowiada choć ja wybieram zazwyczaj bardziej beżowe niż kremowe odcienie. Jedyną rzeczą co do której mam poważniejsze zastrzeżenia jest font Segoe Print. Pisanki mają bardzo wyrazisty wygląd ich charakter narzuca klimat treści. Nie polecam ich jako kroju dla treści ale czasami w nagłówkach mógłby się sprawdzić.

Najpopularniejszą pisanką jest Comic Sans, który jest tak maksymalnie nadużywany, że to aż przykre. Comic Sans pasuje tylko w jednej określonej sytuacji: gdy pisze si komiksy dla dzieci. W pozostałych przypadkach należy się mocno zastanowić bo font ten nadaje infantylny charakter treści. Użyłam go kilka razy ale raczej się nie ostał na blogu bo nie chcę narzucać użytkownikom tak niedojrzałego charakteru pisma. Tutaj wykorzystałam nowszą pisankę Segoe Print, jest ładniejsza, bardziej pisankowa, ciekawsza. W dalszym ciągu bardzo charakterystyczna więc do zastanowienia się.

Szablon jest stosunkowo wiekowy i mimo wielu zmian i aktualizacji pewne rzeczy za każdym razem zostawiałam w spokoju. Jedną z nich jest skomplikowanie kolorystyczne. Szablon ma trzy odcienie wzorkowego tła i cztery różne kolory linków (plus dodatkowe cztery kolory dla hover linków). Tło topu zachodzi częściowo na wąską szpaltę a więc przecięte jest na dwie części i jeżeli ktoś chciałby wymienić top to proszę pamiętać, że są to dwa pliki (muz04_tyt.gif, muz04_ws.gif). Wszystko to sprawia, że szablon ten chociaż możliwy i stosunkowo łatwy do zmiany, będzie nieco bardziej pracowity.

W 2012 roku dodałam mu nowy wygląd dla RSS (będzie pasował także jeżeli tło topu zostanie zmienione) i ozdobniki pod notką bo coraz częściej odnoszę wrażenie, że jest to jedna z najbardziej upragnionych rzeczy w szablonie.

divider mniejszy
divider większy

Nie mam nic przeciwko temu aby ktoś skorzystał z tych ozdobników nie korzystając z szablonu. Proszę jednak umieścić na swoim bogu informacje o pochodzeniu ozdobników, najlepiej linkując do tej notki aby i inni mogli je znaleźć.

Jeżeli ktoś ma jakiś pomysł na to co można z tym szablonem zrobić, jaka zmianę przeprowadzić to proszę o informację w komentarzu. Z chęcią napisałabym notkę o jakiejś jego wyglądowej transformacji ale póki co nie mam na nią pomysłu więc to jest szansa na kogoś na zrealizowanie własnego pomysłu.


Zakładki:
O blogu i RSSsubskrybcja
Polecane wpisy z blogu
Pomocne
Przeglądarki
Katalogi szablonów
Polecane strony
Szablony z dedykacją
o CSS (notki z tego bloga i podobnych bloksowych)
o arkuszach stylów ogólnie (CSS) dla poczatkujących,
głównie zewnętrzne podręczniki
o CSS (przydatne podpowiedzi) dla średniozaawansowanych
- specyficzne rozwiązania
- jak reagują przeglądarki
Historia polecanych
Kolory
Pismo
Polecane artykuły
ilustrowany przewodnik po bloksie dla początkujących,
dla zielonych jak szczypiorek na wiosnę,
dla zaczynających bloksowanie
Tagi
Follow Me on Pinterest
Related Posts Plugin for WordPress, Blogger...