Google Page Creator

Opłacało się podać swojego mejla i czekać. Właśnie otrzymałem informację, że moje konto zostało aktywowane i mogę zacząć zabawę. Proszę Państwa, oto pierwsze wrażenia z pracy z Google Page Creator, w wersji BETA oczywiście :)

O co chodzi?

Google Page Creator to nic innego jak graficzny edytor stron (tzw. WYSIWYG – What You See Is What You Get). Co go jednak wyróżnia od innych klikadełek znanych nam od lat? Ano to, że nie jest typową aplikacją instalowaną w naszym systemie, tylko jest obsługiwany przez przeglądarkę internetową. Całość, podobnie jak coraz więcej usług Google (np. GMail czy Google Reader) jest zbudowana w oparciu o technologię AJAX. I czerpie z jej możliwości pełnymi garściami.

Zaczynamy zabawę w webmastera

Po zalogowaniu się do naszego konta widzimy listę już utworzonych podstron oraz link do stworzenia kolejnej (rysunek 1). Po prawej stronie mamy listę uploadowanych na serwer plików (o tym będzie więcej później). Zacznijmy więc tworzenie naszej pierwszej strony!

Układ strony

Klikamy na link „Create new page”, wpisujemy jej tytuł i widzimy nasz edytor. Po lewej stronie kilka opcji formatowania tekstu, a w części głównej obszar roboczy. Domyślny szablonik posiada wyszczególnione części, takie jak „nagłówek”, „podtytuł”, „treść główna” i „stopka”. Układ tych elementów możemy zmienić wybierając opcję „Change Layout” (rysunek 2). Do wyboru mamy klasyczne layouty – nagłowek + jeden blok contentu albo np. tzw. „holy grail” czyli zestaw nagłówek + menu po lewej + content.

Gotowe szablony

Nie zauważyłem nigdzie opcji edycji kodu HTML, więc mniemam, że można stosować tylko dostarczone szablony. Jest ich trochę (rysunek 3). Nie są może jakieś nadzwyczajnie wyszukane, ale pamiętajmy, że z takich narzędzi korzystają zwykle początkujący użytkownicy, a dla nich jakikolwiek szablon jest na wagę złota. Klikamy sobie więc pierwszy z brzegu i zaczynamy tworzyć nasz „website” :)

Formatowanie tekstu

Do dyspozycji mamy podstawowe funkcje formatowania tekstu – wyrównanie do lewej/środka/prawej (rysunek 4), stworzenie listy nieuporządkowanej (dla zwykłych śmiertelników: takiej wypunktowanej), zmianę koloru (rysunek 5) i wielkości tekstu czy kroju czcionki (rysunek 6). Możemy też formatować dany tekst jako nagłówek jednego z trzech stopni. Zasadniczo wszystko to, co oferuje nam na ten przykład windowsowy Wordpad.

Wstawianie obrazków

Mamy też możliwość wrzucania obrazków na stronę. Klikamy sobie w link „Image” i mamy do wyboru albo hotlinkowanie do jakiegoś obrazka w sieci, albo wstawienie jakiegoś obrazka z naszego dysku, który zostanie uploadowany na serwer (rysunek 7). Dzięki AJAX-owi grafika jest też momentalnie prezentowana w formie miniaturki.

Następnie możemy naszą wstawioną grafikę dowolnie przemieszczać w obrębie obszaru roboczego. W trakcie przeciągania pojawia się mała półprzezroczysta miniaturka, która pokazuje nam jak będzie się prezentować dany obrazek po przeniesieniu (rysunek 8). Oczywiście tekst jest w czasie rzeczywistym dostosowywany do położenia zdjęcia.

Najważniejsza rzecz WWW – linki

Podstawą World Wide Web są linki pomiędzy stronami. Możemy je tworzyć poprzez kliknięcie na przycisk „Link”. Otworzy nam się okienko (rysunek 9) z możliwością wyboru elementu docelowego:

• jakaś inna strona internetowa (a na dole jeszcze tekst „First, find the page on the web that you want to link to. (A search engine might be useful).” – gdzie „search engine” to oczywiście link do Google.com :) Banalny, acz genialny zabieg marketingowy. Jak to ostatnio ktoś napisał na pl.comp.www – „Myślisz piwo, mówisz Żywiec. Myślisz wyszukiwarka, mówisz Google” :) – dokładnie o to chodzi)
• adres email
• jeden z naszych plików uploadowanych na serwer
• jedna z wcześniej utworzonych podstron

Wszystko banalnie proste – wpisujemy opis linku, wybieramy element docelowy z listy (w przypadku plików lub naszych podstron) albo wpisujemy adres internetowy i klikamy OK, a system sam wygeneruje cały kod.

Publikujemy swoje dzieło w Internecie!

Wpisaliśmy sobie jakiś tekst, wrzuciliśmy obrazki i zrobiliśmy linki, więc klikamy na przycisk „Publish” i dostajemy link do naszej strony. Na ten przykład http://tomasz.topa.googlepages.com/ :) Gratulacje, właśnie opublikowałeś swoją pierwszą stronę internetową!

Hosting w prezencie

Kilkukrotnie wspominałem, że można uploadować swoje pliki na serwer. Proszę Państwa, Google daje nam aż 100 MB przestrzeni na dodatkowe elementy do naszych stron! Bez ani jednej doklejonej reklamy! Mam przypominać, że nasze rodzime portale typu Wirtualna Polska (Webpark) czy Onet (Republika) szarpią się na raptem 9mb przestrzeni, okupując to wszędobylskimi i cholernie wkurzającymi reklamami? Ale ja i tak preferuje wykupiony hosting w AVX.pl :)

Małe rzeczy, a cieszą

Są takie malusie szczegóły, które ułatwiają pracę z programem. Choćby takie automatyczne zapisywanie naszej pracy co minutę. Gdy przypadkiem klikniesz na jakiś link, zamknie Ci się przeglądarka czy będziesz miał zwis systemu, stracisz co najwyżej efekt ostatnich 59 sekund pracy, a nie na przykład ostatniej godziny.

Podobnie przydatne są wspomniane wcześniej miniaturki plików graficznych podczas ich wybierania w menu wstawiania obrazków – nie zawsze zapisujemy pliki pod opisowymi nazwami, a dzięki podglądowi od razu widzimy co wstawiamy.

Trochę marudzenia, czyli wygenerowany kod

No cóż, Google Page Creator jest niestety tylko edytorem graficznym i pięknego kodu nigdy nam nie wygeneruje. Chociaż muszę powiedzieć szczerze, że i tak mnie bardzo pozytywnie zaskoczył. Powiem szczerze, że niektóre elementy są nawet całkiem przyzwoicie wygenerowane i przewyższają nawet (poprawka po dokładniejszej analizie kodu) jednak utrzymują zbliżony :) poziom produkcji prezentowanych przez Marcina w kategorii „Hateemelowe dziwadełka” :)

Tu nie ma tabelek!

Pierwszą rzeczą, która mnie ogromnie zadziwiła po spojrzeniu w kod, to całkowity brak tabelek. Proszę proszę, samo Google, którego strona główna aż prosi się o przerobienie, zaczęło dostrzegać tabless layouts i deklaruje deklaruje XHTML 1.0 Strict. Layouty faktycznie są budowane w oparciu o box-model i style CSS, ale jednak trąci tam sporym divitilis i… archaizmami.

No to w końcu używamy CSS czy nie?

Nie rozumiem jednego: przy wyrównywaniu paragrafów do prawej czy środka użyto konstrukcji <p style=”text-align: right;”>, natomiast kolor czy rozmiar czcionki już jest ustalany przez archaiczne <font size=”2″ color=”#00ff00″>. Takich kwiatków validator znalazł więcej.

CSS w kodzie strony

Szablony również można by było przerobić tak, żeby style były określane w zewnętrznym pliku .css. Definicje stylów zawierają sporo komentarzy i przeróżnych hacków, gdybyśmy chcieli przy pomocy tego generatorka stworzyć jakiś większy serwis, to zaowocowałoby sporym wzrostem prędkości ładowania stron (cache’owanie pliku .css)

Podsumowując

Jak na głupie klikadełko do robienia „pierwszych stron internetowych”, to działa to wszystko całkiem fajnie. A biorąc pod uwagę technologię w jakiej został stworzony, działa nawet bardzo fajnie. I generuje o wiele czystszy kod niż FrontPage ;) Dodatkowe 100MB na pliki z pewnością też jest ważnym „fjuczerem”. Ciekaw jestem jak to będzie rozwijane.

Ale i tak wolę klepać swój kod HTML ręcznie :)

Wpis opublikowany 18 marca 2006
Tagi: ciekawostki, everything, google, hosting, pagecreator, webmaster, xhtml
Kategorie: Bez kategorii

Komentarze do wpisu "Google Page Creator"