Reklama sponsora

Sekcja head i dodawanie stylów css



Sekcja head i style css – o co chodzi?

Wszystkie metatagi umieszczamy w głowie dokumentu czyli sekcji head. Są to informacje o różnych aspektach strony niewidoczne na pierwszy rzut z punktu widzenia użytkownika (no może z wyjątkiem kodowania), jednak bardzo istotne z punktu widzenia wyszukiwarki czy przeglądarki internetowej. Jeśli chcesz żeby twoja strona jako tak się pozycjonowała i była dobrze widoczna w wynikach wyszukiwania np Google powinieneś dobrze opanować tę część.

Sekcja head to i najczęściej style css określające wygląd poszczególnych elementów strony, dlatego też przytoczę tutaj ten i dwa inne sposoby umieszczania stylów css.

Bez zbędnego przedłużania wstępu przejdźmy od razu do rzeczy.

Sekcja head dokumentu HTML

W poprzedniej części ustaliliśmy że dokument html składa się z dwóch głównych elemntów, którymi są sekcja HEAD czyli głowa dokumentu oraz sekcja BODY czyli ciało dokumentu, w którym umieszczamy poszczególne treści. Co powinna zawierać sekcja head.

Najważniejsze elementy sekcji head

Tytuł strony

Najważniejszym elementem strony jaki umieszczamy w sekcji head jest jej tytuł. Nie powinien on być długi, ponieważ znajduje się w wynikach wyszukiwania oraz na belce przeglądarki w kracie otwartej strony. Z tego samego powodu musi on być jak najbardziej zgodny z tym co się akurat znajduje na danej podstronie. Z tego wynika że nie najlepszym pomysłem jest umieszczenie tytułu takiego samego dla wszystkich podstron. Umieszczenie tytułu jest chyba najprostsze ze wszystkich elementów sekcji head:


<title>Moja pierwsza strona</title>

 

Opis strony

Drugim zawsze wykorzystywanym elementem jest opis strony. Wyświetla się on pod tytułem w wyszukiwarkach internetowych co oznacza że to jest pierwsza i najlepsza okazja by zachęcić użytkownika do odwiedzenia tej a nie innej strony.


<meta name="Description" content="Moja pierwsza strona czyli strona stworzona na podstawie kursu html 5 i css 3" />

Słowa kluczowe

Kolejnym ważnym elementem sekcji head są słowa kluczowe, są one dość istotne dla wyszukiwarek by te mogły odpowiednio zakwalifikować stronę w wynikach. Dobrze dobrane słowa to pierwszy krok ku dobrej pozycji strony www. Dodawanie tego elementu jest dość analogiczne jak w przypadku opisu strony.


<meta name="keywords" content="strona,www,html,kodowanie" />

Jak łatwo zauważyć poszczególne frazy są oddzielone od siebie przecinkami.

Kodowanie strony

Kolejnym elementem sekcji head jest kodowanie strony. Element ten jest może mniej istotny dla wyszukiwarek ale pozwala prawidłowo wyświetlać treści znajdujące się na stronie. Zadbanie o odpowiednie kodowanie zapobiega wyświetlaniu „krzaczków” w miejscach gdzie powinny być polskie litery z ogonkami. Kiedyś dość popularne było kodowanie is-8859-2 jednakże teraz wszędzie spotykanym standardem jest UTF-8 dlatego korzystajmy właśnie z niego zawsze i wszędzie by nie mieć później problemów z konfliktami.

<meta charset=”UTF-8″ />

Te elementu są najważniejsze co nie oznacza że kolejne nie są ważne.

Kolejne elementy sekcji head

W sekcji head umieszczamy znacznie więcej informacji. Poniżej lista tych, które powinien zawierać twój każdy projekt.

Autor strony

Może nieco mniej znacząca informacja ale pod każdym projektem warto się podpisać, dzięki temu znacznikowi ktoś bardziej wtajemniczony będzie mógł w prosty sposób sprawdzić kto jest autorem strony. Jeśli zajmujesz się tym bardziej zawodowo i tworzysz portfolio to z jednej strony klient, któremu strona się spodoba będzie mógł łatwiej do ciebie dotrzeć z drugiej jeśli umieszczasz portfolio na swojej stronie to jak się podpiszesz w każdym projekcie nie będzie wątpliwości kto je wykonał.


<meta name="Author" content="Daniel Kuczewski" />

 

Dodawanie arkuszy stylów CSS

Ogólnie style można dodawać co najmniej na trzy sposoby. Piszę co najmniej bo kombinować można na różne sposoby ale w html ogólnie są trzy. Pierwszy polega na umieszczeniu odpowiednich poleceń bezpośrednio w elemencie i to się nazywa osadzanie stylów inline. Drugim sposobem jest umieszczanie stylów w odpowiednich znacznikach. Trzecia metoda to umieszczanie stylów w oddzielnym pliku. Z tych trzech, pierwszych dwóch staramy się zawsze unikać i stosować zawsze trzecią.

 

 

Dodany przez gay dating site s bareback
2022-01-15 22:14:51

dating guys wen 18 gay https://speedgaydate.com/

Dodany przez gay chat room carneys point
2022-01-14 22:32:51

gay men chat roon 91764 https://gay-buddies.com/

Dodany przez gay boy chat
2022-01-14 18:10:50

pittsburgh gay chat https://gaytgpost.com/

Dodany przez young gay dating porn video
2022-01-14 15:04:53

gay older men dating https://gaypridee.com/

Dodany przez chat canada gay
2022-01-14 11:17:51

free gay radom web cam chat https://bjsgaychatroom.info/

Dodany przez 3astounded
2022-01-13 01:52:13

3ill-omened


Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *