{"id":1023,"date":"2019-10-05T18:53:33","date_gmt":"2019-10-05T18:53:33","guid":{"rendered":"http:\/\/kevinbk.com\/\/?p=1023"},"modified":"2022-02-17T09:40:27","modified_gmt":"2022-02-17T09:40:27","slug":"indice-ou-sumario-de-links-ancoras-em-seu-site","status":"publish","type":"post","link":"https:\/\/kevinbk.com\/pl\/indice-ou-sumario-de-links-ancoras-em-seu-site\/","title":{"rendered":"Spis tre\u015bci lub spis odno\u015bnik\u00f3w na stronie internetowej"},"content":{"rendered":"

W tym artykule wyja\u015bnimy, dlaczego wa\u017cne jest posiadanie spisu tre\u015bci lub indeksu we wszystkich swoich artyku\u0142ach i postach na stronie internetowej. Wyja\u015bnimy r\u00f3wnie\u017c, jak mo\u017cesz stworzy\u0107 spis tre\u015bci w WordPress lub w HTML. Zacznijmy od spisu tre\u015bci:<\/p>\n\n\n\n

Dok\u0142adnie tak robi\u0119 spisy tre\u015bci moich artyku\u0142\u00f3w w WordPress. R\u0119cznie i bez wtyczek, mog\u0119 u\u017cywa\u0107 dowolnych s\u0142\u00f3w kluczowych i identyfikator\u00f3w. Wszystko to w wybranych przeze mnie artyku\u0142ach, bez obci\u0105\u017cania WordPressa setkami wtyczek. <\/p>\n\n\n\n

Co to jest indeks lub spis tre\u015bci? <\/h2>\n\n\n\n

W artykule lub po\u015bcie chodzi o wewn\u0119trzne linki kotwicowe, kt\u00f3re kieruj\u0105 czytelnika bezpo\u015brednio do podtytu\u0142u (zazwyczaj H2) swojego postu. Mo\u017ce to sprawi\u0107, \u017ce nie straci on du\u017co czasu na czytanie artyku\u0142\u00f3w o 2 000 s\u0142owach lub zawieraj\u0105cych wiele r\u00f3\u017cnych temat\u00f3w w jednym po\u015bcie. <\/p>\n\n\n\n

Je\u015bli chodzi o og\u00f3ln\u0105 definicj\u0119, indeks to lista s\u0142\u00f3w, kt\u00f3ra mo\u017ce by\u0107 zorganizowana alfabetycznie, systematycznie, chronologicznie, numerycznie lub alfanumerycznie. <\/p>\n\n\n\n

Um indeks<\/em><\/strong> jest to to samo co wska\u017anik, znak lub objaw, odniesienie s\u0142u\u017c\u0105ce do por\u00f3wnania, wyja\u015bnienia okre\u015blonej sytuacji lub warunk\u00f3w, wskazuj\u0105c r\u00f3wnie\u017c ich odpowiednie strony w ksi\u0105\u017cce lub list\u0119 rzeczy. <\/p>\n\n\n\n\n\n

O spis tre\u015bci<\/em><\/strong> to lista zawieraj\u0105ca na pocz\u0105tku artyku\u0142u, [pracy dyplomowej, ksi\u0105\u017cki itp.] wszystkie rozdzia\u0142y dzie\u0142a. Spis tre\u015bci to wyliczenie g\u0142\u00f3wnych sekcji i podrozdzia\u0142\u00f3w innego dokumentu, w kolejno\u015bci, w jakiej materia\u0142 si\u0119 pojawia.<\/em>, b\u0119d\u0105c wi\u0119c kr\u00f3tkim, prostym, zwi\u0119z\u0142ym i tre\u015bciwym streszczeniem.<\/p>\n\n\n\n

T\u0142umacz\u0105c, oba s\u0105 tym samym, ale osobi\u015bcie wol\u0119 nazywa\u0107 to spisem tre\u015bci. Niekt\u00f3rzy prawdopodobnie szukali indeks\u00f3w w WordPressie, inni szukali spisu tre\u015bci, a jeszcze inni zakotwicze\u0144. <\/p>\n\n\n\n

G\u0142\u00f3wnym powodem, dla kt\u00f3rego u\u017cywam obu wyra\u017ce\u0144 w tym artykule, jest poprawa pozycji i ranking\u00f3w w Google oraz dotarcie do wi\u0119kszej liczby os\u00f3b. W rzeczywisto\u015bci jest to cel stosowania streszcze\u0144 i indeks\u00f3w w artyku\u0142ach. <\/p>\n\n\n\n

Znaczenie kotwicowych ogniw i spisu tre\u015bci<\/h2>\n\n\n\n

Linki zakotwiczenia to dowolny link, kt\u00f3ry prowadzi do fragmentu twojej strony lub nawet do innej strony na witrynie. S\u0105 one bardzo wa\u017cne i nie powinny w \u017cadnym wypadku by\u0107 ignorowane, je\u015bli chcesz wyr\u00f3\u017cni\u0107 si\u0119 na tle konkurencji. <\/p>\n\n\n\n

Spisy i indeksy s\u0105 do\u015b\u0107 wa\u017cne w przypadku artyku\u0142u lub postu. Dzieje si\u0119 tak dlatego, \u017ce zakotwiczone odno\u015bniki u\u0142atwiaj\u0105 indeksowanie twojego artyku\u0142u i pozwalaj\u0105 mu pojawia\u0107 si\u0119 cz\u0119\u015bciej pod alternatywnymi s\u0142owami kluczowymi. <\/p>\n\n\n\n

\"\u00cdndice<\/figure><\/div>\n\n\n\n

W ten spos\u00f3b zawsze dodawaj podsumowanie do swojego artyku\u0142u, aby poprawi\u0107 SEO. Robi\u0119 to r\u0119cznie, wielu ludzi u\u017cywa wtyczek, ale uwa\u017cam, \u017ce r\u0119czne dodawanie link\u00f3w zakotwiczonych pozwala mi lepiej dostosowa\u0107 identyfikatory. <\/p>\n\n\n\n

Jak powinien wygl\u0105da\u0107 indeks z kotwicami link\u00f3w? <\/h2>\n\n\n\n

Wska\u017aniki powinny by\u0107 wymienione w bloku wyr\u00f3\u017cniaj\u0105cym si\u0119, z innym kolorem t\u0142a i pogrubionym tytu\u0142em (u\u017cywam bloku preformatowanego). Lista spisu tre\u015bci mo\u017ce by\u0107 u\u0142o\u017cona z my\u015blnikiem [-] przed tematem, kt\u00f3ry ma mie\u0107 odno\u015bnik kotwicy. <\/p>\n\n\n\n

Czy mo\u017cesz lub nie utworzy\u0107 listy temat\u00f3w spisu tre\u015bci za pomoc\u0105 tych samych s\u0142\u00f3w co w podtytule. Czasami wol\u0119 troch\u0119 r\u00f3\u017cni\u0107 indeks i podtytu\u0142 H2. Staram si\u0119 u\u017cy\u0107 r\u00f3\u017cnych s\u0142\u00f3w, aby tekst mia\u0142 wi\u0119ksze szanse na znalezienie w Google. <\/p>\n\n\n\n

\"\u00cdndice<\/figure><\/div>\n\n\n\n

Kotwy s\u0105 linkami rozpoczynaj\u0105cymi si\u0119 od [#], co oznacza, \u017ce \u015bcie\u017cka znajduje si\u0119 na tej samej stronie. Niekt\u00f3rzy maj\u0105 zwyczaj dodawania losowych link\u00f3w kotwowych z cyframi lub s\u0142owami niezwi\u0105zanymi z tematem podtytu\u0142u. <\/p>\n\n\n\n

Musimy pami\u0119ta\u0107, \u017ce nawet je\u015bli mowa o kotwie [#exemplo], wa\u017cne jest, aby zawiera\u0142a s\u0142owa kluczowe, aby lepiej pozycjonowa\u0142a si\u0119 w Google i innych wyszukiwarkach. Dlatego nigdy nie u\u017cywaj liczb ani losowych rzeczy w swoich kotwicach. <\/p>\n\n\n\n

Czy zauwa\u017cy\u0142e\u015b, \u017ce zawsze w ikonach odno\u015bnik jest reprezentowany przez \u0142a\u0144cuch? Natomiast kotwica jest dos\u0142ownie reprezentowana przez kotwic\u0119? Po prostu t\u0142umacz\u0105c, kotwica jest ko\u0144cem \u0142a\u0144cucha lub ko\u0144cowym miejscem odno\u015bnika, kt\u00f3ry jest ustalony gdzie\u015b indziej. <\/p>\n\n\n\n

Jakie s\u0105 problemy zrobienia indeksu w swoim artykule?<\/h2>\n\n\n\n

Mimo \u017ce jest to bardzo korzystne dla SEO i rankingowania Twojej strony, spis tre\u015bci mo\u017ce sprawi\u0107, \u017ce czytelnik skoczy bezpo\u015brednio do po\u017c\u0105danej cz\u0119\u015bci, sp\u0119dzaj\u0105c mniej czasu na Twojej stronie i ogl\u0105daj\u0105c mniej reklam. Mo\u017ce to mie\u0107 wp\u0142yw lub nie na wska\u017anik odrzuce\u0144 i CPC.<\/p>\n\n\n\n

Indeksy w artyku\u0142ach i postach z ma\u0142\u0105 ilo\u015bci\u0105 s\u0142\u00f3w mog\u0105 r\u00f3wnie\u017c wydawa\u0107 si\u0119 dziwne. Zazwyczaj stosuj\u0119 indeksy z odno\u015bnikami w artyku\u0142ach zawieraj\u0105cych wi\u0119cej ni\u017c 800 s\u0142\u00f3w i co najmniej 3 podtytu\u0142y H2.<\/p>\n\n\n\n

\"\u00cdndice<\/figure><\/div>\n\n\n\n

Je\u015bli zrobisz to r\u0119cznie, automatycznie wygenerowane identyfikatory nie b\u0119d\u0105 mia\u0142y tego samego autorytetu co identyfikatory wykonane r\u0119cznie. Wykonywanie tego r\u0119cznie pozwala doda\u0107 niestandardowe kotwy i zmniejsza szans\u0119, \u017ce Google uzna to za co\u015b z\u0142ego. <\/p>\n\n\n\n

Jak stworzy\u0107 indeks w HTML<\/h2>\n\n\n\n

Przed now\u0105 wersj\u0105 WordPressa z edytorem Gutenberg musieli\u015bmy r\u0119cznie u\u017cywa\u0107 kodu HTML do tworzenia spisu tre\u015bci z linkami kotwicowymi. Teraz jest to o wiele \u0142atwiejsze dzi\u0119ki nowemu edytorowi Gutenberg. <\/p>\n\n\n\n

Mimo to wyja\u015bni\u0119 szczeg\u00f3\u0142owo, jak dzia\u0142a kotwice w HTML. Opr\u00f3cz spisu tre\u015bci, musisz r\u0119cznie doda\u0107 [ID], gdzie kotwice b\u0119d\u0105 prowadzi\u0107. Zazwyczaj to ID jest umieszczane w nag\u0142\u00f3wkach (H2, H3 i H4). <\/p>\n\n\n\n

Najpierw w spisie tre\u015bci lub indeksie kod HTML b\u0119dzie wygl\u0105da\u0107 nast\u0119puj\u0105co: <\/p>\n\n\n\n

<strong>Spis tre\u015bci artyku\u0142u<\/strong> \n<a href="\/pl\/”\/#nome_da_ancora”">- Tytu\u0142 kotwicy<\/a>\n<a href="\/pl\/”\/#nome_da_ancora2”">- Tytu\u0142 kotwicy 2<\/a>\n<a href="\/pl\/”\/#nome_da_ancora3”">- Tytu\u0142 kotwicy 2<\/a><\/pre>\n\n\n\n
Wynik wy\u015bwietlania HTML b\u0119dzie wygl\u0105da\u0107 mniej wi\u0119cej tak: <\/p>\n\n\n\n
To jest spis tre\u015bci wykonany w HTML. Zauwa\u017c, \u017ce u\u017cywasz tego samego znacznika linków <a>, ale zamiast linku dodajesz href=#blabla<\/strong> gdzie znajduje si\u0119 hashtag [#<\/strong>] wskazuje, \u017ce link znajduje si\u0119 na tej samej stronie i dotyczy ID - to\u017csamo\u015b\u0107<\/strong>.<\/p>\n\n\n\n
Dodaj hashtag do swojego podtytu\u0142u H2 lub innego miejsca, do kt\u00f3rego chcesz, aby spis tre\u015bci Ci\u0119 przekierowa\u0142. Zazwyczaj wynik w formacie HTML wygl\u0105da nast\u0119puj\u0105co:<\/p>\n\n\n\n
<h2 id="nome_da_ancora"> <\/pre>\n\n\n\n
Jak zrobi\u0107 spisy tre\u015bci w WordPress bez wtyczki <\/h2>\n\n\n\n
O ID - to\u017csamo\u015b\u0107<\/strong> nie trzeba u\u017cywa\u0107 znaku hash. W edytorze WordPress mo\u017cesz doda\u0107 identyfikator bez u\u017cycia cudzys\u0142owia mi\u0119dzy s\u0142owami kluczowymi. Sam koryguje ten problem automatycznie, my\u015bl\u0119, \u017ce wi\u0119kszo\u015b\u0107 czytelnik\u00f3w i edytor\u00f3w HTML mo\u017ce zrozumie\u0107 to bez u\u017cycia cudzys\u0142owu.<\/p>\n\n\n\n
Teraz, jak ju\u017c wiesz, jak dzia\u0142a spis tre\u015bci, sugeruj\u0119 zrobi\u0107 co\u015b lepszego w nowym edytorze Gutenberg. Po napisaniu wszystkich artyku\u0142\u00f3w ze wszystkimi nag\u0142\u00f3wkami H2, mo\u017cesz po prostu klikn\u0105\u0107 przycisk informacji i skopiowa\u0107 ca\u0142y spis tre\u015bci, kt\u00f3ry si\u0119 tam pojawi na dole. Przegl\u0105d dokumentu<\/strong>.<\/p>\n\n\n\n
Ten spis b\u0119dzie ju\u017c zawiera\u0142 hasztagi i wewn\u0119trzne identyfikatory edytora Gutenberg. Po prostu skopiuj i wklej wszystko do sformatowanego pola w WordPress, kt\u00f3re ma szary t\u0142o, usu\u0144 nadchodz\u0105ce razem z wklejeniem H2 i zako\u0144cz, dodaj\u0105c my\u015blnik [-].<\/p>\n\n\n\n
\"\u00cdndice<\/figure><\/div>\n\n\n\n
Wystarczy wi\u0119c edytowa\u0107 linki w spisie tre\u015bci i doda\u0107 w\u0142asne hashtagi, a\u017c do uzyskania efektu podobnego do tego, kt\u00f3ry pokazali\u015bmy powy\u017cej. Po zrobieniu tego, wystarczy przemieszcza\u0107 si\u0119 po artykule za pomoc\u0105 nag\u0142\u00f3wk\u00f3w H2, zaznacza\u0107 je i przej\u015b\u0107 do opcji bloku.<\/p>\n\n\n\n
W opcjach blok\u00f3w H2 i innych nag\u0142\u00f3wk\u00f3w znajdziesz si\u0119 w karcie zaawansowany<\/strong> wyb\u00f3r anchor w HTML<\/strong>Wystarczy wpisa\u0107 ID, kt\u00f3re doda\u0142e\u015b do spisu tre\u015bci w tym polu, nie u\u017cywaj\u0105c \"a\". hasztag<\/strong> [#]. WordPress automatycznie doda to bez potrzeby edycji HTML.<\/p>\n\n\n\n
Spis tre\u015bci \u2013 Plugin do tworzenia spis\u00f3w tre\u015bci w WordPress<\/h2>\n\n\n\n
Przez ca\u0142y artyku\u0142 m\u00f3wi\u0142em o tworzeniu spis\u00f3w tre\u015bci r\u0119cznie i moim stanowczym odmowie korzystania z wtyczek, aby utrzyma\u0107 hiper\u0142\u0105cza w czysto\u015bci. Niestety zmieni\u0142em zdanie i aby unikn\u0105\u0107 marnowania pracy i czasu, ostatecznie zdecydowa\u0142em si\u0119 skorzysta\u0107 z wtyczki. <\/p>\n\n\n\n
Obecnie u\u017cywam wtyczki LuckyWP Spis Tre\u015bci<\/strong> i ustawi\u0107 go w taki spos\u00f3b, aby link zakotwiczenia by\u0142 pisany ma\u0142\u0105 liter\u0105, bez znak\u00f3w diakrytycznych i r\u00f3wny tytu\u0142owi H2 i H3. Nie mam zbyt wiele do powiedzenia o wtyczce, je\u015bli szuka\u0142e\u015b czego\u015b, to uwa\u017cam, \u017ce jest najlepsza. <\/p>\n\n\n\n
Kotwice w gigantycznych spisach tre\u015bci za pomoc\u0105 Edytora Tekstu<\/h2>\n\n\n\n
Istniej\u0105 edytory tekstu posiadaj\u0105ce narz\u0119dzia do zast\u0119powania zmiennych, co pozwala na automatyczne dodawanie hashtag\u00f3w i identyfikator\u00f3w do spis\u00f3w tre\u015bci w WordPressie lub innym tek\u015bcie w formacie HTML.<\/p>\n\n\n\n
Jak mam system MacOS, korzystam z edytora tekstu CODA 2. By\u0142 to jedyny, kt\u00f3ry znalaz\u0142em i pozwala \u0142atwo doda\u0107 identyfikatory do nag\u0142\u00f3wk\u00f3w bez konieczno\u015bci ci\u0105g\u0142ego przeskakiwania mi\u0119dzy pocz\u0105tkiem i ko\u0144cem artyku\u0142u. My\u015bl\u0119, \u017ce Dreamweaver r\u00f3wnie\u017c ma \u015bwietne opcje lokalizacji i zamiany tekstu.<\/p>\n\n\n\n
Z pomoc\u0105 programu do edycji tekstu, kt\u00f3ry obs\u0142uguje zmienne lokalne i ich zamian\u0119, dodaj nast\u0119puj\u0105cy kod do lokalizacji i zamiany tekstu. Zmienne b\u0119d\u0105 umieszczone mi\u0119dzy [].<\/p>\n\n\n\n
<a href="#[1<\/strong>]- [2<\/strong>]<\/a>[3<\/strong>]<h2><\/pre>\n\n\n\n
Pierwsza zmienna zlokalizuje i zapami\u0119ta identyfikator streszczenia. Druga zmienna dopasuje pozosta\u0142\u0105 cz\u0119\u015b\u0107 linii wewn\u0105trz streszczenia, a trzecia zmienna przeniesie pozosta\u0142\u0105 cz\u0119\u015b\u0107 artyku\u0142u do nag\u0142\u00f3wka, kt\u00f3ry jeszcze nie zosta\u0142 dodany. ID - to\u017csamo\u015b\u0107<\/strong>. Zast\u0105p przez:<\/p>\n\n\n\n
<a lol href=\u201d#[1<\/strong>]- [2<\/strong>]<\/a>[3<\/strong>]<h2 id="[1]"><\/pre>\n\n\n\n
\"\u00cdndice<\/figure><\/div>\n\n\n\n
Czasami tw\u00f3j lokalizator mo\u017ce kolidowa\u0107 z jak\u0105\u015b przestrzeni\u0105 lub symbolem, ale zazwyczaj zast\u0105pi go tylko raz. Musisz kilka razy klikn\u0105\u0107 przycisk \u201ezast\u0105p\u201d \u017ceby zrobi\u0142 to ze wszystkimi nag\u0142\u00f3wkami artyku\u0142u.<\/p>\n\n\n\n
To wa\u017cne, aby to zrobi\u0107 tylko z nag\u0142\u00f3wkami jednego rodzaju, takimi jak 
, nie mo\u017cesz r\u00f3wnie\u017c doda\u0107 \u017cadnego znacznika mi\u0119dzy nag\u0142\u00f3wkami H2 w kodzie artyku\u0142u. Je\u015bli co\u015b jest nie tak, edytor b\u0119dzie przypisywa\u0142 z\u0142e zmienne za ka\u017cdym razem, gdy dokonasz zast\u0119pstwa.<\/p>\n\n\n\n
Zast\u0105pienie pobierze informacje z pierwszej tabeli. O lol<\/strong> w tek\u015bcie s\u0142u\u017cy do zapobiegania powt\u00f3rzeniu procesu w tej samej linii listy (nie zapomnij go usun\u0105\u0107 potem). W przypadku powt\u00f3rzenia procesu przeskoczy on 
<\/strong> com ID i od razu idzie do odpowiedniego nag\u0142\u00f3wka.<\/p>\n\n\n\n
To mo\u017ce wydawa\u0107 si\u0119 troch\u0119 myl\u0105ce, ale my\u015bl\u0119, \u017ce wszystko to mo\u017cna by lepiej wyja\u015bni\u0107 wideo. W ka\u017cdym razie, pomy\u015bl troch\u0119, przyspiesz swoj\u0105 prac\u0119 i zamie\u015b\u0107 indeksy we wszystkich swoich artyku\u0142ach, aby wyr\u00f3\u017cni\u0107 si\u0119 spo\u015br\u00f3d konkurencji i poprawi\u0107 swoje SEO.<\/p>\n\n\n\n
Ja te\u017c zrobi\u0142em bardzo d\u0142ugi film instrukta\u017cowy m\u00f3wi\u0105cy o jak napisa\u0107 moje artyku\u0142y<\/a>. Mo\u017cesz go obejrze\u0107 poni\u017cej:<\/p>\n\n\n\n
\n