W dniu 2010-11-09 08:55, olo pisze:

> jeśli mowa o centrowaniu w linii tekstu i obrazka (lub elementu
> inline-block) to jest to całkowicie normalne, bo w końcu po to to
> powstało :)

Taaaa, to akurat pikuś.

> Natomiast centrowanie w pionie layoutu wydaje mi się już mniej
> potrzebne. Teraz nie robię już za wiele projektów, niemniej rzeźbię cały
> czas swój i jestem w miarę na bieżąco z tego typu problemami i nie
> zdarzyło mi się ostatnio pomyśleć, żeby użyć tabelki.

No właśnie i w tym rzecz. A ja co jakiś czas przerabiam kwestię dwóch
kolumn jednakowej wysokości albo centrowania w pionie fragmentu layoutu
(komórki "tabeli").

> Dobrym sposobem (ale nie wtedy jak wisi deadline nad głową) jest:
> 1. Obmyślić strukturę używając najbardziej pasujących semantycznie
> elementów
> 2. Użyć CSS aby struktura wyglądała tak jak potrzeba

To oczywiste :-)

> Zdarzało mi się już zrobić kawał strony, nie wiedząc jak będzie ona
> docelowo wyglądać.

Niesamowite :-D To mi się nigdy jeszcze nie przytrafiło :-D
Zazwyczaj, a może nawet zawsze co do piksela wiem jak będzie wszystko
wyglądało. Ba! Nawet jeśli wyszło w praniu, że coś trzeba przesunąć parę
pikseli to wymagało to niemalże zgody samego prezydenta :-D Zazdroszczę
Ci tej swobody ;-)

do góry

W dniu 2010-11-08 23:41, Michał Gancarski pisze:

> Wręcz przeciwnie. Domyślne style będą dawały albo jakąś kaszanę albo ładny
> dokument z nagłówkami, sekcjami, listami. Prosty ale czytelny. Wszystko
> zależy od tego jak HTML jest zrobiony.

Faktem jest, że bardzo rzadko robię proste layouty. Floaty to już
standard. Bez CSS miesza się ich kolejność.

> Ale w inny sposób jeśli chcą je dostosowywać do małych ekranów. Stąd
> stosuje się np. media queries by podawać alternatywne style dla małych
> ekranów.

Skoro czynimy daleką dygresję od wątku głównego... Wiesz - chyba w tym
wątku pisałem już o tym. Mianowicie kiedyś ciekawa dyskusja była na
temat zachowywania kompatybilności ze starymi przeglądarkami. Ktoś
słusznie zauważył, że nie warto tym się przejmować i pisać pod bieżące
wersje. Jeśli ktoś posiada starą przeglądarkę i zobaczy w niewłaściwy
sposób stronę, to w końcu to jego wybór. W pewnym stopniu można to
przenieść na urządzenia mobilne "starego typu". Jeśli zakładamy, że
robimy serwis klasyczny, który nie wymaga aby użytkownicy czegokolwiek,
co łączy się z internetem musieli mieć dostęp do strony (np. bankowość,
choć banki też tego nie przestrzegają zawsze), to można darować sobie
takie zabawy. Posiadacz np. telefonu z jakąś prowizoryczną przeglądarką
następnym razem kupi model z normalną przeglądarką widząc co sobie
narobił. :-) Za jakiś czas pewnie wszystkie telefony będą je miały.
Problem więc wydaje mi się niszowy.

> To również jest bardzo ułatwione gdy nie masz niepotrzebnych
> elementów w strukturze dokumentu.

To już zupełnie inne zagadnienie. Oczywiście dokument nie może być
śmietnikiem na tagi. Jednakże czy robienie np. buttonów jako złożenie
dwóch tagów (bo inaczej się nie da zrobić rozciągliwego buttona) to już
śmietnik?

> Ja zaś stylowałem już zadany, dobrze zrobiony HTML i okazywało się, że
> można zrobić wiele w ogóle nie dotykając niczego poza HTMLem.

Tak, to dotyczy bardzo prostych layoutów tylko i można traktować jako
ewenement. Trywialny przykład: mieliśmy layout dwukolumnowy, a teraz ma
być trójkolumnowy. Tego nie da się zrobić w CSS. W jednym projekcie taka
sytuacja miewa miejsce. Elementy sterujące stroną zazwyczaj wymagają
wyznaczenia im miejsca w postaci jakiegoś DIV'a. A więc jeśli mamy 1
grupę takich elementów to layout HTML jest inny niż w przypadku dwóch
lub trzech. Nie da się zrobić layoutu pasującego do wszystkich stron WWW
świata.

>> Tu pewnie masz rację. Nie znam tematu Wordpressa. Nierzadko tworzę
>> jakieś zawiłe realizacje z komunikacją Flashy między sobą itp. Na trzech
>> na krzyż DIVach za diabła się tego nie daje zamknąć. Zmiana takiego
>> layoutu CSS'em praktycznie jest niewykonalna.
>
> No brzmi fikuśnie.

No i działa też fikuśnie. Przykładowo flashowa animowana galeria
miniaturek zdjęć dostosowująca swój rozmiar dynamicznie do ilości zdjęć.
Kliknięcie czyni miniaturkę czarno-białą, otwiera powiększenie i
wyszarza tło pod powiększeniem. Przy czym powiększenie też jest we
Flashu z animacjami (płynna nawigacja, komunikacja z serwerem w tle
itp). Zdjęcia oglądane w powiększeniu powodują, że w pierwszej animacji
stają się czarno-białe. Tego w HTMLu z 3ma DIVami na krzyż nie da się
zrobić... CSSem nie wpłyniesz na funkcjonalność ani też nie przeniesiesz
bez zmian w grafice rozwiązania do innego serwisu gdyż nie będzie on
pasował wizualnie. To był przykład typowej pracy...

do góry

W dniu 2010-11-08 23:42, Michał Gancarski pisze:

> To jest tylko sposób wyświetlania. Tak samo jak nie ma problemów z zadaniem
> display: block elementom domyślnie będącym inline. Od tego jest ta
> instrukcja właśnie.

Tak też sądziłem - w końcu DIV jest tagiem semantycznie uniwersalnym.
Tabela już zdecydowanie nie.

do góry

On Tue, 09 Nov 2010 10:19:28 +0100, Marek wrote:

> W dniu 2010-11-08 23:41, Michał Gancarski pisze:
>
>> Wręcz przeciwnie. Domyślne style będą dawały albo jakąś kaszanę albo ładny
>> dokument z nagłówkami, sekcjami, listami. Prosty ale czytelny. Wszystko
>> zależy od tego jak HTML jest zrobiony.
>
> Faktem jest, że bardzo rzadko robię proste layouty. Floaty to już
> standard. Bez CSS miesza się ich kolejność.

Tu nie chodzi o "proste" layouty. Możesz podać przykład takiego, w którym
trzeba zniekształcać kolejność?


>> Ale w inny sposób jeśli chcą je dostosowywać do małych ekranów. Stąd
>> stosuje się np. media queries by podawać alternatywne style dla małych
>> ekranów.
>
> Skoro czynimy daleką dygresję od wątku głównego... Wiesz - chyba w tym
> wątku pisałem już o tym. Mianowicie kiedyś ciekawa dyskusja była na
> temat zachowywania kompatybilności ze starymi przeglądarkami. Ktoś
> słusznie zauważył, że nie warto tym się przejmować i pisać pod bieżące
> wersje. Jeśli ktoś posiada starą przeglądarkę i zobaczy w niewłaściwy
> sposób stronę, to w końcu to jego wybór. W pewnym stopniu można to
> przenieść na urządzenia mobilne "starego typu".

Nie. Mały ekran to nadal mały ekran i mniejsza rozdzielczość. Nie zmieni
tego nawet najnowocześniejsza przeglądarka. Tu chodzi nie o to by
wyświetlić stronę tak jak na desktopie, tylko by wyświetlała się tak by
jesz ją można było wygodnie użyć.


> Jeśli zakładamy, że
> robimy serwis klasyczny,

"Klasyczny" tzn. jaki?


> który nie wymaga aby użytkownicy czegokolwiek,
> co łączy się z internetem musieli mieć dostęp do strony (np. bankowość,
> choć banki też tego nie przestrzegają zawsze), to można darować sobie
> takie zabawy. Posiadacz np. telefonu z jakąś prowizoryczną przeglądarką
> następnym razem kupi model z normalną przeglądarką widząc co sobie
> narobił. :-) Za jakiś czas pewnie wszystkie telefony będą je miały.
> Problem więc wydaje mi się niszowy.

Ponownie - to nie ma nic wspólnego z "prowizorycznymi" przeglądarkami.
Wręcz przeciwnie.


>> To również jest bardzo ułatwione gdy nie masz niepotrzebnych
>> elementów w strukturze dokumentu.
>
> To już zupełnie inne zagadnienie. Oczywiście dokument nie może być
> śmietnikiem na tagi. Jednakże czy robienie np. buttonów jako złożenie
> dwóch tagów (bo inaczej się nie da zrobić rozciągliwego buttona) to już
> śmietnik?

Trochę nie rozumiem przykładu. Tzn. nie wiem konkretnie co masz na myśli.


>> Ja zaś stylowałem już zadany, dobrze zrobiony HTML i okazywało się, że
>> można zrobić wiele w ogóle nie dotykając niczego poza HTMLem.
>
> Tak, to dotyczy bardzo prostych layoutów tylko i można traktować jako
> ewenement.

Nie.


> Trywialny przykład: mieliśmy layout dwukolumnowy, a teraz ma
> być trójkolumnowy. Tego nie da się zrobić w CSS.

Trójkolumnowego layoutu? Nie mogę dyskutować nie widząc kodu i tego co na
co się zmienia.


> W jednym projekcie taka
> sytuacja miewa miejsce. Elementy sterujące stroną zazwyczaj wymagają
> wyznaczenia im miejsca w postaci jakiegoś DIV'a. A więc jeśli mamy 1
> grupę takich elementów to layout HTML jest inny niż w przypadku dwóch
> lub trzech. Nie da się zrobić layoutu pasującego do wszystkich stron WWW
> świata.

Ale czy ja o czymś takim piszę?


>>> Tu pewnie masz rację. Nie znam tematu Wordpressa. Nierzadko tworzę
>>> jakieś zawiłe realizacje z komunikacją Flashy między sobą itp. Na trzech
>>> na krzyż DIVach za diabła się tego nie daje zamknąć. Zmiana takiego
>>> layoutu CSS'em praktycznie jest niewykonalna.
>>
>> No brzmi fikuśnie.
>
> No i działa też fikuśnie. Przykładowo flashowa animowana galeria
> miniaturek zdjęć dostosowująca swój rozmiar dynamicznie do ilości zdjęć.

A jest dziś jeszcze w ogóle sens w robieniu flashowych, animowanych galerii
zdjęć? To samo przez się brzmi podejrzanie.


> Kliknięcie czyni miniaturkę czarno-białą, otwiera powiększenie i
> wyszarza tło pod powiększeniem. Przy czym powiększenie też jest we
> Flashu z animacjami (płynna nawigacja, komunikacja z serwerem w tle
> itp). Zdjęcia oglądane w powiększeniu powodują, że w pierwszej animacji
> stają się czarno-białe. Tego w HTMLu z 3ma DIVami na krzyż nie da się
> zrobić... CSSem nie wpłyniesz na funkcjonalność ani też nie przeniesiesz
> bez zmian w grafice rozwiązania do innego serwisu gdyż nie będzie on
> pasował wizualnie. To był przykład typowej pracy...

No ja tu węszę błędne decyzje już na poziomie wyboru technologii. Dało się
tam chociaż linkować do konkretnego zdjęcia w galerii?


--
Michał Gancarski

Sieeeaaaaaaaaaaa!

do góry

On 2010-11-08 22:42, Marek wrote:
> Czyli innymi słowy nie ma przeciwwskazań albo jakiś zaleceń w kwestii
> używania "tabel" na CSS jako elementów layoutu?

Jedynym przeciwwskazaniem jest to, że prawIE przeglądarki tego nIE
obsługują. Ale jeżeli badzIEw Cię nIE interesuje - hulaj do woli.
CSSem możesz robić co Ci się żywnie podoba, nie zmieni to nijak
znaczenia HTML-owych elementów, jedynie ich wygląd.


--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}

do góry

On 2010-11-08 23:10, Marek wrote:
> Może to kwestia branży w jakiej działam. Zmiana layoutu praktycznie
> oznaczała zawsze nowy layout. Póki co nigdy nie przeniosłem starego
> HTML'a do nowego projektu. Zawsze różnice były zbyt drastyczne aby
> dawało się nagiąć poprzedni layout.

Uuuu, ktoś tu nie zna csszengarden.com ;)


--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}

do góry

W dniu 2010-11-09 10:33, Michał Gancarski pisze:
> On Tue, 09 Nov 2010 10:19:28 +0100, Marek wrote:

> Tu nie chodzi o "proste" layouty. Możesz podać przykład takiego, w którym
> trzeba zniekształcać kolejność?

Nie "trzeba" gdyż to określa zabieg celowy lecz "tak się dzieje". Obrazowo:

<div style="width:500px">
<div style="float:right; width:100px">tekst 2</div>
<div style="float:left; width:100px">tekst 1</div>
</div>

Bez CSS tekst 2 będzie jako pierwszy.

> Nie. Mały ekran to nadal mały ekran i mniejsza rozdzielczość. Nie zmieni
> tego nawet najnowocześniejsza przeglądarka.

U siebie w telefonie mam wyświetlacz mały tj. 640 x niewiele (nie
pamiętam). Widzę fragment normalnej strony nawet z Flashami. Palcem ją
przesuwam, oddalam, przybliżam. CSS jest chyba w pełni interpretowany. W
niczym to nie przeszkadza przecież. W poprzednim telefonie 2 lata temu
miałem podobnie choć wtedy jeszcze nie było dotykowych. Jakoś nawet nie
pomyślałem o tym aby chcieć oglądać to w wersji bez CSS lub tekstowej.

> Tu chodzi nie o to by
> wyświetlić stronę tak jak na desktopie, tylko by wyświetlała się tak by
> jesz ją można było wygodnie użyć.



>
>
>> Jeśli zakładamy, że
>> robimy serwis klasyczny,
>
> "Klasyczny" tzn. jaki?

Taki jak w zdaniu niżej wyjaśniłem. Opiszę może innymi słowami.
Nie posiadający specjalnego przeznaczenia (np. WAP - tylko mobilne albo
bankowość - dobrze uwzględnić mobilne, a może jeszcze coś)

>
>
>> który nie wymaga aby użytkownicy czegokolwiek,
>> co łączy się z internetem musieli mieć dostęp do strony (np. bankowość,
>> choć banki też tego nie przestrzegają zawsze), to można darować sobie
>> takie zabawy. Posiadacz np. telefonu z jakąś prowizoryczną przeglądarką
>> następnym razem kupi model z normalną przeglądarką widząc co sobie
>> narobił. :-) Za jakiś czas pewnie wszystkie telefony będą je miały.
>> Problem więc wydaje mi się niszowy.


> Ponownie - to nie ma nic wspólnego z "prowizorycznymi" przeglądarkami.
> Wręcz przeciwnie.

Prognozujesz, że takich urządzeń nie potrafiących wyświetlić pełnej
szaty będzie przybywało? Hmmm... ja obserwuję dokładnie odwrotną
tendencję. Nowsze np. telefony coraz częściej mają pełne przeglądarki.

> Trochę nie rozumiem przykładu. Tzn. nie wiem konkretnie co masz na myśli.

Zostawmy to. To mało istotne w naszej dyskusji. Niepotrzebnie zrodzi
poboczny wątek.

>> Trywialny przykład: mieliśmy layout dwukolumnowy, a teraz ma
>> być trójkolumnowy. Tego nie da się zrobić w CSS.
>
> Trójkolumnowego layoutu? Nie mogę dyskutować nie widząc kodu i tego co na
> co się zmienia.

ok

<div id="container">
<div id="lewaKolumna">tu teksty</div>
<div id="prawaKolumna">tu teksty</div>
</div>

Za pomocą CSS nie przerobisz tego na:

<div id="container">
<div id="lewaKolumna">tu teksty</div>
<div id="srodkowaKolumna">tu teksty</div>
<div id="prawaKolumna">tu teksty</div>
</div>

W praktyce zawsze trzeba ingerować w HTML. Wyjątki stanowią sztywne
serwisy, które zawsze będą miały takie same sekcje, w których być może
tło się jedynie będzie zmieniać. Nie zrobisz np. ze strony głównej WP
sklepu internetowego zmieniając tylko CSS. A taką różnorodność przerabiam.

>
>> Nie da się zrobić layoutu pasującego do wszystkich stron WWW
>> świata.
>
> Ale czy ja o czymś takim piszę?

Tak to właśnie odebrałem - że strona powinna być tak zrobiona aby za
pomocą CSS można było ją zmienić w każdą inną.

> A jest dziś jeszcze w ogóle sens w robieniu flashowych, animowanych galerii
> zdjęć? To samo przez się brzmi podejrzanie.

Dlaczego podejrzanie? :-) Flash chyba do takich celów służy. Mamy mało
miejsca, chcemy pokazać dużo i do tego ciekawiej niż czysty HTML pozwala
- wtedy Flash.

> No ja tu węszę błędne decyzje już na poziomie wyboru technologii. Dało się
> tam chociaż linkować do konkretnego zdjęcia w galerii?

Wszystko się da zrobić. Mówisz o linku HTML'owym po to aby Google go
widziały czy o linku w sensie wykonywanej akcji "klik -> reakcja"?

Jeśli o to pierwsze, to te zdjęcia z galerii prowadziły do kart
katalogowych eksponatów, gdzie były już osadzone tradycyjnie. Dojście do
tych miejsc jest również w "tradycyjny" sposób bo to tylko forma
szybkiego przewodnika.

Na czym błąd Twoim zdaniem polega bo nawet nie jestem w stanie domyślić
się toru rozumowania. :-)

do góry

W dniu 2010-11-09 13:36, Paweł Piskorz pisze:


> Uuuu, ktoś tu nie zna csszengarden.com ;)

Hehe, witaj Pawle ponownie.
Bardzo spodobał mi się tekst "the beauty of css design" w kontekscie
hacków, warunków, sztuczek o jakie walczą chłopaki na tej grupie po to
aby layout dobrze wyglądał na kilku browserach. :-)

A zdanie " If your design doesn't work in at least IE5+/Win and Mozilla
(run by over 90% of the population), chances are we won't accept it." w
szczególności "IE5" w nim skłania do tworzenia layoutów a'la notepad aby
się zakwalifikować :-) Dopisałbym konieczność zachowania kompatybilności
z ZX Spectrum :-D No bo chyba nie pominęli tego kultowego sprzętu?
Przecież korzenie wielu znamienitych informatyków tam sięgają! No chyba,
że Atari ktoś wolał. :-D

do góry

W dniu 2010-11-09 13:27, Paweł Piskorz pisze:
> On 2010-11-08 22:42, Marek wrote:
>
> Jedynym przeciwwskazaniem jest to, że prawIE przeglądarki tego nIE
> obsługują. Ale jeżeli badzIEw Cię nIE interesuje - hulaj do woli.
> CSSem możesz robić co Ci się żywnie podoba, nie zmieni to nijak
> znaczenia HTML-owych elementów, jedynie ich wygląd.

A wiesz? Niedawno to sprawdziłem. Pod IE8 nie widziałem problemów.

http://phrogz.net/CSS/vertical-align/index.html

Wersja na DIVach działa elegancko.

do góry

On Tue, 09 Nov 2010 22:47:09 +0100, Marek wrote:

> W dniu 2010-11-09 13:36, Paweł Piskorz pisze:
>
>
>> Uuuu, ktoś tu nie zna csszengarden.com ;)
>
> Hehe, witaj Pawle ponownie.
> Bardzo spodobał mi się tekst "the beauty of css design" w kontekscie
> hacków, warunków, sztuczek o jakie walczą chłopaki na tej grupie po to
> aby layout dobrze wyglądał na kilku browserach. :-)
>
> A zdanie " If your design doesn't work in at least IE5+/Win and Mozilla
> (run by over 90% of the population), chances are we won't accept it." w
> szczególności "IE5" w nim skłania do tworzenia layoutów a'la notepad aby
> się zakwalifikować :-) Dopisałbym konieczność zachowania kompatybilności
> z ZX Spectrum :-D No bo chyba nie pominęli tego kultowego sprzętu?
> Przecież korzenie wielu znamienitych informatyków tam sięgają! No chyba,
> że Atari ktoś wolał. :-D

Podejrzewam, że bardzo dawno nie odświeżali reguł, to stara strona :-)


--
Michał Gancarski

Sieeeaaaaaaaaaaa!

do góry