Wszyscy znamy jawność zalety korzystania z CSS już teraz - będąc w stanie centralnie zlokalizować całą naszą prezentację, możliwość replikacji zmian w projekcie natychmiast w całej witrynie i tak dalej. Ale nie wszyscy są sprzedawani na takie szczegóły. W dzisiejszych czasach wiele osób jest bardziej zainteresowanych SEO (Search Engine Optimization, lub sprawia, że strony wyglądają dobrze w wyszukiwarkach) niż cokolwiek innego. Co się stanie, jeśli masz klienta lub pracodawcę, którego mantra jest bardziej podobna do „SEO za wszelką cenę, CSS niech będzie przeklęty”?
Mam dla ciebie dobrą wiadomość! Korzystanie z CSS (i jego sprawdzonego pomocnika, XHTML) jest bardzo korzystne dla Twojej pozycji SEO. Poniżej przedstawiłem cztery różne sposoby wykorzystania CSS do ulepszenia optymalizacji pod kątem wyszukiwarek. Niektóre z nich zdarzają się automatycznie, podczas gdy inne wymagają podejmowania decyzji.
Usprawniony XHTML
W świecie SEO ważna jest wielkość i lokalizacja. Jeśli twoja strona jest znacznie dłuższa, treść na dole strony nie będzie klasyfikowana jako „ważna”, tak jak rzeczy na górze. I tu jest ważna część - „długość” strony zależy nie od ilości treści (tekstu itp.), Ale od ilości kodu. Jeśli Google musi przeczytać kilkaset linii zagnieżdżonych tabel stanowiących najwyższą nawigację, zanim dotrze ona do twoich treści, ryzykujesz, że wyszukiwarki uznają prawdziwą odwagę Twojej witryny za nieistotną.
Zorganizowany kod
Oczywiście, projekt oparty na tabelach może wyglądać dobrze i elegancko na ekranie, ale jeśli chodzi o optymalizację wyszukiwarek, to właśnie to się liczy. Wyszukiwarki nie skanują Twojej strony wizualnie… składają „zdjęcie” Twojej witryny na podstawie kodu. I możesz odkryć, że Twój projekt oparty na tabelach nie „czyta” zupełnie tak, jak oczekiwałeś.
Na przykład zrób zdjęcie powyżej. Wyszukiwarka przeczytałaby tę stronę tak samo, jak każda inna tabela: od lewego górnego do prawego dolnego rogu. Odczytuje wszystko w nagłówku, wszystko w nawigacji i wszystko na pasku bocznym, zanim dotrze do zawartości. A jeśli twoja nawigacja i pasek boczny są takie same na każdej stronie, będziesz miał negatywne trafienie w wyszukiwarkach, aby mieć dużo duplikatów treści z przodu.
Na szczęście podczas pracy z CSS możesz zorganizować swój kod w dowolny sposób. Możesz upewnić się, że Twoja cenna, bogata w słowa kluczowe treść znajduje się w górnej części XHTML i przesuwać pasek boczny w dół poniżej obszaru zawartości. Twój CSS może umieścić pasek boczny gdziekolwiek chcesz lub potrzebujesz wizualnie ... i nie zmieni to odczytywania Twojej witryny przez Google.
Nagłówki tworzą różnicę
Jak wspomniano wcześniej, kiedy martwisz się o SEO, powinieneś martwić się o swój kod. To, co jest poniżej, ma znaczenie, gdy wyszukiwarka przegląda twoją stronę - grafika nie ma znaczenia. W tym celu upewnij się, że używasz dobrych, staroświeckich tagów nagłówków (<h1> - <h6>) dla wszystkich nagłówków dokumentów, a nie tylko stylizujesz akapity lub inny element za pomocą znaczników * shudder * lub nawet CSS.
Nie podoba ci się, jak nagłówek trzeciego poziomu wygląda tuż nad artykułem? Cóż, Google uważa, że wygląda wyśmienicie, więc może powinieneś się zastanowić. Po prostu wyrzuć swoje szalone umiejętności CSS i nadaj mu styl, który będzie wyglądał… no, jak chcesz! Google nie ma nic przeciwko, jeśli twoje nagłówki mają 30 punktów wysokości i fuksję (nawet jeśli inni czytelnicy to robią).
Wybierz swoje wyróżnienie
Nagłówki nie są jedynymi elementami wpływającymi na SEO. Wyszukiwarki zwracają również uwagę na kilka innych znaczników podczas określania, jakie są „ważne” słowa na stronie. Na przykład Google zazwyczaj traktuje słowa opakowane w tagi <strong> i <em> jako bardziej znaczące niż otaczający je tekst. Dlatego czasami zobaczysz strony z losowo zaznaczonym wyrazem pogrubionym lub pisanym kursywą - starają się zwiększyć SEO, pomagając Google znaleźć słowa kluczowe, na których chcą się skupić.
Ale kto może powiedzieć, że te słowa kluczowe muszą być widoczne dla wszystkich? Zawsze możemy użyć CSS, aby upewnić się, że wyszukiwarki takie jak Google i Yahoo rozumieją, które słowa są ważne, bez konieczności denerwowania naszych czytelników naszą zupą strong-em. Jeśli weźmiemy trochę XHTML w ten sposób:
<p> To zdanie zawiera kilka <strong> słów kluczowych </strong> <em> znaczącego znaczenia </em>.
Dołącz do niego nową klasę CSS „SEO”:
<p> To zdanie zawiera kilka <strong class = "seo"> słów kluczowych </strong> z <em class = "seo"> znaczące znaczenie </em>.
Następnie napisz prostą regułę CSS taką jak ta:
em.seo, strong.seo {font-weight: normal; styl czcionki: normalny; }
Ten CSS uniemożliwi pogrubienie lub pisanie kursywą na ekranie twoich znaczników SEO i silnych. Jednak wyszukiwarki nadal rozpoznają znaczenie tych tagów.
CSS i SEO, wspólne życie w doskonałej harmonii. Kto powiedział, że nie możesz zjeść ciasta i je zjeść?
Co się stanie, jeśli masz klienta lub pracodawcę, którego mantra jest bardziej podobna do „SEO za wszelką cenę, CSS niech będzie przeklęty”?Nie podoba ci się, jak nagłówek trzeciego poziomu wygląda tuż nad artykułem?
Kto powiedział, że nie możesz zjeść ciasta i je zjeść?
