Podczas tworzenia strony internetowej układ wielu przeglądarek jest ważny z punktu widzenia zapewnienia jej skuteczności. Co to jest? Jak to zrobić? Jakie pułapki istnieją?

Czym jest projekt oparty na różnych przeglądarkach?

Html /css to podstawa do stworzenia strony. Wielu webmasterów zbliża się do tej zasady: wszystko jest w porządku - i wystarczy. A jak nieprzyjemnie się dzieje, gdy przychodzisz z przeglądarki lub urządzenia mobilnego, a witryna jest wyświetlana niepoprawnie. W takich przypadkach przydatna jest adaptacyjna konstrukcja i dostosowanie do różnych przeglądarek.


Css i html są w tym przypadku szkieletem, przez który wszystko jest realizowane. W niektórych przypadkach do tego celu można użyć javascript. Ale ostatecznym celem jest sprawienie, by wszystko działało w różnych wersjach. Dlatego, jeśli chcesz mieć przeglądanie stron, aby strona była dobrze widoczna we wszystkich przeglądarkach, musisz myśleć o niej nieustannie, od pierwszej sekundy pracy na stronie.

Ogólny przewodnik krok po kroku

Rozważmy więc, jak utworzyć układ przeglądania wielu stron. Najpierw musisz zdecydować, które programy będą działać na stronie. Należy zauważyć, że liczba przeglądarek zbliża się do dwustu, więc próba zadowolenia wszystkich jest kwestią niewiarygodnej złożoności. Dlatego wybierz liczbę z przedziału od 3 do 8. Aby określić, do czego nawigować, możesz również skorzystać z usług pomocniczych, takich jak Yandex Metrika i Google Analytics. Następnie musisz dowiedzieć się, w jaki sposób zostanie rozwiązany problem osiągnięćprzeglądanie krzyżowe.


Wielu stawia ich na hacki. Są to specjalne kody, selektory i reguły, które rozumie tylko jedna konkretna przeglądarka. Ale, biorąc pod uwagę, że konieczne jest napisanie co najmniej kilkudziesięciu takich insertów dla różnych przeglądarek i ich wersji, wielu odrzuca to podejście ze względu na wysokie koszty, czas trwania i irracjonalność. Niektórzy stawiają na wykorzystanie tych elementów, które są wyświetlane w ten sam sposób. Ale często traci wiele ważnych korzyści. Aby zminimalizować straty, równolegle stosuje się projekt adaptacyjny. Co on reprezentuje?

Adaptive Design

Jest to podejście do układu strony, w którym witryna jest wykonana z gumy, to znaczy dostosowuje się do różnych przeglądarek i rozmiarów ekranu. Należy zauważyć, że projektowanie adaptacyjne i przeglądanie krzyżowe są ściśle ze sobą powiązane, a mówiąc o jednym, z reguły implikuje to drugie. Spójrzmy na mały przykład. Istnieją przeglądarki takie jak Mozilla i Opera Mini. Pierwszy jest używany na zwykłych komputerach, a drugi na telefonach komórkowych. Ogólnie są podobne, ale mają wiele funkcji. W takich przypadkach ważne jest podłączenie pojedynczych plików i /lub korzystanie z zapytań o media. Co to jest? W pierwszym przypadku tworzone są osobne pliki, które są ukierunkowane na działanie konkretnej przeglądarki i wykonywane jest ich wywołanie. W drugim przypadku potrzebujesz zapytań o media. Jeśli program, którego używasz, spełnia określone wymagania, plik jest ładowany we właściwej konfiguracji.

To, czego potrzebujeszrobić?

Przede wszystkim należy pamiętać, że podczas pracy z html, projektowanie w różnych przeglądarkach wymaga szczególnej uwagi. Dlatego, aby uzyskać maksymalną wydajność, najlepiej wykorzystać kaskadowe arkusze stylów. Musi także zmienić niektóre podejścia do pracy. Tak więc wielu niedoświadczonych osób, gdy wskazują na rozmiar czegoś, używa pikseli - px. Rozważ przykład z dużym nagłówkiem, który zdobi górną część strony. Miała szerokość 800rh. Z ekranem 1600rh będzie całkiem atrakcyjny. Ale na 700rh będzie wyglądać bezcelowo. Co robić w tym przypadku? Możesz określić rozmiar w pikselach, a także w procentach! I będzie to oznaczać napis nie w stałej długości i połowę szerokości ekranu. Procent można ustawić i odległość, przy której pewien element zostanie umieszczony z krawędzi ekranu. Ale co zrobić, gdy ekran jest bardzo mały? Załóżmy, że jest 300rh? W takim przypadku pomożemy w zgłoszeniu nośnika, które jest wymagane do zarejestrowania szerokości poprawki. A jeśli jest to 700rh lub mniej, to możesz ustawić, że napis zajmie 75% powierzchni. A jeśli szerokość wynosi 300rh lub mniej, możesz ustawić i wszystkie 100%. Ogólnie rzecz biorąc, temat jest bardzo interesujący i użyteczny, dlatego można go szczegółowo przeanalizować. Ale, niestety, są informacje na temat tej książki, a wszystko w tym artykule nie zadziała.

Dlaczego adaptacyjny układ wieloprzeglądowy przyciąga wyszukiwarki?

Odpowiedź jest prosta: chodzi o to, że programiści śledzą witrynę i czynią ją maksymalnie przyjemną dla użytkowników. I tak, takieludzi można zachęcać, nadając im wyższe pozycje w wyszukiwarkach. Oczywiście twoja strona nie zostanie przeniesiona bezpośrednio do TOP-1, ale w połączeniu z innymi czynnikami pozwoli ci dużo się wspinać. Należy zauważyć, że nie jest to tylko próżny wymóg, ale coś, co zasługuje na taką uwagę. Pomyśl o tym sam: jak to jest dla użytkownika, gdy trafi na stronę, która nie jest bardzo przyjemna na zewnątrz? Ale może dojść do wniosku, że wyszukiwarka oferuje treści o niskiej jakości! Dlatego są one tak starannie dobranymi stronami, które powinny być oferowane. Ponadto jest to także korzyść webmasterów, ponieważ tworzą powłokę o wysokiej jakości, w której ludzie mogą uzyskać interesujące informacje za pośrednictwem dowolnego urządzenia sprzętowego: komputera, laptopa, tabletu, smartfona lub telefonu komórkowego. W związku z tym im więcej zadowolonych gości, tym szybciej rośnie strona i poziom dochodów.

Wnioski

Nie można nie wspomnieć o skromnym fakcie, że utworzenie witryny z wieloma przeglądarkami o adaptacyjnym designie - nie jest to łatwe, bardzo długie i pracochłonne. Dlatego musisz być cierpliwy i pamiętaj, że dyscyplina to wielka sprawa! Może coś nie wyjdzie pierwszy, ale musisz spróbować, szukać informacji, stosować różne podejścia, a nie wycofywać się. A następnie konieczne będzie stworzenie witryny, która będzie kosztowna, aby pokazać jej odwiedzających.