Aktywnymi elementami stron internetowych są. Podstawowe elementy strony internetowej

Większość treści w Internecie to strony internetowe. Historycznie jest to pierwszy typ dokumentów przeznaczonych do umieszczenia w wirtualnej przestrzeni sieciowej, ale zachował swoją aktualność do dziś i praktycznie nie ma konkurencyjnych formatów. Jaka jest struktura stron internetowych? Jakie narzędzia programistyczne są używane do ich tworzenia?

Co to jest strona internetowa?

„Wymień główne elementy strony internetowej” - mówi nam egzaminator podczas lekcji informatyki. Co możemy mu w zamian powiedzieć? Przede wszystkim porozmawiajmy o tym, czym w zasadzie jest strona internetowa.

Zgodnie z ogólnie przyjętą definicją wśród informatyków, jest to dokument przeznaczony do otwarcia w wyspecjalizowanym programie - przeglądarce, który zawiera dane do wyświetlenia na ekranie komputera przy użyciu odpowiedniego typu oprogramowania o różnych przydatnych treściach - tekstach, linkach, grafice, filmach, muzyce i itd. Strona internetowa to dokument tekstowy. Dane istotne dla przeglądarki to litery, cyfry i symbole specjalneużywany jako elementy języka znaczników - HTML. To za jego pomocą twórca strony internetowej „wyjaśnia” przeglądarce, jak wyświetlić tę lub inną treść na ekranie.

Miejsce i rola stron internetowych w strukturze serwisów

Czy powiedziałbyś, że strona internetowa jest głównym składnikiem witryny internetowej? To częściowo prawda. Jednak, jak zauważyliśmy powyżej, strona internetowa to tylko dokument tekstowy. Witryna z reguły zawiera również zdjęcia, filmy i inne elementy multimedialne. Strona internetowa nie może ich zawierać, ale w swojej strukturze może zawierać linki do nich. Tak więc stronę internetową można nazwać głównym komponentem serwisu ze względu na dominującą rolę w wyświetlaniu użytkownikom treści wirtualnych.

Oczywiście w rzadkich przypadkach omawiany dokument będzie jedynym składnikiem strony - jeśli z jakiegoś powodu nie przewiduje wyświetlania grafiki, wideo i innych elementów multimedialnych. W szczególności najwcześniejsze witryny - kiedy po raz pierwszy pojawiły się języki znaczników dla stron internetowych - nie zawierały odpowiedniej treści. Przed oczami użytkownika był tylko tekst i linki.

Zasada używania hipertekstu

Tak więc strona internetowa to dokument napisany w języku HTML, za pomocą którego przeprowadzane są znaczniki hipertekstowe. Ale co to za zjawisko? Co to jest hipertekst? Nie zagłębiając się w teorię, zauważamy, że jest to tekst, który w taki czy inny sposób umożliwia szybki dostęp do innego - poprzez linki. W zwykłej książce jest to niemożliwe - jest „zwykły tekst”. Aby uzyskać dostęp do żądanej strony, czytelnik musi wykonać kilka przewrotów, zanim przeczyta treść lub przypisy. W trybie „hipertekstu” główna część pracy wykonywana jest przez komputer - kosztem informacji odzwierciedlonych w elementach HTML strony.

Jeśli nauczyciel informatyki powie nam: „Wymień główne elementy strony internetowej”, możemy całkiem poprawnie rozpocząć opisywanie składników odpowiedniego dokumentu, które są tworzone przy użyciu języka znaczników HTML. Dlatego na początek spójrzmy na kilka teoretycznych punktów dotyczących HTML.

Struktura HTML: tagi

W jaki sposób przeglądarka odczytuje żądane dane o stronie internetowej z dokumentu HTML? Bardzo prosty.

Głównymi elementami tego języka są tagi. W większości przypadków są sparowane - jest jeden otwierający i zamykający. Te pierwsze są oznaczone tylko nawiasami ostrymi. Drugie są podobne, ale przed drugim nawiasem znajduje się ukośnik - znak /. Przeglądarka jest w stanie je rozpoznać, a tym samym bez problemu wyświetla zawartość stron internetowych zgodnie z algorytmami stworzonymi przez twórcę dokumentu.

Tag otwierający jest zwykle zapisywany dużymi literami, a tag zamykający małymi literami. To standard, który utrwalił się wśród specjalistów IT. Przeglądarka z pewnością rozpozna polecenie HTML w każdej literze, ale deweloperzy stron internetowych są zachęcani do trzymania się oznaczonego schematu tagowania. Ułatwi to na przykład innym profesjonalistom modyfikowanie strony internetowej.

Atrybuty

Innymi istotnymi elementami języka HTML są atrybuty. Za ich pomocą twórca strony internetowej może ustawić właściwości treści - np. Wysokość czcionki, jej kolor, położenie względem strony. To samo dotyczy zdjęć, filmów i innych elementów multimedialnych. Atrybuty są zapisywane w otwierającym tagu.

Zadowolony

Pomiędzy tagami otwierającymi i zamykającymi znajduje się kolejny kluczowy element strony internetowej - treść. To jest w rzeczywistości ta sama treść, która powinna być wyświetlana przed użytkownikiem na ekranie. Może to być tekst, link, zdjęcie, wideo lub inny element multimedialny.

Elementy stron internetowych

„Na koniec wymień główne elementy strony internetowej!” - powtarza nauczyciel. „Z przyjemnością” - odpowiadamy mu. Co zawiera struktura tego typu dokumentów? Umówmy się, że rozważymy ten aspekt w kontekście elementów HTML strony internetowej. Czyli ich wyświetlenie w przeglądarce - to, co widzi użytkownik na ekranie - będzie nas interesować w mniejszym stopniu. Chodzi o to, że odpowiadające im algorytmy HTML, na podstawie których program wyświetla treść w ten sam sposób, mogą się różnić. I to jest szczególna cecha języka HTML: można wyświetlić żądany obraz na stronie internetowej różne sposoby... Jednocześnie mogą one być zarówno równoważne pod względem kosztów pracy twórcy strony internetowej, jak i zakładać inny nakład pracy i czasu na ich realizację.

Elementy strony internetowej: nagłówek

Standardowych elementów strony internetowej, choć może się to wydawać zaskakujące, jest bardzo niewiele. W rzeczywistości są tylko dwa z nich - tytuł i główna treść dokumentu. Jednocześnie każdy z nich może mieć dość złożoną strukturę.

Jaka jest specyfika tytułu? Znajduje się na samej górze strony internetowej. W kodzie HTML, który generuje nagłówek, z reguły tylko tekst ma być „zaszyfrowany”, ale w razie potrzeby w odpowiednim elemencie można również umieścić małe wstawki graficzne. I to właściwie wszystko, co można powiedzieć o tytule. Wydawałoby się, że jego rola w strukturze odpowiedniego dokumentu jest znikoma. Ale tak nie jest. Tytuły stron internetowych są bardzo ważne z punktu widzenia indeksowania witryn w formacie wyszukiwarki - Yandex, Google. Ten przedmiot musi być w pełni adekwatna do treści strony internetowej, jak również do specyfiki tematycznej serwisu.

W jaki sposób tytuł strony internetowej jest przechwytywany za pomocą HTML? Bardzo prosty. Najpierw zapisywany jest tag otwierający, który zawsze wygląda jak HEAD z nawiasami ostrymi, następnie treść nagłówka, a na końcu tag zamykający. Są one oczywiście napisane na samej górze dokumentu internetowego.

Tytuł dokumentu internetowego może zawierać szereg dodatkowych elementów. Czasami format strony sieci Web może wymagać wyświetlania tekstu w określonym kodowaniu. W jaki sposób zapewniacie, że dokument internetowy spełnia to kryterium? Bardzo prosty. Struktura nagłówka dokumentu powinna zawierać algorytmy HTML, które instruują przeglądarkę, aby używała określonego kodowania języka - na przykład cyrylicy. Odpowiednie polecenia są umieszczone w tagu META, który, podobnie jak inne, jest otwierany i zamykany.

Główna treść strony internetowej

Główna część dokumentu internetowego jest otwierana za pomocą tagu BODY i zamykana odpowiednim elementem, który zawiera ukośnik. W takim przypadku między tagiem otwierającym i zamykającym może znajdować się wielka ilość dodatkowe polecenia języka znaczników hipertekstowych. Wynika to z faktu, że główna część strony zawiera przydatne treści - teksty, linki, grafiki, filmy, różne formularze do wypełnienia.

Każdy z odpowiednich typów treści ma własne tagi. Struktura głównej części dokumentu internetowego może zawierać polecenia HTML, za pomocą których jest również przeprowadzane formatowanie tekstu - na przykład nadanie czcionce określonego koloru, rozmiaru i innych właściwości.

Przyjrzyjmy się szczegółom niektórych powszechnie używanych tagów HTML. W rzeczywistości stanowią one również główne elementy strony internetowej.

Podstawowe tagi HTML

Aby więc bardziej szczegółowo zbadać, czym są elementy strony internetowej, przyjrzyjmy się bardziej szczegółowo istocie podstawowych tagów HTML. Niektóre z nich przytoczyliśmy już powyżej - w szczególności te, za pomocą których przeglądarka odczytuje nagłówki stron internetowych i ustala, gdzie znajduje się główna część dokumentu.

Znacznik P. jest dość powszechny i, podobnie jak inne podobne elementy języka znaczników hipertekstowych, może otwierać i zamykać. Ten znacznik umożliwia sformatowanie pojedynczego akapitu dokumentu. Możesz na przykład ustawić dla niej określony typ lub kolor czcionki. Odbywa się to jednak za pomocą dodatkowego tagu - FONT. Jednocześnie zostanie umieszczony wewnątrz tego, który oznacza granice akapitu - zapobiegnie to rozprzestrzenianiu się polecenia HTML odzwierciedlającego typ preferowanej czcionki na inne elementy strony internetowej.

Tabele są tworzone za pomocą tagu TABLE. Korzystając z odpowiednich atrybutów, możesz określić wymaganą liczbę kolumn i wierszy, ustawić ich szerokość, specyfikę krawędzi, rozmiar i kolor czcionki tekstu w tabeli.

Odpowiada za przetwarzanie zdjęć przez przeglądarkę. Pozwala również na umieszczanie różnych atrybutów, które regulują rozmiar obrazu, jego pozycję na stronie.

Linki do innych dokumentów lub plików w sieci są oznaczone za pomocą znacznika A. Zazwyczaj zawiera atrybuty wskazujące na fakt, że w strukturze strony internetowej znajduje się hiperłącze. W takim przypadku wskazany jest dokument, plik lub strona, do której prowadzi.

Typowym tagiem jest FRAMESET. Można go wykorzystać do podzielenia przestrzeni strony internetowej na kilka obszarów - ramek. W każdym z nich możesz na osobnych dokumentach internetowych. Oznacza to, że ramki umożliwiają poprawne ułożenie dwóch lub więcej stron na jednym ekranie w tym samym czasie.

Opowieść o kluczowych elementach stron internetowych i późniejsza opowieść o sposobach ich formatowania za pomocą HTML - coś w rodzaju algorytmu naszej odpowiedzi na zadane nam przez egzaminatora pytanie. Gdyby zwrócił się do nas, mówiąc „wymień główne elementy strony internetowej”, to my, stosując odpowiednią metodologię, będziemy mieli wszelkie szanse ujawnienia tematu. Oznacza to, że pod pojęciem „elementy” rozumiemy kluczowe składniki struktury dokumentu internetowego, czyli typy treści - tekst, obrazki, tabele, ramki, linki, które webmaster tworzy za pomocą takiego narzędzia jak HTML.

Specyfika narzędzi do tworzenia stron internetowych

Oprócz powyższego możemy wyjaśnić, że istnieje ogromna liczba tagów i atrybutów udostępnianych przez standardy HTML. Oprócz HTML programiści stron internetowych mogą używać dodatkowe fundusze formatowanie dokumentów hipertekstowych. Na przykład z przy użyciu JavaScript można tworzyć dynamiczne strony WWW - czyli takie, w których zawartość jest na bieżąco aktualizowana (zarówno dzięki działaniom samego użytkownika, jak i zgodnie z algorytmami zapisanymi wcześniej w skryptach).

Przydałoby się dodać, że web developer może w swojej pracy wykorzystywać pełnoprawne języki programowania, takie jak na przykład Perl, PHP, Java, Python, za pomocą których możliwości pracy z dokumentami hipertekstowymi stają się jeszcze szersze. Potrzeba tego może wynikać z faktu, że obszary zastosowań technologii internetowych są obecnie bardzo różne. Wyzwania stojące przed dzisiejszymi programistami mogą być zniechęcające. Na przykład czasami wymagane jest przetłumaczenie stron internetowych napisanych w języku rosyjskim na angielski. W takim przypadku zestaw narzędzi programisty będzie bardzo zróżnicowany.

Elementy strony internetowej

Każda strona internetowa zawiera określony zestaw standardowych elementów, które są wymagane jako składniki każdego zasobu internetowego. Oczywiście asortyment i liczba takich obiektów może się różnić w zależności od tematyki strony, ilości publikowanych na niej materiałów, a także celów i zadań twórcy tego zasobu. Rozmieszczenie takich elementów, projektowanie ich wzajemnego rozmieszczenia to jedno z głównych zadań webmastera.

Pierwszym elementem strony internetowej, któremu przyjrzymy się, jest jej tytuł. Może być wykonany zarówno w formie tekstowej, jak i graficznej, jednak w każdym przypadku powinien znajdować się na górze dokumentu. Czasami menu do wyboru kodowania cyrylicy i przyciski do przełączania z wersji rosyjskojęzycznej strony na anglojęzyczną są połączone z tytułem, jeśli ten zasób sieciowy jest prezentowany w dwóch językach. Bezpośrednio podtytuł dokumentu jest z reguły miejscem przeznaczonym na umieszczenie banera reklamowego. W większości przypadków umieszczenie banera u góry strony internetowej jest warunek wstępny rejestracja strony internetowej w usługach wymiany banerów - systemy, które reklamują utworzony przez Ciebie zasób w zamian za wyświetlanie reklam innych członków sieci wymiany banerów na Twoich stronach internetowych. Standardowy rozmiar banery publikowane pod tytułem dokumentu mają zazwyczaj rozmiar 468x60 pikseli. Jeśli używasz statycznego układu strony, szerokość nagłówka dokumentu będzie wynosić około 640 pikseli, głównie ze względu na konieczność zapewnienia prawidłowego wyświetlania dokumentu na monitorach o rozdzielczości ekranu 640x480 pikseli oraz uniknięcie pojawienia się poziomego paska przewijania, który utrudnia przeglądanie. Oczywiście szerokość banera w tym przypadku będzie znacznie mniejsza niż szerokość nagłówka, dzięki czemu w części strony, na której planujesz przeznaczyć miejsce na reklamę, powstanie nieprzydzielona przestrzeń, którą można wypełnić logo firmy będącej właścicielem tej strony lub linkiem do serwera implementującego sieć hosting. Oczywiście logo nie zawsze jest konieczne: z reguły jest umieszczane na stronie internetowej tylko wtedy, gdy witryna ma charakter komercyjny.

Główną część dokumentu zajmuje tzw. Pole tekstowe - obszar, w którym znajduje się treść semantyczna strony: tekst informacyjny oraz ilustracje. Wymienione elementy są również nazywane treściami (z języka angielskiego treść - treść). Umiejscowienie pola tekstowego zależy przede wszystkim od tego, jak projektant stron internetowych umieści pozostałą część dokumentu.

Kolejną obowiązkową częścią strony internetowej są elementy nawigacyjne - hiperłącza, które prowadzą ten dokument z innymi sekcjami witryny. Elementy nawigacyjne mogą być wykonywane jako ciągi tekstowe, obiekty graficzneczyli przyciski lub aktywne komponenty, na przykład Aplety Java. Te ostatnie to te same przyciski, które w przeciwieństwie do swoich tradycyjnych sióstr potrafią reagować na ruchy myszy, wykonując kilka prostych czynności w momencie, gdy najeżdża na nie kursor (włączanie podświetlenia, tworzenie efektu naciśnięcia, zmiana kształtu itp.). Jak już wspomniałem w dziale Podstawowe "postulaty" projektowania stron internetowych, elementy nawigacyjne powinny być rozmieszczone w taki sposób, aby były zawsze w zasięgu wzroku, czyli tak, aby użytkownik nie musiał przewijać strony, jeśli pole tekstowe jest kilka ekrany fizyczne, po których szukanie linków do innych sekcji zajmuje dużo czasu. Najpopularniejszym podejściem jest umieszczanie elementów nawigacyjnych w lewej części strony.

U dołu dokumentu zwykle publikuje się informacje o twórcach witryny oraz adres e-mail, pod którym odwiedzający zasób mogą wysyłać swoje odpowiedzi, sugestie i życzenia właścicielom strony. Jeśli strona internetowa jest dokumentem początkowym, na dole umieszczany jest również licznik trafień - mały skrypt, który wywołuje zainstalowany na serwerze skrypt CGI, który rejestruje każde otwarcie dokumentu w przeglądarce użytkownika poprzez zmianę wartości wskaźnika licznika. Dzięki temu webmaster może łatwo określić liczbę odwiedzających, którzy odwiedzili jego stronę w dowolnym czasie. Zwróć uwagę, że licznik trafień jest ustawiany tylko na pierwszej stronie, która jest wywoływana podczas uzyskiwania dostępu do witryny; nie ma go w pozostałych dokumentach zasobów. Nie zaleca się również umieszczania kilku różnych liczników na jednej stronie.

Dlatego przeanalizowaliśmy wszystkie główne komponenty strony internetowej i ich możliwą lokalizację względem siebie.

W praktyce często spotyka się witryny internetowe, których elementy nawigacyjne są umieszczone wzdłuż prawej krawędzi ekranu. W tym przypadku pole tekstowe zostaje przesunięte w lewo, pozostałe elementy dokumentu ułożone są w oparciu o zasadę maksymalnej estetyki ich zestawienia.

Jak widać na rysunku, logo w tym przypadku znajduje się na tym samym poziomie, co tytuł dokumentu, a baner reklamowy jest umieszczony względem środka strony. Przy takim podejściu zaleca się zachowanie szaty graficznej tytułu, logo i pola reklamowego w tej samej kolorystyce i stylu artystycznym - wówczas asymetria położenia tych obiektów nie będzie tak oczywista i nie będzie wycinać oczu zwolenników surowej, tabelarycznej estetyki projektowania.

Elementy nawigacyjne można umieszczać nie tylko w pobliżu prawej i lewej krawędzi strony, ale także u góry dokumentu. Ta opcja układu jest moim zdaniem najbardziej odpowiednia przy tworzeniu stron domowych: w tym przypadku wszystkie obiekty strony harmonijnie pasują do określonej szerokości. niewidoczny stół, podczas gdy samo przygotowanie stołu jest znacznie uproszczone. Jedyną wadą tego podejścia jest konieczność powielania elementów nawigacyjnych u dołu dokumentu, ponieważ podczas przewijania strony w pionie znikają one poza górną część ekranu i aby się do nich dostać, użytkownik będzie musiał przewinąć ekran do tyłu, co, jak widzisz, jest bardzo niewygodne.

Oczywiście wszystko, co zostało powiedziane w tej sekcji, nie jest panaceum, ale wskazówką do działania. Próbuję tylko stwierdzić ogólne zasady, które są używane w układzie struktury serwisu, ostateczna decyzja zawsze należy do webmastera. Ostatecznie, bez względu na to, jaki projekt umieścisz jako podstawę swojego przyszłego projektu, wynik Twojej pracy będzie nadal poprawny: nie ma cenzury w Internecie ani żadnych przepisów, które zmuszają twórcę witryny do przyjęcia takich lub innych sztywnych ram. Przykładem rozwiązania projektowego, które nie mieści się w żadnej z powyższych kategorii, jest tzw. Układ mieszany.

Jak widać na rysunku, w tym przykładzie niektóre elementy sterujące są wbudowane bezpośrednio w tytuł strony - mówimy o przyciskach do przełączania między rosyjską i angielską wersją strony, a także o przyciskach nawigacyjnych: może to być link do adresu e-mail twórców zasobów, powielony u dołu dokument i łącze do jednej z sekcji tematycznych, na przykład strony z wiadomościami. Główny blok elementów nawigacyjnych jest umieszczony względem lewej krawędzi dokumentu, jednak menu wyboru kodowania cyrylicy znajduje się bezpośrednio pod banerem reklamowym u góry strony. Pole tekstowe podzielone jest na dwie asymetryczne kolumny, a prawa zawiera krótkie zapowiedzi tematycznych nagłówków tworzących zasób, w tym linki do tych sekcji.

Oczywiście w przypadku mieszanego układu strony internetowej może istnieć wiele różnych opcji: konkretne decyzje zależą od liczby sekcji, które składają się na zasób, ilości tekstu przygotowanego do umieszczenia w serwisie, a wreszcie od wyobraźni samego projektanta. Ważne jest tylko, aby wygląd strony nie powodował reklamacji ze strony odwiedzających. W końcu tylko Ty jako programista, Ty i nikt inny, masz prawo pokazać wszystkie swoje umiejętności i talenty oraz zbudować stronę według własnych upodobań. Twórcy niektórych stron domowych, nie dręcząc się wątpliwościami, umieszczają licznik odwiedzin w prawym górnym rogu dokumentu, piszą małą, drobnym drukiem nazwę strony i publikują pod banerem reklamowym, az jakiegoś powodu elementy nawigacji pojawiają się niespodziewanie w samym środku bloku tekstowego, między opowieścią o sobie a zdjęcia ukochanego psa autora projektu. Pod względem smaku i koloru, jak mówią, nie ma towarzyszy. Ale dla mnie osobiście ta choroba wydaje się nieuleczalna.

Wszyscy przeczytaliśmy ogromną liczbę artykułów na temat tego, jak wybrać słowa kluczowe i poprawnie skomponować ich listę, jak używać słów kluczowych, aby stworzyć stronę internetową, która będzie odpowiednia dla określonych zapytań. Przyjrzyjmy się bliżej kwestii rozmieszczenia słów kluczowych na stronach internetowych.

Wiedza o tym, gdzie i jak umieścić słowa kluczowe na stronie internetowej, decyduje o sukcesie lub niepowodzeniu kampanii SEO.

Każda strona internetowa ma 5 elementów, w których można umieścić słowa kluczowe:

1. Tytuł strony (tag tytułu)
2. Słowa kluczowe na stronie (słowa kluczowe z metatagami)
3. Opis strony (metatag opisu)
4. Alternatywny tekst do zdjęć (tag Alt)
5. Zawartość strony internetowej (tag body)

Ze wszystkich powyższych elementów strony internetowej najważniejsza jest zawartość strony (punkt 5). Więcej o tym później.

Na razie weźmy tę listę w kolejności.

Element numer 1. Tytuł strony (tag tytułu)

Najpierw spójrzmy na tytuł strony (tag tytułu). Ten element jest pierwszym i najważniejszym ze wszystkich pozostałych elementów bloku nagłówkowego dowolnej strony internetowej.

Tytuł strony internetowej można zobaczyć w górnej linii przeglądarki internetowej. Aby to sprawdzić, uruchom dowolną przeglądarkę, na przykład Internet Explorer, Opera lub Mozilla Firefoxprzejdź do dowolnej witryny i porównaj zawartość znacznika tytułu z samą górną linią w tych przeglądarkach. Wyszukiwarki wykorzystują ten tag do własnych celów - do zbierania informacji o serwisie i określania jego tematu, a także wykorzystywania go w wynikach wyszukiwania (SERP) jako nazwy strony internetowej.

Zapamiętaj! Tytuł strony internetowej to ona krótki opis.

Oprócz powyższego, zawartość znacznika tytułu jest używana jako tytuł strony internetowej po dodaniu jej do Ulubionych przeglądarki internetowej.

Element numer 2. Słowa kluczowe na stronie (słowa kluczowe z metatagami)

Porozmawiajmy teraz o słowach kluczowych i metatagach opisu. Jakiś czas temu przy dodawaniu witryny do indeksu wyszukiwarek używano słów kluczowych z metatagami. Ale te dni się skończyły. Teraz wyszukiwarki po prostu ignorują ten tag, ponieważ są częste przypadki jego użycia do celów „brudnych”. Niektóre wyszukiwarki zwracają uwagę na ten tag, aby określić temat witryny.

Z wszystkiego, co zostało powiedziane, wynika, że \u200b\u200bten tag jest opcjonalny, ale można go używać wyłącznie do bezpośredniego celu.

Oddziel słowa kluczowe przecinkami. Umieść najważniejsze słowa kluczowe na górze listy, a następnie w malejącej kolejności według ważności. Wyszukiwarki przestały zwracać uwagę na przypadek, w którym wpisywane są słowa kluczowe, więc teraz wszystkie słowa kluczowe można wpisywać małymi literami.

Element numer 3. Opis strony (metatag opisu)

Metatag opisu to kolejny element witryny, w którym należy umieścić słowa kluczowe. Wyszukiwarki skanują ten tag pod kątem obecności w nim słów kluczowych, a także porównują jego zawartość z treścią samej witryny (zawartość tagu body). Bardzo ważne jest również, aby wyszukiwarki wykorzystywały zawartość tagu description jako opis strony internetowej w wynikach wyszukiwania (SERP).

Ten tag powinien zawierać krótki opis strony internetowej, ale nie więcej niż 50 słów.

Element numer 4. Alternatywny tekst do zdjęć (tag Alt)

Tagi Alt to tekstowy opis zawartości obrazu, tj. jeśli z jakiegoś powodu obraz nie jest załadowany, a ten obraz ma tekst alternatywny, to ten tekst zostanie wyświetlony zamiast obrazu.

Jeśli obraz jest załadowany, a obraz ma również tekst alternatywny, możemy to zobaczyć, najeżdżając kursorem myszy na obraz. Znaczniki Alt są używane dla wygody tych użytkowników Internetu, którzy z jakiegoś powodu nie wyświetlają grafiki.

Wiele wyszukiwarek indeksuje zawartość tego tagu, więc może on zawierać słowa kluczowe. Tylko nie zapominaj, że tekst alternatywny powinien odpowiadać obrazowi, opisywać go, być jego odpowiednikiem tekstowym. Nie używaj tagów alt do oznaczania obrazów, takich jak linie podziału, punktory ...

Element numer 5. Zawartość strony internetowej (tag body)

W końcu dotarliśmy więc do najbardziej podstawowego elementu serwisu - body tag, czyli elementu, którego treść interesuje internautów. Główne wyszukiwarki nie będą już dawać 1 SERP tylko z powodu obecności wielu powtórzeń słowa kluczowego na Twojej stronie internetowej. Pojawi się tam tylko ta strona internetowa, która jest najbardziej odpowiednia dla określonego zapytania.

W tym celu należy osadzić wybrane słowa kluczowe w kodzie stron internetowych, zwracając uwagę na częstotliwość ich powtarzania się. Postępuj w następujący sposób: dla każdej strony wybierz 1-2 słowa kluczowe i zoptymalizuj dla nich odpowiednią stronę.

Wyobraź sobie, że przygotowujesz prezentację dla swojej nowej strony internetowej lub produktu. Na przykład slajdy prezentacji PowerPoint są akapitami. Powinny być krótkie i jasne. Podobnie jak w prezentacjach PowerPoint, możesz użyć list do wyszczególnienia zalet witryny lub produktu, za każdym razem koncentrując się na wybranych słowach kluczowych.

Włącz wybrane słowa kluczowe do powyższych 5 elementów każdej strony internetowej, a poprawisz swoje aktualne pozycje i wyniki w kolejności.

Język HTML

Strony internetowe mogą istnieć w dowolnym formacie, ale przyjęty standard Hyper Text Markup Language jest hipertekstowym językiem znaczników zaprojektowanym do tworzenia bogatego tekstu bogatego w obrazy, dźwięk, animacje, klipy wideo i łącza hipertekstowe do innych dokumentów, rozproszone w całej sieci. przestrzeń i znajduje się na tym samym serwerze lub istocie część tego samego projektu internetowego.

W sieci można pracować bez znajomości języka HTML, ponieważ teksty HTML mogą być tworzone przez różne specjalne edytory i konwertery. Ale pisanie bezpośrednio do HTML nie jest trudne. Może to być nawet łatwiejsze niż nauka edytora lub konwertera HTML, który często ma ograniczone możliwości, zawiera błędy lub przekazuje zły kod HTML, który nie działa na różnych platformach.

HTML istnieje w kilku odmianach i nadal ewoluuje, ale konstrukcje HTML prawdopodobnie zostaną użyte w przyszłości. Nauka języka HTML i jego głębsze poznanie, tworzenie dokumentu na początku nauka HTML a rozszerzając ją tak bardzo, jak to możliwe, jesteśmy w stanie tworzyć strony internetowe, które mogą być przeglądane przez wielu przeglądarki internetowezarówno teraz, jak iw przyszłości. Nie wyklucza to możliwości zastosowania innych metod, takich jak metoda rozszerzonych możliwości udostępniana przez Netscape Navigator, Internet Explorer lub inny program.

Praca w HTML to sposób na poznanie specyfiki tworzenia dokumentów w znormalizowanym języku, przy użyciu rozszerzeń tylko wtedy, gdy naprawdę tego potrzebujesz.

HTML został zatwierdzony przez Konsorcjum World Wide Web. Jest obsługiwany przez kilka popularnych przeglądarek i prawdopodobnie stanie się podstawą prawie każdego oprogramowania związanego z Internetem.

Zasady tworzenia strony internetowej, główne elementy strony internetowej

Do tworzenia stron WWW używany jest specjalny język HTML (HyperText Markup Language - hipertekstowy język znaczników). Ten język definiuje zestaw specjalnych poleceń zwanych znacznikami, które służą do ustawiania formatowania lub przeznaczenia niektórych elementów strony internetowej. Do umieszczania na stronach internetowych używane są specjalne znaczniki obrazy graficzne, klipy audio i wideo oraz inne tak zwane obiekty osadzone.

Strony internetowe są zwyczajne pliki tekstoweutworzone w standardowym Notatniku lub podobnym prostym edytorze tekstu. I zawierają tekst, ten sam tekst, który chcesz umieścić na stronach, tylko zaznaczony w specjalny sposób. Aby różne przeglądarki internetowe poprawnie wyświetlały tę samą stronę internetową, HTML musi być znormalizowany.

W praktyce na standard HTML duży wpływ ma obecność tagów proponowanych i obsługiwanych przez najbardziej znane przeglądarki, takie jak Microsoft Internet Explorer i Google Chrom. Te tagi w ten moment może, ale nie musi, być częścią aktualnej specyfikacji HTML.

Istnieją narzędzia do edycji zaprojektowane specjalnie do pisania HTML. Oszczędzają czas, ponieważ zawierają klucze szybki dostęp do wykonywania powtarzalnych operacji, takich jak określanie ustawień początkowych dokumentów, tabel lub po prostu stosowanie stylów do tekstu. Edytory HTML różnią się od autorskiego zestawu narzędzi WYSIWYG tym, że wymagają znajomości zasad ręcznej kompilacji HTML, a redaktorzy tylko upraszczają i przyspieszają ten proces. Jak również tagi HTMLznormalizowane przez WWWC (standardowe tagi), przeglądarki internetowe obsługują wiele niestandardowych tagów. Tagi te zostały wprowadzone przez twórców konkretnego programu przeglądarki internetowej, aby uzyskać przewagę nad konkurentami. Mieli nadzieję, że te zastrzeżone rozszerzenia staną się później standardem HTML, ale te nadzieje nigdy się nie spełniły. Jednak znaczniki pozostają i są nadal obsługiwane.

Do tworzenia stron internetowych będziesz potrzebować dowolnej przeglądarki - Internet Explorer lub Google Chrome Mozilla Firefox lub lepiej obu, ponieważ wiele elementów HTML jest wyświetlanych inaczej w różne programy oglądania i bardzo pożądane jest kontrolowanie tej różnicy.

Ponadto potrzebujesz dowolnego edytora tekstu, na przykład dla przygotowanie HTML - pliki, a przeglądarka - do przeglądania i kontrolowania tego, co zostało zrobione.

Aby utworzyć stronę internetową, pierwszym krokiem jest utworzenie struktury serwisu. Witryna to serwer o unikalnej nazwie i stałym adresie, fizycznie połączony z WWW lub wirtualnie zlokalizowany na innym, większym serwerze.

Po utworzeniu struktury serwisu uruchom edytor tekstu Słowo, stwórz nowy dokument i zapisz go jako stronę internetową, a następnie zacznij tworzyć stronę internetową. To sprawia, że \u200b\u200bnasza praca jest łatwiejsza i lepsza. W nim określamy czas powstania serwisu WWW, jego debugowanie, tematykę, a także wypełnienie.

Istnieje kilka prostych zasad, które pozwalają na zrozumienie interfejsu serwisu przez odwiedzającego [# 10].

1. Strona nie powinna zawierać zbędnych informacji, czcionka powinna być czytelna. Elementy graficzne musiały być czytelne, wyraziste i szybko się ładowały.

2. Oko ludzkie skanuje strony serwisu od góry do dołu. Fokus znajduje się w lewym górnym rogu strony. Dlatego z reguły na górze strony serwisu ważna informacja: nazwa firmy, logo, nazwa strony itp.

3. Gość serwisu powinien łatwo znaleźć interesujące go informacje i mieć możliwość uzyskania wyczerpujących informacji (opis w formie tekstu plus kilka zdjęć).

4. Informacje należy podzielić na grupy. Możliwe jest zapewnienie możliwości wyszukiwania produktów według nazwy i opisu.

5. Serwis musi posiadać sekcje informacyjne:

z danymi o firmie (zakres działalności, adres, kontaktowe numery telefonów itp.);

Podstawowe elementy stron internetowych:

1. Nagłówek / logo (czapka)

3. Treść / Treść (pole tekstowe)

4. Elementy nawigacyjne

5. Informacje o twórcach serwisu

Każda strona internetowa zawiera określony zestaw standardowych elementów, które są wymagane jako składniki każdego zasobu internetowego.

Pierwszym elementem strony internetowej, któremu przyjrzymy się, jest jej tytuł. Logo lub nazwa witryny pełni taką samą rolę jak znak przy wejściu do dowolnej instytucji. Inną sprawą jest Internet: tutaj główną metodą poruszania się jest teleportacja, dlatego muszę widzieć ten „znak” na każdej stronie.

Główną część dokumentu zajmuje tzw. Pole tekstowe - obszar, w którym znajduje się treść semantyczna strony: tekst informacyjny i ilustracje.

Wymienione elementy są również nazywane „Treścią” (z języka angielskiego zawartość - Treść). Umiejscowienie pola tekstowego zależy głównie od tego, jak projektant sieci Web umieści resztę dokumentu.

Rysunek 1. Przykładowa zawartość witryny

Kolejną obowiązkową częścią strony są elementy nawigacyjne - hiperłącza łączące ten dokument z innymi sekcjami serwisu. Elementy nawigacyjne mogą mieć postać ciągów tekstowych, obiektów graficznych czyli przycisków lub aktywnych komponentów, takich jak aplety Java.

U dołu dokumentu zwykle publikuje się informacje o twórcach witryny i adres e-mail, pod którym odwiedzający zasób mogą wysyłać swoje odpowiedzi, sugestie i życzenia właścicielom strony. (rys. 2)

Rysunek 2. Informacje kontaktowe

Zanim zaczniesz tworzyć swoją witrynę, podejdź bardzo odpowiedzialnie do problemu układu elementów strony. Ogólnie strona internetowa jest podzielona na zawartość strony, nawigację i powiązane informacje. Te elementy z kolei są podzielone na mniejsze elementy.

W rezultacie sekwencja działań związanych z tworzeniem witryny sieci Web jest ograniczona do następującego prostego algorytmu:

1. Wyznaczanie celów i definiowanie celów kluczowych.

2. Stworzenie listy przyszłych działów tematycznych.

3. Opracowanie logicznej i fizycznej struktury zasobu.

4. Przygotowanie szkicu projektowego, układu strony, niewidocznej tabeli układu.

5. Przygotowanie materiałów tekstowych.

6. Przygotowanie materiałów graficznych w postaci wektorowej.

7. Eksport obrazów wektorowych do formatu rastrowego.

8. Optymalizacja wszystkich obrazów.

9. Tworzenie szablonów stron internetowych.

10. Twórz strony internetowe i debuguj kod.

11. Sprawdzanie tożsamości wyświetlania stron internetowych z różnymi rozdzielczościami i kolorami ekranu oraz różnymi przeglądarkami.

PODSTAWY PROJEKTOWANIA STRON INTERNETOWYCH

Podstawy projektowania stron internetowych

Historia rozwoju Internetu. Pojawienie się Internetu na Białorusi. Projektowanie stron. Historia pochodzenia. Wymagania dotyczące projektu witryny zgodnie ze standardami W3C. Główne przeglądarki. Struktura serwisu, opisy i tagi.

Internet ( język angielski Internet, sieci połączone - sieci połączone) - ogromny śieć komputerowaskładający się z wielu mniejszych sieci połączonych ze sobą i obejmujących cały świat.

Historia Internetu rozpoczęła się w połowie ubiegłego wieku: w 1957 rok w Stanach Zjednoczonych utworzono Advanced Development Agency (ARPA), która zajmowała się rozwojem wojskowym.

W 1989 roku Tim Berners-Lee stworzył HTML.

W 1961r Agencja Zaawansowanych Badań Obronnych (DARPA), na zlecenie Departamentu Obrony Stanów Zjednoczonych, rozpoczęła projekt stworzenia eksperymentalnej sieci transmisji pakietów. Ta sieć o nazwie ARPANET, pierwotnie miał na celu zbadanie metod zapewniania niezawodnej komunikacji między komputerami różnych typów.

W styczniu 1969 Na kilka minut uruchomiono system, który połączył cztery komputery w różnych częściach Stanów Zjednoczonych. Miało to miejsce za pośrednictwem wolnej linii telefonicznej.

W 1973 Był to pierwszy rok, w którym komputery z różnych krajów „komunikowały się” przez Arpanet. Sieć stała się międzynarodowa.

Rozwój sieci przebiegał w szybkim tempie. W 1987 r. Liczba hostów przekroczyła 10 000. W 1988 r. Do NSFNET dołączyły Kanada, Islandia, Dania, Norwegia, Francja, Finlandia i Szwecja. W 1989 r. Liczba hostów przekroczyła 100 000. Do sieci dołączyły Wielka Brytania, Japonia, Niemcy, Austria, Izrael, Włochy, Meksyk, Nowa Zelandia i Holandia. Rosja dołączyła do SIECI w 1990 roku. Białoruś także na początku lat 90.

Liczba podłączonych użytkowników zaczęła rosnąć w szybkim tempie każdego roku. W 1995 Sieć stała się największym, najbardziej dynamicznym i dostępnym medium masowej komunikacji.

Projektowanie stron. Historia pochodzenia.

Projektowanie stron internetowych (z angielskiego web design) to projekt wizualny stron internetowych. Odgrywa tę samą rolę w witrynie internetowej, co projekt druku i układ w wydaniu papierowym. Tworzenie stron internetowych jest często nazywane „projektowaniem stron internetowych”: projekt interfejsu (graficzna i tekstowa zawartość witryny), projekt struktury, nawigacji i silnika witryny (wyróżniona część kod programu do realizacji konkretnego zastosowanego zadania).

Obecnie pod pojęciem „projektowanie stron internetowych” rozumie się zaprojektowanie struktury, ideologicznej integralności zasobu internetowego, zapewniające wygodę użytkowania zasobu internetowego użytkownikom. Istotnym elementem projektowania stron internetowych jest ich zgodność ze standardami W3C (English World Wide Web Consortium, the World Wide Web Consortium - organizacja opracowująca i wdrażająca standardy technologiczne dla sieci World Wide Web), co zapewnia dostępność treści serwisu dla osób niepełnosprawnych. możliwości fizycznea także dla użytkowników urządzeń przenośnych.

Również bezpośrednio związany z projektowaniem witryn jest marketing internetowy (marketing internetowy), czyli promocja i reklama utworzonego zasobu, optymalizacja wyszukiwarki

Projektowanie stron internetowych, choć opiera się na elemencie graficznym, nadal znacznie różni się od projektowania do druku. Wynika to przede wszystkim z dynamizmu i interaktywności wizualnego obrazu strony internetowej.

Prawie każda strona internetowa zawiera hiperłącza, menu nawigacyjne i inne elementy, które zapewniają przejścia między informacjami. Dane interaktywne (czyli wymagające pewnych działań ze strony użytkownika i reagowania na nie) elementy i odróżniają interfejsy elektroniczne od zwykłej książki, czasopisma czy gazety.

Podczas projektowania strony internetowej te elementy są kluczowe. Opracowanie właściwego układu strony, logicznej struktury witryny i tras nawigacji to podstawa projektowania i użyteczności stron internetowych

Użyteczność (Angielski usability - dosłownie „użyteczność”, „zastosowanie”) - w odniesieniu do technologia komputerowa termin użyteczność odnosi się do koncepcji rozwoju interfejsu użytkownika oprogramowania, ukierunkowanej na maksymalną wygodę psychologiczną i estetyczną użytkownika.

Wymagania dotyczące projektu strony internetowej zgodnie ze standardami W3C

Projekt strony internetowej powinien być przyjazny dla użytkownika , zrozumiałe, poprawnie wyświetlane w dowolnej przeglądarce. Witryna musi posiadać oryginalny projekt graficzny zapewniający odpowiednią funkcjonalność.

Witryna powinna zapewniać wygodę i kompletność elementów nawigacji.

Podstawowe informacje, menu i inne elementy nawigacji powinny być dostępne bez całkowitego przewijania w poziomie otwórz okno przeglądarkę w rozdzielczości ekranu 1024x768 pikseli.

Projekt (rozmieszczenie bloków informacyjnych, projekt wizualny) strony głównej może różnić się od projektu stron standardowych przy zachowaniu jednolitości stylistycznej serwisu.

Zachęcamy do obecności pięknych obiektów graficznych, stosowania niewielkich, ale stylowych elementów graficznych (ikon, „wizualizacji”) w projektowaniu stron serwisu.

Zachęcamy do niewielkiego włączenia elementów animacji.

Projekt serwisu powinien być dostatecznie „lekki” pod względem ilości elementów graficznych i zapewniać jak największą szybkość ładowania stron serwisu.

Zapewnij łatwą identyfikację sekcji i podsekcji, w której znajduje się użytkownik.

Prawidłowo wyświetlaj informacje na komputerach bez preinstalowanych wtyczek flash, z wyłączoną obsługą skryptów, grafiki, szablonów stylów.

Projekt powinien przewidywać możliwość rozwoju struktury terenu poprzez opracowanie i włączenie w nim nowych działów i podsekcji.

Przeglądarka internetowa lub przeglądarka.

Obecnie każdy użytkownik wybiera dla siebie „swoją” przeglądarkę. Najpopularniejsze to Opera i Firefox. Za nimi znajduje się Internet Explorer (IE).

Przeglądarka internetowa lub przeglądarka (z angielskiego. przeglądarka internetowa) - to jest oprogramowanie wyszukiwać, przeglądać strony internetowe, to znaczy żądać stron internetowych (głównie z sieci), przetwarzać je, wyświetlać i przechodzić z jednej strony na drugą.

Witryna działająca w różnych przeglądarkach to profesjonalna i kompetentna witryna, która wygląda tak samo, gdy jest wyświetlana w różnych przeglądarkach. Witryna musi zapewniać poprawne wyświetlanie danych w następujących przeglądarkach:

Internet Explorer (wersja 5.5 i nowsze):

Opera (wersja 7.0 i nowsze);

Mozilla Firefox (wersja 1.0 i nowsze).

Głównym trybem kolorów monitorów, na których strona powinna być poprawnie wyświetlana, są kolory 15-bitowe i wyższe (liczba kolorów to 65536 i więcej).

Opracowanie struktury projektu internetowego

Zgodnie z ogólną koncepcją projektu, wyznaczonymi celami i zadaniami, określa się strukturę projektu internetowego, a mianowicie:

§ struktura danych, definicja relacji między tabelami bazy danych, struktury transferu danych ze źródeł zewnętrznych;

§ określenie poziomu automatyzacji przetwarzania danych, opracowanie struktury zarządzania danymi;

§ dokonywana jest specyfikacja formularzy i kolejność ich pojawiania się;

§ Struktura interfejs użytkownika: pozycje menu i elementy nawigacyjne, wymagane poziomy zagnieżdżenia;

§ opracowanie szkiców projektu (liczba opcji jest uprzednio zatwierdzana).

Rozwój.

§ projekt: rozwiązanie artystyczne i techniczne. Stworzenie autorskiego stylu strony internetowej: kolorystyka, produkcja elementów projektowych, banerów, elementów graficznych;

§ programowanie: tworzenie elementów programu;

§ wdrożenie nawigacji w przyjętym modelu projektu;

§ podstawowa treść;

Hypertext Markup Language HTML

• (z angielskiego Hypertext Markup Language - „hypertext markup language”) to standardowy język znaczników dla dokumentów w Sieć ogólnoświatowa... Wszystkie strony internetowe są tworzone przy użyciu HTML (lub XHTML). HTML jest interpretowany przez przeglądarkę i renderowany w dokumencie przyjaznym dla człowieka.
• Wraz z XML, HTML jest powszechnie określany jako „tekstowe języki znaczników”. W rzeczywistości rola tych dwóch języków, podobnie jak samego formatu zwanego „zwykłym tekstem”, wykracza daleko poza przetwarzanie. informacje tekstowe.
• Nauka dowolnego języka komputerowego zaczyna się od zaznajomienia się z jego podstawowymi elementami budulcowymi - operatorami, wyrażeniami, zmiennymi. Z tego punktu widzenia język HTML jest niezwykle prosty, żeby nie powiedzieć prymitywny: oprócz zwykłego tekstu, plik HTML zawiera tylko jeden rodzaj struktur sterujących, tzw. tagi.

Słowa w nawiasach ostrych ”<” и “>„Nazywane są deskryptorami HTML lub znacznikami HTML.

Główne elementy strony internetowej

Główny pasek nawigacyjny serwisu (menu). Alternatywne menu i zduplikowane menu główne. Linki, rodzaje linków i ich realizacja. Główne elementy projektu witryny. Układ strony serwisu. Schemat kolorów witryny. Optymalizacja grafiki internetowej, przygotowanie obrazków na stronę WWW. Zasady pracy ze zdjęciami.

Główny pasek nawigacyjny serwisu (menu)... Panel nawigacji serwisu, który zawiera linki do głównych sekcji serwisu (i ewentualnie do podsekcji aktualnej sekcji), powinien znajdować się na każdej stronie serwisu i nie powinien zmieniać jego lokalizacji, co jest uważane za najbardziej rażące naruszenie norm użyteczności.

Generalnie akceptowane są dwie opcje umieszczania paska nawigacji: pionowo w lewej kolumnie lub w linii w nagłówku strony. Nierzadko można znaleźć kombinację tych metod, gdy zarówno lewa kolumna, jak i górny wiersz są używane do organizowania paska nawigacji. Ponadto w górna liniaz reguły odsyłacze do najważniejszych, zdaniem dewelopera, działów.

W programie można powielić kilka elementów menu głównego alternatywne menu. Jeśli główny jest poziomy, to jest pionowy lub odwrotnie.

Zgodnie ze standardami użyteczności nigdy i pod żadnym pozorem nie należy tworzyć linków do menu - linków do pobranych plików, na przykład do cennika. Wszystko, co nie prowadzi do standardowych stron serwisu, należy poprzedzić napisem: „pobierz”.

Aktywna sekcja menu (strona, na której znajduje się użytkownik) powinna być podświetlona, \u200b\u200bwyraźnie różniąca się od innych pozycji, na przykład kolorem.

Odwiedzane sekcje należy wyróżnić innym kolorem, aby zwiedzający mógł zobaczyć, gdzie był, a gdzie nie.

Link do strony głównej. Bardzo pożądane jest umieszczenie linku do strony głównej na wszystkich stronach serwisu. Powszechnie przyjętą zasadą stało się używanie logo witryny jako łącza do strony głównej lub ikony domu.

Dostępność jest mile widziana zduplikowane menu głównena dole strony.

Główne elementy projektu witryny.

Projekt - to projektowanie rzeczy, samochodów, wnętrz, oparte na zasadach łączenia wygody, ekonomii i piękna.

Grafika - sztuka przedstawiania przedmiotów obrysami i kreskami, bez farb (niekiedy z wykorzystaniem kolorowych plam) (Słownik Ozhegova).

Główną ideą projektowania graficznego jest połączenie estetyki i zadań funkcjonalnych w jednym projekcie. Sukces projektu w dużej mierze zależy od zgodności zasady wewnętrzne, którymi kieruje się specjalista przy tworzeniu projektu graficznego.

Głównym zadaniem projektowania stron internetowych jest stworzenie komfortowej atmosfery do przyswajania informacji na stronach serwisu internetowego.

Nie ma jednego uniwersalnego rozwiązania do projektowania stron internetowych. Istnieją zupełnie inne możliwości wykonania projektu strony internetowej, co wiąże się z opracowaniem następujących elementów:

Układ stron internetowych;

Grafika.

Układ strony serwisu.

Strona internetowa jest w rzeczywistości postrzegana jako zbiór prostokątnych pól ułożonych w określonej kolejności. W tym przypadku dane są z reguły uporządkowane w kolumnach, dlatego do układu używa się terminu układ jedno-, dwu-, trzykolumnowy.

Układ stron serwisu powinien zapewniać automatyczne skalowanie stron w zależności od szerokości pola roboczego przeglądarki użytkownika. Minimalny rozmiar (szerokość) obszaru roboczego przeglądarki, przy którym konieczne jest zapewnienie pełnego wyświetlania stron (bez poziomego paska przewijania), to 1024 pikseli.

Schemat kolorów witryny.

Kolor to jeden z najbardziej kontrowersyjnych elementów projektowania stron internetowych. Kolor może podkreślać kontekst lub może odpychać. Sukces strony w dużej mierze zależy od wybranej kolorystyki. Badacze z zakresu użyteczności i projektowania stron internetowych zauważyli, że pierwsze wrażenie informacyjnego zasobu Internetu powstaje na podstawie kompozycji kolorystycznej i to właśnie ta kompozycja jest przechowywana w pamięci użytkownika, a nie treści informacyjne.

Aby stworzyć efektowny projekt, należy wziąć pod uwagę szereg wymagań nałożonych na wybór schematu kolorów:

Jasność, ton i nasycenie kolorów powinny odpowiadać korporacyjnemu stylowi witryny;

Wybór koloru odbywa się z uwzględnieniem docelowych odbiorców tego zasobu;

Liczba użytych kolorów podstawowych, jeśli to możliwe, nie powinna przekraczać trzech;

Kolory użyte na stronie muszą współgrać i harmonizować ze sobą;

Używanie koloru powinno być zgodne z podstawowymi regułami logiki;

Osobnym punktem jest zaznaczenie wyboru koloru tekstu. Tło i tekst strony należy ozdobić kontrastowymi kolorami. Najlepszą czytelność zapewniają czarne znaki na białym tle. Tekst nie powinien zlewać się z tłem, a nagłówki powinny zostać utracone.

Konieczne jest, aby kolorystyka odpowiadała formie prezentacji materiału, jego treści, odbiorcom serwisu.

Optymalizacja grafiki internetowej, przygotowanie obrazków na stronę WWW. Zasady pracy ze zdjęciami.

Użycie grafiki musi być uzasadnione, grafika musi wyraźnie odpowiadać zawartości serwisu. Nadmiar grafiki i animacji odwraca uwagę od głównej treści, odwracając uwagę odwiedzających witrynę i utrudniając załadowanie strony.

Witryna musi się szybko ładować, a grafika zajmuje większość ruchu na stronie. Jedno zdjęcie w kilobajtach zajmuje dziesięć razy więcej miejsca niż arkusz tekstu A4. Grafika zdecydowanie powinna zostać zoptymalizowana! Należy używać zduplikowanych obrazów, ponieważ komputer przechowuje raz pobrane pliki w folderach tymczasowych, aby skrócić czas pobierania. „Nagłówek” witryny na wszystkich jej stronach może służyć jako powtarzający się obraz.

Jeśli chcesz umieścić duże obrazy, możesz sprawić, by otwierały się programowo przez dodatkowe kliknięcie w nowym oknie przeglądarki. Ale domyślnie witryna powinna być lekka.

Średni czas ładowania strony nie powinien przekraczać 30 sekund przy szybkości połączenia 28,8 Kb / s. Dozwolone są dłuższe czasy ładowania poszczególne strony do 35 sekund, ale nie więcej niż 30% ogólnej liczby stron w serwisie. Strona główna powinien mieć czas ładowania nie dłuższy niż 40 sekund

Na Strona internetowa Możesz używać plików graficznych w formatach JPG, GIF i PNG. GIF to specjalny format sieciowy: ma mały rozmiar pliku, możliwość płynnego wywoływania i animacji, a także efekt przezroczystości, pozwalający na użycie obrazu jako „tapety” na stronie lub w tabelach. Lecz odkąd gif zawiera paletę 256 kolorów, nie nadaje się do przechowywania zdjęć. Z drugiej strony JPG nie ma ograniczeń dotyczących głębi kolorów, ale także możliwości animacji. Nowy format pliki, które obsługują zarówno głębię, jak i przezroczystość -PNG, mają tę wadę, że starsze przeglądarki ich nie widzą. Dlatego jeśli nie bierzesz pod uwagę użytkowników przestarzałych programów, całkiem możliwe jest umieszczenie pingów na twoich stronach. Aby zamieścić zdjęcie na stronie, musisz opisać link do niego:

gdzie SRC (z sou rce -source) \u003d Plik obrazu w formacie gif, jpg lub png zawierający obraz.
Możesz ustawić względne położenie obrazu i tekstu, włączając atrybut align \u003d "":

Możliwe są następujące typy wyrównania:
align \u003d "middle" - względem środka linii
align \u003d "left" - tekst opływa obraz w prawo
align \u003d "right" - to samo po lewej stronie

Przy korzystaniu z lewej lub prawej strony wyrównanie może być zawarte w tagu img dodatkowy parametr Wcięcie wokół obrazu, aby nie było przyciśnięte blisko tekstu. Parametr VSPACE \u003d „n” - tworzy pionowe wcięcie, a HSPACE \u003d „n” - w poziomie o n pikseli. W ten sposób poprawnie napisany tag obrazu z tekstem płynącym w prawo będzie wyglądał następująco:

Tekst.

Ostatnim parametrem jest szerokość obramowania. Jeśli występuje bez wartości, ale po prostu jako słowo BORDER, wówczas obramowanie zostanie narysowane przez przeglądarkę dowolnie, a jeśli, jak w przykładzie, to wartość wskazuje jej szerokość. Wartość zerowa tego parametru jest używana, jeśli plik służy jako hiperłącze graficzne do jego maskowania.

Podobne informacje.