O szablonach, ich projektowaniu i moich z tym zmaganiach...
niedziela, 25 maja 2008
Sądząc po wynikach wyszukiwania niejednokrotnie pada pytanie „jaka czcionka na bloga?” Zazwyczaj polecam używanie „pewnych” czcionek, takich, które mają bardzo dobrą czytelność i są dostępne w przypadku większości systemów operacyjnych. Niejako pewniakami są szeryfowe Times New Roman, Georgia, bezszeryfowe: Arial, Verdana, Trebuchet MS czy monospace Courier New. Nie są to jednak jedyne powszechnie dostępne kroje

8 fonts you probably don’t use in css, but should

Kilka dni temu natrafiłam na ciekawy artykuł, który skłonił mnie do napisania tej notki. Tekst znajduje się na blogu www.3point7designs.com i dotyczy kilku innych krojów często powszechnie dostępnych.

  1. Palatino Linotype / Palatino
  2. Tahoma
  3. Impact
  4. Century Gothic
  5. Arial Black
  6. Arial Narrow
  7. Copperplate / Copperplate Gothic Light
  8. Gill Sans / Gill Sans MT
Obok nazw krojów można znaleźć tam bardzo ciekawą informację o dostępności tej czcionki. Przykładowo 97% użytkowników Windowsa i 78% Mac’a będzie wyświetlało krój Palatino.

Complete Guide to Pre-Installed Fonts in Linux, Mac, and Windows

Czytając komentarze natrafiłam na link do strony będącej niejako przewodnikiem po krojach. Czcionki uporządkowane są tam według rodzin i określone jest w jakich systemach są dostępne. Do wyboru mamy kategorie: Windows, Installed with MS Programs, Mac OS 10.4, Ubuntu (Linux). Teraz tylko odszukaj czcionkę którą chcesz użyć i sprawdź czy jest dostępna dla wszystkich użytkowników.

Rodziny czcionek

Na koniec tekst po polsku który wyjaśnia użycie czcionek w CSS. Choć to oczywiście bardzo istotny temat to w tym momencie najistotniejsza jest tabela prezentująca przykłady różnych czcionek. Może się zdarzyć tak, że Twoja przeglądarka niektórych z nich nie będzie znała tak więc w tym miejscu łatwo możesz zobaczyć co z tym fantem zrobi przeglądarka.

 

Źródła:

  • 8 fonts you probably don’t use in css, but should
  • Complete Guide to Pre-Installed Fonts in Linux, Mac, and Windows
  • Rodziny czcionek
PS. Przerwa dalej trwa
niedziela, 18 maja 2008

Robiąc już jakiś czas temu trzeci szablon ręczny, mniej więcej w połowie pracy zdałam sobie sprawę, że wychodzi mi coś bardzo ciekawego. Miałam przed sobą dwie możliwości: pójść dalej zaplanowana drogą i zrobić szablon handmade albo zrezygnować z tego pomysłu i zobaczyć co wyjdzie z tego szablonu gdy pozbawi się go tematu. Cóż… podejmowanie decyzji nie jest moją mocną stroną.

prosty szablon na bloga beżowy prosty beżowy szablon na bloga dla blox
szablon beżowy - prawy | szablon beżowy - lewy

Uwagi

  • Szablony są niemal identyczne, różnią się jedynie położeniem wąskiej szpalty
  • Wbrew pierwszemu wrażeniu żaden z tych dwóch szablonów nie jest zrobiony na tym samym html co trzeci szablon ręczny ; handmade miał wąską szpaltę umiejscowioną pod tytułem, te maja tytuł w szerokiej szpalcie
  • Szablon posiada tylko jeden element graficzny co przy moim nadużywaniu grafik do stworzenia wyglądu wydaje się być sukcesem
  • Zamierzam potraktować ten projekt jako wersję podstawową i w przyszłości stworzyć coś jeszcze na jego podstawie
  • Tymczasowo jednak ogłaszam przerwę, nie wiem na jak długo niemniej jednak wyższa konieczność i deficyt przygotowanych wcześniej wpisów zadecydowały o zwolnieniu tempa (wolno… wolniej…stop). Obiecuję jednak, że wrócę z regularnymi wpisami i nowymi szablonami.
  • Tymczasem może ktoś chciałby się pobawić BASIC szablonem… zapraszam do skorzystania
niedziela, 11 maja 2008

Zielony szablon cieszy się sporą popularnością postanowiłam więc przygotować drugi w alternatywnym kolorze. Określiłam go jako lawendowy ale nazwa koloru nie dla każdego będzie adekwatna. Może lepszy byłby fiołkowy... lawenda ma nieco cieplejszy mniej niebieskawy odcień. To jest po prostu szablon fioletowy.


szablon ręczny 04 - fioletowy

Szablon ręczny 04 - fioletowy,
na starym kodzie, dla blogów na blox.pl. -540px- 


Szablon jest niemal dokładną kopią zielonego. Poprawiając w 2012 szablony rękodzielnicze ten zrobiłam zmieniając tylko kolory z zielonego. Postaram się to opisać więc zachęcam do zajrzenia do notek z roku 2012.

Głównym powodem moich poprawek była chęć dodania górnego menu. Przy okazji poprawiłam nieco marginesy tak, że teraz nieco łatwiej zmienić stronność. Rewolucyjne jest zaś to, że przygotowałam również alternatywne topy.

poniedziałek, 05 maja 2008

Wczoraj miał premierę nowy wygląd bloga mojewypieki.blox.pl i dzisiaj śpieszę donieść iż to moja skromna osoba miała przyjemność szablon ten stworzyć. Na chwilę obecną reakcje są w większości pozytywne więc chyba można uznać, że cel został osiągnięty. Zapraszam więc do obejrzenia szablonu bloga Doroty - Moje wypieki.

wypieki

Tradycyjnie zacznę od kolorów. Wymyśliłam sobie biszkoptowy wygląd stąd też kolory pojawiające się na blogu miały kojarzyć się właśnie z biszkoptem. W pierwszej wersji nawet litery tytułu miały biszkoptowy wygląd ostatecznie jednak napis ma wygląd… czekoladowy. Początkowa paleta obejmowała znacznie więcej barw niż te które tu prezentuję ale jak wielokrotnie już pisałam mam problem z używaniem różnorodnych barw i zazwyczaj ograniczam się do kilku odcieni jednego koloru.

90816E
FFCC99
D7A98FE8C5B1FCF0E2
#90816E
#FFCC99#D7A98F
#E8C5B1
#FCF0E2
999999
4F7D95966B58553D33
#999999#4F7D95#966B58#553D33

Układ bloga jest trzyszpaltowy. Dorocie zależało na szerokim nagłówku, ja zaproponowałam trzecią szpaltę i tą drogą doszłyśmy to wyglądu w którym wąskie szpalty występują po obu bokach szpalty z treścią. To wymagało nowego technicznego rozwiązania problemu trzeciej szpalty. Dotychczas przesuwałam ją marginesem w prawo w tym przypadku przesunięcie w lewo nie dało oczekiwanego rezultatu (a właściwie dało tylko w każdej przeglądarce nieco inny). Dlatego też do umieszczenia trzeciej szpalty wykorzystałam pozycjonowanie absolutne w ramach elementu wypozycjonowanego relatywnie (więcej na ten temat można przeczytać na cssmonkey.blox.pl). W takim przypadku oczywiście szpalta z treścią nie może być przesunięta poprzez padding w BlogBodyBox ale użycie margin przy szerokiej szpalcie zadziałało właściwym przesunięciem więc takie rozwiązanie jest dużo wygodniejsze niż to które poprzednio stosowałam.

Na blogu wykorzystywane są skrypty zmieniające nieco jego wygląd. Przede wszystkim skrypt Debergeraca umożliwiający wyświetlanie spisu treści – rzecz bardzo przydatna a nawet niezbędna na blogu z przepisami. Przyznam się, że nie mam pojęcia o działaniu tego skryptu i nie chodzi mi tu o sprawy techniczne tylko raczej o zwykłe funkcjonowanie. Na szczęście nie przeszkadza to zbytnio w opisaniu wyglądu. Zwinięte archiwum w wersji zaproponowanej przez Szymona już stosowałam. W zasadzie skopiowałam CSS zaproponowany przez Szymona zmieniając jedynie kolory. Zakładki zwinięte są skryptem Eskey’a – wykorzystałyśmy tu druga wersję skryptu, która jest bardziej mobilna w porównaniu do pierwszej. Wyróżnienie komentarzy autora dokonane zostało skryptem popełnionym przez e-maupa. Do wyróżnienia wykorzystane zostało ciasteczko, które już od dawna było na blogu jako favikona. I ostatni, chyba najpopularniejszy na bloxie skrypt czyli ostatnie komentarze. Oczywiście autorstwa Szymona.

1 8 7 3

6 5 2 4

A teraz smacznego i zapraszam do internetowej kawiarenki Doroty

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...