Portal Główne technologie webowe Tajemnice przeglądarek stron www Edytory stron www Programy graficzne i do animacji Narzędzia dla developerów Walidator W3C Sieciowe statystyki Testowanie witryny online
Główne technologie webowe XHTML HTML5 V2.0 zerwała z wsteczną kompatybilnością Kompatybilny ze starszymi wersjami HTML Problematyczny dla webdeveloperów Posiada luźniejszą formę, zmierzał do hiperpoprawności dopuszcza niewielkie pomyłki Nie wszystkie przeglądarki obsługują Wszystkie przeglądarki obsługują
Główne technologie webowe CLIENT-SIDE – nazwa języków skryptowych obsługiwanych po stronie klienta (internauty) czyli przeglądarki JavaScript (nie mylić z Javą) – wspomaga tworzenie interaktywnych stron Dart – kandydat Google
Główne technologie webowe RIA (Rich Internet Applications) – nazwa języków skryptowych obsługiwanych po stronie klienta (internauty) czyli przeglądarki, umożliwia tworzenie profesjonalnych stron z wykorzystaniem zaawansowanych animacji ActionScript (Flash): witryna widoczna w taki sam sposób we wszystkich przeglądarkach To film umieszczony w kodzie html Niezbędna wtyczka Flash Player Strony flashowe indeksują się słabiej w wyszukiwarkach Nie działa przycisk Wstecz w przeglądarkach Technologia darmowa ale drogie IDE Silverlight – konkurencja dla Flash’a
Główne technologie webowe SERVER-SIDE – oprogramowanie do tworzenia sklepów, portali dzięki wbudowanej współpracy z bazami danych i pracy na niezależnym od użytkownika środowisku - serwerze ASP, ASP.NET – platformy firmy Microsoft umożliwiające tworzenie dynamicznych witryn w językach programowania takich jak: VBScript PHP – książę open source Ruby z frameworkiem on Rails Python z frameworkiem Django Perl
Główne technologie webowe BAZY DANYCH – relacyjne bazy danych umożliwiają tworzenie dynamicznych portali i stron www MySQL PostgreSQL SQLite Oracle
Przeglądarki Przeglądarka – program tłumaczący zapis strony napisanej w HTML, CSS, PHP na wygląd „zrozumiały” dla internauty Mozilla Firefox Google Chrome Internet Explorer Opera Software Safari Apple
Przeglądarki Google Chrome szybko, łatwo, minimalistycznie i bezpiecznie Silnik WebKit Chrome Web Store – kilka tysięcy rozszerzeń Cicha aktualizacja do nowej wersji PWN2Own (brak luk?) Świetna obsługa standardów (www.html5test.com) Współpraca z Adobe – najnowsza v. flasha
Przeglądarki Mozilla Firefox Silnik Gecko W 90% inwestowana przez Google Przerwała monopol IE Mnóstwo dodatków Świetnie obsługuje standardy sieciowe Szybkie wprowadzanie nowości CSS i HTML5 Przeszła test Acid2 Pierwsza posiadła „tryb prywatny” Obsługa technologii W3C Izolacja wtyczek od głównego procesu programu Obsługa WebGL i WebM World Wide Web Consortium, w skrócie W3C, to organizacja, która zajmuje się ustanawianiem standardów pisania i przesyłu stron WWW Acid2 to test opracowany przez organizację Web Standards Project (WaSP), który ma pomóc przeglądarkom internetowym w spełnieniu standardów internetowych wyznaczanych przez organizację W3C. Główny nacisk w tym teście został postawiony na poprawność interpretowania stylów CSS (odpowiadających za wygląd i zachowanie strony), a także: języka oznaczeń HTML, przezroczystości obrazków PNG i osadzania obrazków w kodzie strony poprzez Data URL. WebGL jest rozszerzeniem możliwości języka JavaScript, zapewniającym dostęp do trójwymiarowego API w przeglądarce internetowej. Interfejs programowania aplikacji (ang. Application Programming Interface, API) – sposób, rozumiany jako ściśle określony zestaw reguł i ich opisów, w jaki programy komunikują się między sobą. API definiuje się na poziomie kodu źródłowego dla takich składników oprogramowania jak np. aplikacje, biblioteki czy system operacyjny. Zadaniem API jest dostarczenie odpowiednich specyfikacji podprogramów, struktur danych, klas obiektów i wymaganych protokołów komunikacyjnych. WebM – format wideo powstały z inicjatywy Google, przeznaczony do zastosowań internetowych, wydany 19 maja 2010[1]. Specyfikacja przewiduje stosowanie go na stronach WWW z wykorzystaniem znacznika video (HTML 5). Format WebM opiera się na kodeku wideo On2 VP8, kodeku dźwięku Vorbis i uproszczonym kontenerze Matroška.
Przeglądarki Internet Explorer Największe utrapienie projektantów stron www Brak cichej aktualizacji Silnik Trident Wolne i niecałkowite wprowadzanie obsługi CSS IE9 – MS Vista i 7 (a XP?!!) IE10 – MS 8 Nie obsługuje XHTML (dekada pracy W3C na marne?!) tylko HTML
Przeglądarki Opera Skandynawska przeglądarka pracuje na wszystkich znanych platformach Silnik Presto Popularna na urządzeniach mobilnych (Opera Mini) Cicha aktualizacja, wygodny interfejs, obsługa standardów Poza Europą środkową i wschodnią jest egzotyczna jak Safari w Linuksie
Przeglądarki Safari Głownie na MAC’ach Wersja mobilna na iPhone’ach i iPadach Silnik KHTML Znakomita obsługa standardów Brak cichej aktualizacji Przeszła Acid2 spr. zgodność z zaleceniami W3C 100% w Acid3
Pluginy RIA reprezentuje: Flash Player WebM i MP4 – formaty wideo Silverlight (Microsoft) QiuckTime (Apple) Java
Edytor Cechy: Kolorowanie i podpowiadanie składni Wsparcie dla najważniejszych języków frontendowych : HTML, XSLT, CSS, JavaScript, ActionScript Wsparcie dla technologii serwerowych: PHP, JSP, VBScript, ASP Wbudowany klient FTP W ogólnym rozumieniu terminy front-end i back-end odnoszą się do początkowego oraz końcowego stadium pewnego procesu. Z reguły przedstawia to sytuacja gdzie front-end jest odpowiedzialny za pobieranie danych od użytkownika oraz przekazanie ich do back-endu.
Edytory płatne Adobe Dreamweawer – wchodzi w skład Creative Suite przeznaczonego dla grafików FrontPage a od wersji MS Office 2007 Publisher phpDesigner Pajączek Wiele innych …
Edytory darmowe KED Core Editor Geany Notepad ++ I wiele innych …
Grafika rastrowa Adobe Photoshop Gimp GimpShop
Grafika wektorowa Adobe Illustrator Corel Draw
Creative Suite Photoshop, Fireworks, Flash, Illustrator 6 tys. zł Studenci mają 90% zniżki i mogą korzystać w komercyjnych projektach (uczelnia musi brać udział w programie Adobe)
Testowanie Internet Explorer Platform Preview - http://www.my-debugbar.com/wiki/IETester/HomePage www.html5test.com Walidator w Firefox - https://addons.mozilla.org/pl/firefox/addon/html-validator/ Obsługa CSS3: http://css3test.com www.html5test.com The HTML5 test score is an indication of how well your browser supports the upcoming HTML5 standard and related specifications.
Testowanie Walidacja – sprawdzenie kodu pod względem zgodności ze standardami Walidator – narzędzia diagnostyczne do wykrywania pomyłek w kodzie strony www.validator.w3.org www.jigsaw.w3.org/css-validator
Statystyki sieciowe www.ranking.pl www.alexa.com
Dodatki Narzędzia dla webmasterów w firefox’ie https://addons.mozilla.org/pl/firefox/extensions/web-development/ Firebug - www.getfirebug.com Web developer toolbar - https://addons.mozilla.org/pl/firefox/addon/web-developer/