Jak odtwarzać muzykę na stronie, aby po każdym przejściu na podstronę nie zaczynała grać od początku?

Muzyka na stronie – temat dość kontrowersyjny. Jako, że sam nie polecam stosowania jakiegokolwiek zagnieżdżania muzyki na stronie www, to czasem nie da rady obejść wymagań klienta i pomimo własnych uprzedzeń trzeba tą muzykę na stronę wstawić.
Jeśli już wstawiamy muzykę na stronę, to jedna bardzo ważna zasada – nie katujmy użytkownika danej strony tym, że w momencie gdy przechodzi on na jedna z podstron serwisu musi on słuchać zagnieżdżonego fragmentu muzyki po raz kolejny od początku!

W sieci można znaleźć kilka sposobów (ja znalazłem 3 możliwości) na osiągnięcie płynnego odtwarzania muzyki, pozwalającego na jednoczesne przeglądanie zawartości serwisu. Oto one:
- Zastosowanie ramek -> samo wykorzystanie ramek w tym momencie eliminuje jego wykorzystanie,
- Zrobienie całej strony we Flashu – co mi się kojarzy równie podobnie jak wspomniane ramki,
- Zastosowanie wyskakującego okienka – co jest także złe, ale z trojga złego jeszcze do zaakceptowania, oczywiście licząc się z irytacją użytkownika, który zapewne uwielbia jak mu z boku wyskakują niekontrolowane, niepożądane okna oraz należy się liczyć z tym, że większość użytkowników ma włączoną blokadę wyskakujących niespodzianek.

Przeglądając kilka tygodni temu artykuły w serwisie Nettuts, jeden przykuł moja uwagę. Może nie tyle on co powstały w jego wyniku przykład wykorzystania jQuery do animowanego wczytywania zawartości podstron w jakimś tam serwisie.

Działa on w bardzo prosty sposób. Wchodząc na stronę, wczytana zostaje jej zawartość, w momencie gdy chcemy przejść na podstronę, doczytywana jest tylko treść z określonego diva, czyli wszystko nad tym divem nie jest ponownie wczytywane podczas “przeładowania” strony.

Pojawia się więc możliwość umieszczenia np. odtwarzacza z nieszczęsną muzyką powyżej zawartości, która doczytuje podstrony wykorzystując jQuery.

Przykład: http://medeco.p9.pl/ex/muzyka/

Pomimo znalezienia owego sposobu na wyżej opisany problem (bo opisany przeze mnie sposób w 95% przypadków może z powodzeniem zastąpić wspomniane powyżej) oraz pomimo tego, że nie trzeba stosować prehistorycznego kodu lub robienia całej strony we Flashu, to nie udało mi się wykorzystać go do celu w jakim go wymyśliłem :/.
Powodem było/jest to, że strona jaką ostatnio robiłem i, na której musiałem zastosować muzykę, posiada na każdej podstronie inne tło definiowane w body (czyli w części gdzie nie dochodzi do doczytania podstrony), co nie pozwala na wykorzystanie rozwiązania.
Może ktoś ma jakiś pomysł jak zmienić dodatkowo tło podstrony bez przeładowania? Chyba, że znacie jeszcze inne sposoby na ww. problem?

W każdym bądź razie może komuś się przyda powyższy pomysł na użycie muzyki na stronie :) .

Kurs WWW – HTML + CSS w 40h – możliwe?

No w końcu się odbędzie kurs WWW na jaki się zapisałem jeszcze w październiku. Zapisując się poinformowano mnie, że to będzie HTML + podstawy JavaScriptu, teraz doszły jeszcze arkusze stylów.

Nie wiem jak to w ogóle może być możliwe przeprowadzenie kursu w 40 godzin o takim materiale, do tego kurs kończy się egzaminem, po którym Ministerstwo Edukacji wystawia certyfikat, że się zostało projektantem stron WWW. O ile oczywiście zaliczy się końcowy egzamin.
Jeśli do tej pory odbywały się takie kursy, to już wiadomo, skąd się biorą potworki w Sieci. Może i tym razem przedstawię materiał kursu bo zmienił się on od pierwotnie zakładanego:

 CZAS TRWANIA:
40 godzin
Kurs realizowany jest w systemie codziennym od poniedziałku do piątku w godz. od 9.00 do 13.00.

   CO UMOŻLIWIA KURS:
- uzyskanie kwalifikacji projektanta stron www, potwierdzonych zaświadczeniem o ukończeniu kursu na druku Ministerstwa Edukacji Narodowej.

   PROGRAM KURSU obejmuje m.in.:
1. Wprowadzenie - 1 godz.
- podstawy działania sieci Internet
- wprowadzenie do technologii WWW i HTML
2. Przeglądarki WWW - 1 godz.
3. HTML - 10 godz.
- struktura dokumentu
- czcionki
- bloki
- odsyłacze
- wykazy
- tabele
- style
- ramki
- formularze
4. Kaskadowe Arkusze Stylów (CSS) - 14 godz.
a) Vademecum CSS
- formatowanie tekstu
- tło
- obramowanie
- margines
- listy
- pozycjonowanie
- kursor
- pasek przewijania
b) Przykładowe projekty
5. Umieszczanie stron na serwerze WWW - 4 godz.
6. Java Script - wprowadzenie - 2 godz.
7. Wstawianie gotowych elementów Java Script do ston WWW - 2godz.
8. Tworzenie elementów multimedialnych w technologii Flash -6 godz.

W porównaniu to tego co miałem mieć na początku to usunięto punkt o poznaniu narzędzi do tworzeniu WWW, a dodano sporo, CSS + przegląd projektów w nim zrobionych. Cały czas nie mogę aż się nadziwić :D prędkości tego kursu, zapewne odbije się to strasznie na jakości nauczania jak i późniejszych efektów w postaci stron WWW.
Oby późniejsi projektanci nie stali się fachowcami od ramek, co najgorsze to strona samego kursu jest wykonana za pomocą ramek :|
ramki.gif

Spoglądając w źródło przypomniał mi się post Pawła Wimmera nt. ramek, i oby Pawle nadal spoczywały w spokoju, bo jak na tym kursie zaczną je wskrzeszać to będzie ROTFL x 1000. Według mnie nie powinno się ich już uczyć, jedynie można by było wspomnieć, że istnieją w dokumentacji ale na tym bym pozostał. Jeszcze jestem ciekaw, czy pójdą na łatwiznę wybierając tabele do rozmieszczenia elementów na stronie czy pokuszą się o divy i zastosowanie CSS-a. Można tu teraz się tak zastanawiać bo może po to właśnie rozszerzyli kurs aby były te divy (choć to raczej byłoby marzeniem).
Co do wycofanego omówienia programów do budowy WWW to myślę, że słuszna decyzja – sądząc po źródle kursu:

meta.gif

Mam mnóstwo pytań bez odpowiedzi, ale to już niebawem się zmieni – o wynikach tego kursu napisze na pewno!

Zapisałem się na… kurs tworzenia stron WWW

Tak, to prawda! Ostatnio będąc we Wrocławiu postanowiłem zapisać się na Kurs WWW. Jako, że webmaster ze mnie dobry (chyba) :P to postanowiłem zapisać się na owy kurs z dwóch powodów:

  • Pierwszym powodem jest to, że po tygodniu będę miał dyplom Ministerstwa Edukacji o ukończeniu takiego kursu, co zapewne się przyda do portfolio,
  • Drugim powodem jest to, że chcę sprawdzić czego właściwie można się na takim kursie nauczyć?!

Działając przez ponad dwa lata w Osiolki.net wiem, że poziom pisanych stron w Polsce nie jest doskonały. Chcąc sprawdzić skąd się to bierze wpadłem na ww. pomysł ;) . Także dziś rano (tzn. w niedziele) pojechałem zapisać się na kurs który potrwa, bagatela 30 godzin! Jak by nie patrzeć w 30 h to raczej nikt nie będzie umiał pisać stron. Ale z drugiej strony, może się mylę. Kurs odbędzie się w Prominet Collage i oferuje następujący program:


CEL KURSU:
- błyskawiczne i profesjonalne zdobycie wiedzy z zakresu tworzenia stron WWW,
- poznanie wybranych zastosowań i narzędzi informatycznych z danego zagadnienia.
Kurs prowadzony jest w formie warsztatów podczas których każdy z uczestników wykona własną działającą stronę WWW.

CZAS TRWANIA:
30 godzin
Kurs realizowany jest w systemie codziennym od poniedziałku do piątku w godz. od 9.00 do 13.00.

CO UMOŻLIWIA KURS:
- uzyskanie kwalifikacji projektanta stron www, potwierdzonych zaświadczeniem o ukończeniu kursu na druku Ministerstwa Edukacji Narodowej.

PROGRAM KURSU obejmuje m.in.:
1. Wprowadzenie - 1 godz.
- podstawy działania sieci Internet
- wprowadzenie do technologii WWW i HTML
2. Przeglądarki WWW - 1 godz.
3. HTML - 10 godz.
- struktura dokumentu
- czcionki
- bloki
- odsyłacze
- wykazy
- tabele
- style
- ramki
- formularze
4. Przegląd programów wspomagających tworzenie stron - 4 godz.
5. Umieszczanie stron na serwerze WWW - 4 godz.
6. Java Script - wprowadzenie - 2 godz.
7. Wstawianie gotowych elementów Java Script do ston WWW - 2godz.
8. Tworzenie elementów multimedialnych w technologii Flash -6 godz.

Zostałem poinformowany, że kurs zacznie się około 15 listopada, z miłą chęcią zdam relację z jego przebiegu. Przynajmniej na własnej skórze dowiem się jak się uczy przyszłych webmasterów w szkołach oraz na jakich metodach się to robi. Aż mnie ciekawi, czy od razu zostanie podjęta walka z divami, czy dla uproszczenia pozostanie wytłumaczone jak robić strony w tabelkach :/, albo nie daj Boże na ramkach (grr… zgroza).

Ten niedobry Ptaszor – zapowiedział, skomentował i opublikował – “Saga o Lekcjach cz. 13″

Długo nie trzeba było czekać na odpowiedź Pana Łukasza odnośnie mojego ostatniego wpisu nt. jego 12 lekcji. Można by powiedzieć:

Uderz pięścią w stół, a nożyce się odezwą…

Dobra, na tym zakończę zabawę w osobę posiadającą tomik z powiedzeniami :P . Pan Łukasz, postanowił odpowiedzieć na mój humorystyczny post na temat jego podejścia do tworzenia stron internetowych i związanych z tym przemyśleń. Powstała Lekcja 13:

lekcja13_wstep.png

Po powyższym wstępie, cytacie moich słów, czytamy:

Ponieważ nigdzie nie porównywałem żadnych przeglądarek, skłonny byłbym przypuszczać, że Pta­szor miał halucynację, gdyby nie to że zaraz potem napisał „Dodatkowo autor daje 12 lekcji”, Słowo „Dodatkowo” jest tutaj manipulacją mającą Czytelnikom wmówić, że gdzieś tam wychwalałem wy­szydzanego przez Osiołkowców Explo­rera, a ponieważ wyszydzanie Explorera jest b.modne, ma to nieprzychylnie nastawić do mnie Czytelników („huzia na tego który chwali Explorera”).

Panie Łukaszu, zauważyłem, że stara się Pan skierować tę “dyskusję” w kierunku takim, żeby zasadniczą rzecz, o którą w całym tym zamieszaniu chodzi, umieścić jak najbardziej z boku, a w sposób (jak Pan to sam określił) prostacki, zastąpić główny wątek poprzez próbę wyśmiania, obrażenia lub znieważenia mojej osoby, twierdząc, że mam halucynację itp. Rozumiem Pana zdenerwowanie, bo jak taki “szczeniak” jak ja może podważać Pańskie przemyślenia (czytaj Lekcje). Odpowiedź nasuwa się sama, gdyż za mną stoją fakty, ogólnie przyjęte standardy, lata pracy najlepszych programistów, i mógłbym tak wymieniać i wymieniać. Jeśli w moje słowa Pan nie wierzy, to chyba się Pan nie ośmieli i dalej będzie twierdził swoje w obliczu szeregu artykułów, publikacji całego świata, a w szczególności rekomendacji organizacji W3C.

Twierdzenie, że serwis Osiolki.net wyszydza przeglądarkę Internet Explorer, jest tutaj nie na miejscu, bo wystarczy przeczytać kilka zdań ze strony głównej serwisu, aby dowiedzieć się, po co, na co i w jakim celu został on stworzony:

Chcemy, aby Internet był dostępny dla wszystkich, niezależnie od tego, jakiego systemu bądź przeglądarki używają. Dlatego promujemy standardy W3C i piętnujemy osiołkowate strony stworzone wyłącznie dla “jedynie słusznej” przeglądarki. Oficjalne kryteria znajdują się na stronie reguły.

Strony w naszym spisie działają nieprawidłowo nie z winy przeglądarek, lecz z winy webmasterów, którzy popełnili błędy i jak osły uparcie ich nie poprawiają.

Znaczenie “jedynie słusznej” nie oznacza, że wyszydzamy IE, bo mamy taki kaprys, więc:

… wy­szydzanego przez Osiołkowców Explo­rera, a ponieważ wyszydzanie Explorera jest b.modne, ma to nieprzychylnie nastawić do mnie Czytelników („huzia na tego który chwali Explorera”).

Powyższe zdanie nie ma kompletnego sensu, bo wystarczy przeczytać jeden lub dwa artykuły na temat korzystania i działania Internet Explorera (nawet z przed trzech lat), aby zrozumieć, że dla własnego bezpieczeństwa należałoby podjąć jakieś kroki ku temu, aby nie narażać siebie i innych na nieprzyjemności.

A przecież jedyne co popełniłem poza Lekcjami to następujące stwierdzenie (2005, email do Osioł­kowców): „Argumentujecie głupotami i filozofia Waszej dzia­łalności jest zasadniczo błędna” (nb pod­trzymuję to w pełni – właśnie Lekcje miały to uwypuklić).

Tu przyznam Panu rację, ale w odniesieniu do Pana przypadku. Działalność serwisu oraz jego skuteczność (prawie 80% stron zgłoszonych do nas zostaje poprawiona) jest jak najbardziej pożądana. A wykręty typu Pana lekcji lub stwierdzenia, że to twórcy przeglądarek powinni się podporządkować i pozwolić na samowolkę w tworzeniu WWW zrobiłyby wiele krzywdy, nie tylko Panu, ale wszystkim dookoła. Także twierdzenie, że:

A jednak nie przeczytał albo nie pomyślał ! (niepotrzebne skreślić). Przecież jest oczywiste (patrz Lekcja 11), że ta poprawka zabrałaby lekko licząc kilka dni – skóra nie warta wyprawki (dla mnie). No i że nie jest to kwestia mojej wiedzy, lecz woli (mojej).

Jakaś poprawka nie jest warta wdrążenia, bo webmasterowi, tfu… wróć -> twórcy tej strony nie jest potrzebna, to tylko znaczy, że nie ma szacunku on do swoich użytkowników. Świadomie ich naraża, bo tak chce, choć jak zostało napisane w jednym z komentarzy do Osiołka Piker:

Autor używa Microsoft Word do generowania stron :(
Poleciliśmy HTML Tidy, który by to (i inne rzeczy) poprawił automatycznie.

Chwilę wcześniej, w Lekcji 13, jest stwierdzenie:

Teraz Ptaszor przepisuje wszystkie moje Lekcje (b.słusznie, bo ułatwi to Czytelnikom percepcję Jego komentarzy), jednak nie komentuje poszczególnych lekcji, zadowalając się następującym kilkuzda­niowym komentarzem sumarycznym:…

A co tu komentować?! Wszystko jest jasne jak słońce i tu nadal się dziwię, że uważa Pan zasadę działania Internetu i wszystkie rzeczy z nim związane jak partyjkę brydża, gdzie może Pan się wyłamać i mieć własne zdanie. Nie, to nie ta dziedzina! W Internecie trzeba przestrzegać pewnych reguł czy schematów (ogólnie zwanymi standardami) i nie jest w stanie zmienić tego jedna osoba.

Upsss… zapomniałem, że on pisze w MS Word – przecież ten edytor wymiata.

Na koniec powiem tylko: Buahahahahahhahaha…

To ostatnie zdania „komentarza”. Nie wiem co tu znaczy „wymiata” (chyba jakiś slang szczeniacki).

Nie wiem też co znaczy Buahahahahahhahaha… Ostatni ryk barana?…

Hmm… myślę, że bardzo dobrze Pan wie, co oznacza “wymiata” – tylko chciał Pan pokazać, że mój post jest to jakiś gówniarski bełkot poprzez dodanie słowa “szczeniacki”. A to, czy tak jest, było widać po komentarzach umieszczonych pod poprzednim postem. Czy te wszystkie osoby nazwałby Pan także szczeniakami, bo uważają, że mam rację?

Powracając do używanego przez Pana edytora – to polecam darmowy edytor NVU, który nie dość, że pozwoli Panu na prawie identyczną budowę strony, to jeszcze stworzy do niej poprawny kod, nie tylko pod Explorera.

I kto tu się skompromitował? A sądziłem że moje Lekcje będą zrozumiałe dla wszystkich !

No właśnie, kto? Bo ja nie próbuje na siłę Panu wbić swoich poglądów na temat, w którym Pan jest konikiem. To Pan próbuje walczyć z tymi, co wiedzą sporo w dziedzinie, o której Pan nie ma bladego pojęcia.

Dobrze przynajmniej, że Ptaszor przyznał samokrytycznie, iż mózg ludzki jest ograniczony.

Chciałbym zauważyć, że moja krytyka dotyczyła Pana Lekcji, nie moich!

Dalsza część Pana lekcji to dosłownie szukanie dziury w całym! Lol… Ucięcie lekcji to nie żaden spisek; doszukiwanie się konspiracji w komentarzach także nie ma sensu. A szukanie zastępczego tematu to raczej nie powód, aby tylko coś odpisać! Żadnych konkretnych, mających sens argumentów! Czy nie lepiej przyznać się do błędu i dla siebie samego odpalić ten nieszczęsny HTML Tidy i cieszyć się większą popularnością własnej strony?

Z mojej strony to tyle w tym dość dziwnym i zarazem śmiesznym temacie… :)

BTW: O przydatności Osiołków w Sieci pisałem już nieraz, ale warto przypomnieć, czego ten serwis już dokonał!

12 lekcji logiki dla Osiołkowców – śmiać się czy płakać? :P

Dziś przeglądając jeden z komentarzy do opublikowanych Osiołków natrafiłem na odnośnik do jednej ze stron, która krytykuje działanie serwisu Osiolki.net oraz pokazuje wyższość Explorera na Firefoksem i Operą. Dodatkowo autor daje 12 lekcji i pokazuje jak ludzki mózg może być ograniczony :) . Zapraszam na stronę http://www.pikier.com/lekcje.htm, która zawiera mądrości szalonego webmastera, autora osiołków (http://osiolki.net/osiolek/pikier, http://osiolki.net/osiolek/czytaj), który zamiast przeczytania choćby najgłupszego kursu HTML-a, postanowił wysnuć swoje własne przemyślenia na ten temat tworzenia stron WWW. Jedziemy! :)

Wszystkie wysnute przemyślenia naszego bohatera zostały zebrane i pisane przez długi okres czasu. Na zdrowy rozum są przemyślane i bohater ten powinien być w pełni świadomy tego co pisze i wiedzieć jak bardzo się tym textem ośmieszył.

lekcje1_4.png

Chciałem wyjaśnić, że wolałem porobić zrzuty oryginalnej treści, bo zaawansowany wygląd tej witryny mnie przerósł, a chciałbym, jej przekaz pokazać w bardzo obiektywny sposób. Lol!

lekcje5_8.png

lekcje9_10.png

lekcje11_12.png

Ostatnią lekcję uciąłem. Ale za to postanowiłem zajrzeć w jej źródło. Zostałem oczarowany stopniem skomplikowania kodu, dla tak zaawansowanej szaty graficznej. Oto i zrzut:

zrodlo.png

Mógłbym się odnieść do wszystkich bardzo złożonych uwag tego Pana, ale nie ma sensu. Po prostu komedia jak ludzie mogą być ograniczeni i niedoinformowani. Paradoksem jest też to, że pomimo poprawek wyłożonych na tacy – Pan ten ma takie zaufanie do własnej wiedzy, że woli się skompromitować, niż poświęcić kilka chwil na wprowadzenie poprawki. Upsss… zapomniałem, że on pisze w MS Word – przecież ten edytor wymiata. Na koniec powiem tylko: Buahahahahahhahaha…

Panie Łukaszu proszę następnym razem chwilę zastanowić się, zanim Pan da kolejną lekcję!

Edycja obrazków – online (20 edytorów online)

W ramach rozwijającego się Internetu dostajemy co raz to więcej fajnych i przydatnych narzędzi dostępnych za darmo i online. Wiele z tych narzędzi swoim poziomem dorównuje znanym i drogim programom do edycji obrazków. Znalazłem kilka przydatnych takich narzędzi i myślę, że też skorzystacie :) :

  1. Picnik – edytor obrazków online POLECAM!
    picnik.png
  2. Picture2Life – edytor obrazków online POLECAM!
    picture2life
  3. Preloadr – oparty o API Flickra edytor obrazków POLECAM!
  4. Snipshot – edytor obrazków online POLECAM!
  5. PXN8 – edytor obrazków online POLECAM!
  6. Fauxto – edytor obrazków online POLECAM!
  7. http://www.creatingonline.com/Online_Image_Editor/index.php
  8. http://www.pic2color.com/
  9. http://pixer.us/
  10. http://www.quickthumbnail.com/
  11. http://www.cellsea.com/java-cellsea/media/index.htm
  12. http://www.myimager.com/
  13. http://www.onlinephototool.com/
  14. http://mypictr.com/
  15. http://www.thewpthemes.com/?p=55
  16. http://fotoeditor.pl/ POLECAM!
  17. http://www.forteelectric.com/FreePhotoEditor.html
  18. http://www.cellsea.com/java-cellsea/media/index.htm
  19. http://www.gifworks.com/
  20. http://xmgimage.com/

Z powyżej znalezionych sześć pierwszych ma dość obszerny zestaw funkcji. Jeśli znacie jakieś jeszcze edytory obrazków online – dajcie znać – uzupełni się listę :) .

Osiolki.net – już ponad 800 stron poprawionych

Tak, kolejna rocznicowa liczba wybiła na liczniku poprawionych Osiołków w serwisie Osiolki.net. Fakt, trochę czasu upłynęło, zanim się udało poprawić kolejne 50 osiołków od ostatniego wpisu, ale ważne, że do przodu :) . Szczególnie należy się cieszyć, że jest jak jest, gdyż w zespole Osiołków – powiedzmy – panują ciche dni :P . Co nie znaczy, że w serwisie nic się nie dzieje. Działamy, działamy…

osiolki_800_poprawionych.png

W sumie “te” poprawione Osiołki już dawno były poprawione, tylko widniały na czarnej liście Osiołków. Z braku czasu zespół po publikacji nie wraca do zgłoszenia, chyba że Wy – użytkownicy odwiedzający serwis Osiolki.net – zgłosicie nam, że już strona została poprawiona. Wtedy sprawdzamy poprawioną stronę i od tego, czy została poprawiona, czy nie, zależy los osiołka na czarnej liście. W nagrodę za poprawę (pomimo publikacji) Osiołek taki jest przenoszony na widoczną listę stron poprawionych. Dodatkowo od tego momentu nie jest ta strona indeksowana w Google jako Osiołek.

Lepiej: Przy okazji chciałbym podziękować adasiowi za przeprowadzenie akcji wspomagającej serwis Osiolki.net. Dzięki jego pracy włożonej w sprawdzenie kilkudziesięciu umieszczonych na liście Osłów – przekroczyliśmy kolejny magiczny próg. Oby więcej osób niezwiązanych z zespołem chciało tak z nami współpracować. Dzięki wykonanej pracy adasia wiele stron zostało przeniesionych do kategorii stron poprawionych, nabijając nam licznik odniesionych sukcesów.

adas_pomoc_osiolkom.jpg

To niewyobrażalne, że już 800 stron zostało poprawionych przy udziale zespołu Osiolki.net. Niestety, czasem przypomina to walkę z wiatrakami, bo ciągle jeszcze są osoby tworzące potworki, buble i niedziałające strony. Jest to efekt braku dobrego przygotowania webmastera, a co za tym idzie – brak dobrych materiałów jasno omawiających proces nauki tworzenia stron.
Można jednak powiedzieć, że problem nie jest już zauważany przez wąskie grono specjalistów, lecz zaczęto głośno mówić o promocji standardów sieciowych. Miejmy nadzieję, że z czasem będę mógł napisać, że mamy Sieć wolną od potworków.