logo - Kurs HTML i CSS
- HTML dla zielonych / Jak zrobić dobrą stronę HTML
...ma nic godnego uwagi, możesz opuścić to miejsce". Większość dobrych stron w Internecie zbudowana jest następująco: na górze znajduje się banner lub logo serwisu, po lewej lub po prawej - menu, a obok - treść strony. Nie znaczy to, że musisz koniecznie podporządkować się takiemu kanonowi, lecz jeżeli chcesz uzyskać podobną strukturę, we właściwej treści strony (BODY) wpisz np.: <header style="text-align: center">Tutaj można umieścić logo serwisu</header> <nav style="width: 300px; float: left...
- Oprawa graficzna / Zamiennik obrazkowy
...im odpowiada. Problem w tym, że w ten sposób nie uda Ci się podmienić statycznie wstawionych obrazków, tworzących szablon graficzny - np. logo i inne elementy. W szczególności nie stworzysz szybko ładującej się skórki, pozbawionej zbędnych elementów graficznych. Coraz więcej użytkowników przegląda sieć za pomocą urządzeń mobilnych (smartfony, tablety). Dzięki obsłudze różnorodnych typów mediów, bez dużego wysiłku można przygotować specjalne wersje serwisu, które będą wygodniejsze...
- HTML5 / Główna treść <main>
...elektronicznymi. Z racji na naturę hipertekstu w każdym serwisie WWW możemy wyznaczyć menu nawigacyjne, nagłówek witryny zwykle z osadzonym logo, stopkę zawierającą np. informacje o prawach autorskich. Wszystkie te elementy niezwykle ułatwiają przeglądanie witryny. Jednak użytkownicy odwiedzają stronę przede wszystkim nie po to, żeby oglądać menu czy logo. Głównym celem jest dotarcie do treści, która jest zawarta w serwisie. Taka treść może ginąć w natłoku wszystkich elementów...
- Ikony (symbole) / Typowe akcje
...more_time Dash Flutter flutter_dash flutter_dash Kopia zapasowa backup backup Zapisz jako save_as save_as Logo aplikacji głównej home_app_logo home_app_logo Podgląd strony pageview pageview Dostępność accessibility accessibility Alarm włączony alarm_on alarm_on Dynamiczny kanał dynamic_feed dynamic_feed Etykieta ważna label_important label_important Zatwierdzenie approval approval Kalendarz kontaktów permanentnych perm_contact_calendar perm_contact_calendar Stopa kwadratowa...
- Szablon strony na DIV-ach / Semantyczny szablon strony
...w celu wypełniania szablonu przykładową treścią. Przygotowując własny szablon, wstaw tam odpowiednio: Nagłówek szablonu Można tutaj umieścić logo witryny. W nagłówku często wstawia się dodatkowo powtórzone poziome menu, zawierające najważniejsze i najczęściej używane odnośniki serwisu. Alternatywnie takie menu można umieścić w osobnym bloku poniżej bloku nagłówkowego. Menu nawigacyjne Kolumna zawierająca pionowe menu. Dodatkowe informacje Druga wąska kolumna, którą można wykorzystać...
- Dobre praktyki / CSS Zorientowane Obiektowo
...Kompozycja Zwróćmy uwagę, że typowy artykuł może zawierać informacje o: autorze - np. z jego imieniem, nazwiskiem i zdjęciem źródle - nazwa, logo i odnośnik Każdy z tych elementów można traktować jako osobny obiekt (zmiana wyglądu informacji o autorze nie powinna wpływać na wygląd samej treści artykułu), z których składa się (ang. composition) główny obiekt artykułu. Myślenie o skomplikowanym obiekcie jako o złożeniu kilku mniejszych, samodzielnych obiektów, ułatwia nam pojmowanie...
- Dobre praktyki / Przykazania webmastera
...klik, a przy tym zmiana układu strony, co może zdezorientować użytkownika. Natomiast dobrym zwyczajem jest podlinkowanie na każdej podstronie logo serwisu (które powinno się znajdować w nagłówku), tak aby kliknięcie prowadziło na stronę główną witryny. Większość popularnych serwisów internetowych stosuję tę technikę, a więc wielu użytkowników jest już do niej przyzwyczajonych. Menu powinno odzwierciedlać hierarchię kategorii, podkategorii itd. W przypadku rozbudowanych witryn zwykle...
- Promocja strony WWW / Bannery i buttony
...czy buttonem z wieloma serwisami to nie wszystko. Aby zachęcić użytkowników do klikania w banner, należy go odpowiednio przygotować. Samo statyczne logo serwisu to bardzo zły pomysł. Wskazane jest tutaj używanie animacji, jaskrawych kolorów, które od razu zwracają uwagę oraz napisów zachęcających do klikania. Nie należy jednak z tym przesadzać, ponieważ możemy paść ofiarą zjawiska tzw. ślepoty bannerowej (ang. banner blindness), polegającego na tym, że internauci podświadomie zaczynają...
- HTML5 / Nagłówek <header>
...sekcji (H1, H2, H3, H4, H5, H6 albo HGROUP), ale nie jest to absolutnie konieczne. Może zawierać również: spis treści, formularz wyszukiwania, logo. Sam element HEADER nie stanowi nagłówka sekcji. Może to być nieco mylące, ponieważ z kolei element FOOTER stanowi stopkę sekcji. Elementami definiującymi nagłówek sekcji są: H1, H2, H3, H4, H5, H6. W szczególności znacznik HEADER nie tworzy nowej sekcji w dokumencie (zobacz: "Sekcje / Nagłówki sekcji" w rozdziale "Nowe elementy HTML5")...

