Projektowanie witryn » projektowanie http://www.tworzenie-stron-www.eu Tworzenie stron w oparciu o popularne języki programowania Tue, 08 Mar 2011 10:18:45 +0000 http://wordpress.org/?v=2.8 en hourly 1 Flash – płynne przejścia między zdjęciami http://www.tworzenie-stron-www.eu/2009/10/flash-plynne-przejscia-miedzy-zdjeciami/ http://www.tworzenie-stron-www.eu/2009/10/flash-plynne-przejscia-miedzy-zdjeciami/#comments Mon, 19 Oct 2009 13:32:24 +0000 admin http://www.tworzenie-stron-www.eu/?p=29 Zaczynamy od wczytania pierwszego zdjęcia na warstwie pierwszej (layer 1). Następnie klikamy prawym przyciskiem myszki na pierwszej klatce w/w warstwy i zaznaczamy “create motion tween”. Ustawiamy się następnie na klatce 50 i wciskamy F6, następnie na klatce 60 i znów F6.
Teraz tworzymy nową warstwę (layer 2) i wczytujemy na niej drugie zdjęcie. Projektowanie stron www jest jak widać zajęciem mało absorbującym, jednak wymagającym nabrania nieco wprawy i doświadczenia. Następnie przeciągamy klatke ze zdjęciem na klatkę numer 50. Klikamy prawym i wybieramy “create motion tween”. Następnie ustawiamy się na klatce 60 tej samej warstwy (layer 2) i klikamy F6. To samo robimy na klatce 110.

Mamy tym samym dwie warstwy z dwoma zdjęciami, musimy dodać teraz przejście między zdjęciami. Pierwszemu zdjęciu na warstwie pierwsze w klatce 60 ustawiamy przezroczystość alpha 0%, natomiast zdjęciu drugiemu w klatce 50 też alpha 0%. Tym sposobem zdjęcie pierwsze będzie znikać w tym samym czasie gdy zdjęcie drugie będzie się pojawiać. Powstanie w ten sposób efekt płynnego przejścia. Aby był on płynniejszy możemy przyśpieszyć ilość klatek na sekunde np. do 30. (ustawienia dokumentu). Dalsza część kursu już wkrótce! Zapraszamy do czytania pozostałych artykółów w blogu, co umili oczekiwanie na kolejne części tutoriala!

A w między czasie zapraszam do przeczytania krótkiego tutoriala dotyczącego instalacji Lightboxa :)

1. Pierwszy krok to pobranie skryptu ze strony autora: http://www.huddletogether.com/projects/lightbox2/ oraz wgranie go na serwer w miejsce gdzie znajdują się pliki naszego serwisu.

2. Następnie w headzie strony umieścić należy link do pliku css oraz do skryptu:

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

<script src=”js/prototype.js” type=”text/javascript”></script>

<script src=”js/scriptaculous.js?load=effects,builder” type=”text/javascript”></script>

<script src=”js/lightbox.js” type=”text/javascript”></script>

3. Ostatnio etap to dołożenie rel=”lightbox” do linku do obrazka tak aby wyglądał on w ten sposób:

<a rel=”lightbox” href=”images/image-1.jpg”></a>

Więcej informacji na temat projektowania stron www w oparciu o dodatki JavaScript, znajdziesz także na blogu projektowanie-stron-www.eu .

]]> http://www.tworzenie-stron-www.eu/2009/10/flash-plynne-przejscia-miedzy-zdjeciami/feed/ 1 Tworzenie stron WWW w oparciu o język HTML http://www.tworzenie-stron-www.eu/2009/07/tworzenie-stron-www-w-oparciu-o-jezyk-html/ http://www.tworzenie-stron-www.eu/2009/07/tworzenie-stron-www-w-oparciu-o-jezyk-html/#comments Mon, 06 Jul 2009 14:10:38 +0000 admin http://www.tworzenie-stron-www.eu/?p=3 Do projektowania stron internetowych wykorzystuje się przede wszystkim język HTML, którego podstawy zaprezentuję w dzisiejszym artykule. Swoją pierwszą stronę WWW możesz wykonać np. w Notatniku. Kiedy zapiszesz jej rozszerzenie jako *.HTML, strona będzie dostępna do uruchomienia nawet z pulipitu.

Aby zaprojektować stronę internetową musisz poznać przede wszystkim strukturę jej kodu, który najprościej mówiąc wygląda następująco:

<HTML>
<BODY>
</BODY>
</HTML>

To co widzimy wyżej to najprosztsza strona WWW, która po zapisaniu działa, ale nie wyświetla niczego, ponieważ jeszcze niczego jej nie podyktowaliśmy. Spróbujemy więc wpisać następujący kod:

<HTML>
<BODY>
To jest tekst tej strony.
</BODY>
</HTML>

Po zapisaniu i uruchomieniu naszej strony, widzimy, że na ekranie pojawia się tekst “To jest tekst tej strony”. Tak więc wiemy już, że informacja zawarta w części BODY pojawia się na ekranie. Poznajmy więc pierwszą komendę HTML, która umożliwia pogrubienie tekstu. Komenda ta to <B> jak Bold. Jeżeli umieścimy jakiś tekst pomiędzy <B> a </B>, to tekst ten będzie pogrubiony:

<HTML>
<BODY>
<B>To jest tekst tej strony.</b>
</BODY>
</HTML>

W efekcie na ekranie zobaczymy: To jest tekst tej strony. Spróbujmy teraz zmienić kolor czcionki. W tym celu używamy polecenia <FONT COLOR=RED>, gdzie RED to nazwa koloru czerwonego po angielsku. Możemy ją zmieniać na dowolną inną typu BLUE, PINK czy GREEN. Podobnie jak pogrubienie czcionki, kolor również musimy zamknąć czyli użyć na końcu </FONT>. Wygląda to w ten sposób:

<HTML>
<BODY>
<FONT COLOR=RED>To jest tekst tej strony.</FONT>
</BODY>
</HTML>

Otrzymujemy: To jest tekst tej strony. Łatwe prawda? Komendy możemy oczywiście łączyć:

<HTML>
<BODY>
<FONT COLOR=BLUE><B>To jest tekst tej strony.</B></FONT>
</BODY>
</HTML>

W tym momencie na ekranie otrzymamy: To jest tekst tej strony.

Jak widać projektowanie stron WWW nie jest niczym trudnym. Trzeba jedynie opanować podstawowe komeny języka HTML i już można tworzyć barwne witryny internetowe. Do tego odrobina znajomości programów graficznych i strony nabierają profesjonalnego kształtu.

]]> http://www.tworzenie-stron-www.eu/2009/07/tworzenie-stron-www-w-oparciu-o-jezyk-html/feed/ 0