Sayfanın kaynak kodunu ve öğenin kodunu nasıl görüntüleyebilirsiniz. Google Chrome'daki sayfa kodunu nasıl değiştirilir?

Her İnternet kullanıcısının, uzun süre geçirdiği favori sitelerine sahiptir. Ve sadece tembel nasıl oluşturulduğunu ve ne olduğunu görmeyi düşünmedi. Cevap Tüm bu sorular çalışmayacak, çünkü bir site oluşturmanın birçok yolu olduğu gibi, bu ekipleri ve bunların oluştuğu ekipleri ve kodları görmek için - herkes tarafından mümkün ve erişilebilir.

Başka bir soru, bir kişinin kodu oluşturan karakterlerden bir şeyin programlanmasında kiminle meşgul olmadığını anlamayacağıdır. Ancak, herhangi bir kullanıcıdan daha düşük olacak örneklerden Google Chrome. Sitelerin bireysel unsurlarını izleyebilir.

Google'dan Tarayıcıdaki HTML Sayfalarının Kaynak Kodunu Nasıl Görünür

Chrome'daki sayfa kodunu görebileceğiniz şey, ilgilendiğiniz siteye gitmeli ve aşağıdaki işlemleri gerçekleştirmelidir:

Bu maddelerden ikisi, kullanıcı, programcı veya hacker hakkındaki işlevsellik ve bilgileriyle kendileri aralarında farklılık göstermektedir.

Sayfa kodu ile sadece "Kodu Görüntüle" komutu arasındaki fark nedir?

Bu fonksiyonların her birini görüntüleme ayrı bir öğe yazılabilir. Programcılar için bu fark önemlidir ve Google Chrome tarayıcısında "Görünüm kodu" nı kullanmanız gerektiğinde ve hangi durumlarda "Sayfa Görünümü" ndedir.

Ancak normal kullanıcıları açıklamak, aşağıdaki amaçlarla bu işlevleri bölersiniz:

1. "Sayfa kodunu görüntüleyin" sadece sayfanın ana kombinasyonunu görmek için gereklidir. Temel olarak, bu, sitenin yapısıdır (CSS dosyaları formunda ek modeller olmadan ve Site Oluşturucu klasöründe kalan diğer uyarılar). Bu yapı Oluşturma için uygun değil kendi sayfası "Kopyalama - Ekleme" ile, ancak programcının ne yaptığını ve Google Chrome tarayıcısındaki sitenin böyle bir harici tasarıma sahip olması için hangi sırayla yaptığını görmenize izin verir.
2. "Kodu Görüntüle", sayfadan etkilenen tüm alanları tahsis eden ayrıntılı bir yapıyı görüntüler. Belirli bir liste kodunu getirirseniz - sitede ait olduğu bir öğeyi tahsis eder.
3. Sayfa kodunu görüntüleme, düzenleme yeteneği olmadan ayrı bir tarayıcıda açılır. Yani, yalnızca site kodunu kopyalamak ve okumak için uygundur. Ancak bu daha az faydalı bir özellik değil.
4. "Kodu Görüntüle" değiştirin ve herhangi bir öğeyi sizin için uygun olacak şekilde düzenleyebilirsiniz. Tabii ki - bu tüm değişiklikler, sayfa güncellenene kadar "canlı" olacaktır, ancak bazen ayarlara tırmanmak eğlencelidir ve neden gerekli olduğunu ve değiştirilirse ne olacağını basitçe anlayacaktır. Bu tür eylemlerin kendinize veya siteyi incittiğini varsaymamalısınız - bu değişiklikler yalnızca Google Chrome'unuzun kodunda geçerlidir ve çevrimiçi olmaz.

Öğenin kodunu nasıl göreceğin sorusunu düşünün

Eğer böyle bir soruyu gerçekten cevaplarsanız, yalnızca örnek olarak bir seçenek. Çünkü bir makalenin bu konuyu (Web geliştiricisi) anlayabilecek bir kişi olmak için (Web Geliştirici) çok zordur, ancak tükenmenin örneğini göstermek için - çok daha kolay hale getirmek için.

Eleman kodunun işlevselliği çok geniştir, bu nedenle Google Chrome tarayıcı sitesindeki kelimelerden birini alırız. Ne olduğunu düşünmek istedik anahtar kelimeler (Kodda, sitemiz için "anahtar kelime" olarak kaydedilecektir. Bunu yapmak için aşağıdaki algoritmayı yapın:

Bu işlevi Google Chrome tarayıcısında kullanmanın başka yolları

Genel olarak, öğenin kodunu nasıl görüleceği ve neden gerektiğine ilişkin sorusuna cevap vermeye devam etmek, işlevlerine aktarılmalıdır. Yani, herhangi bir sitenin kodunu Google Chrome tarayıcısındaki kodunu görme yeteneği sayesinde şunları yapabiliriz:

• Baştan ("Site Kapağı") ve bitiş ucu (herhangi bir programın son komutu) tarafından başlayan sitenin yapısına bakın;
• Tüm site fonksiyonlarını görüntüleyin, yani: diğer sitelere bağlantılar, dış sitelerden ek modüller ve farklı bilgileri toplamak için yerleşik metre varlığı;
• Siteden kopyalamanın yasak olup olmadığını öğrenin;
• Kodda, diğer site sayfalarına olan tüm bağlantıların yanı sıra onlara tıkladıktan sonra tasarımları ve sonraki eylemleri kaydedilecektir.

Bu sınırlı bir liste değil. Ancak özel bir bilgi olmadan - "okuma" kodunu hatırlatılmalıdır. google sayfaları Krom neredeyse imkansızdır ve elde edilen veriler pratik olarak normal kullanıcı tarafından gerekli değildir.

Öğe "Öğe Kodunu Görüntüle" çalışmıyor

Derhal söylemeliyim - her site birlikte olacak açık Erişim Öğelerin kodlarına. Yani, en popüler ve pahalı siteler bile kodlarını görüntülemek için açık olacaktır. Bu nedenle, Google Chrome tarayıcısındaki öğenin aktif olmadığı veya bir hata verilmesi durumunda, aşağıdaki olası nedenlere sahiptir:

• Kullanıcı profili hasar gördü;
• Bilgisayarda kötü amaçlı yazılımların varlığı;
• Verimliliği artırmak için belirli bir uzantı ile engelleme (bu bile olabilir).

Hasar görmüş kullanıcı profilini düzeltin

Yaratmak yeni profilEski olanı bilgisayarınızdan kaldırmalısınız. Bunu yapmak için aşağıdakileri yapın:

1. Google Chrome'u kapatın ve yerleşikleri başlatın tarayıcı pencereleri Explorer.
2. Adres çubuğuna aşağıdaki komutu giriyoruz:% localAppData% \\ Google \\ chrome \\ kullanıcı verileri \\.
3. Dizin açıldığında, "Varsayılan" klasörünü arıyoruz ve "yedekleme" adına ekledik, böylece aşağıdakiler şunlardır. "Yedekleme Varsayılan".
4. Şimdi tarayıcı kromunun yeni başlatılmasından sonra, yeni bir profil oluşturulacak.

Kötü amaçlı yazılımı veya kalıntılarını çıkarın

Yeni bir profil, sayfa öğesinin sayfasına erişmedi ve hatayı hala görüyoruz, aşağıdaki adımları izleriz:

1. Açık komut satırı Windows ("koşu") ve orada "cmd" komutunu girin.
2. Satırdaki aşağıdaki komutu girin: RD / S / Q "% windir% \\ System32 \\ GroupPolicyUsers".
3. Eylemi onayladıktan sonra, şunu sürün: rd / s / q "% windir% \\ System32 \\ Grouppolicy".
4. Şimdi "gpupdate / kuvvet" (sürahi olmadan).

Her şey doğru yapıldıysa, o zaman yeniden başlatıldıktan sonra google bilgisayar Chrome, öğelerin kodunu açacak ve tarayıcının çalışma kapasitesi normalde olacaktır.

Benim için uzun süredir "göster" seçeneği kaynak Sayfalar "işe yaramaz ve ilgisizlikti. CodeCademy'deki HTML'nin incelenmesi ve kendi sitelerinin düzeni yeni tutkuma dönüşmedi. Soru ortaya çıktı: "Kumbara" için gerçek durum durumları ve ilginç çözümleri ödünç alabilecekleri? Cevap beklenmedik bir şekilde basitti, tüm ustaca gibi: Google Chrome'daki sayfanın kaynak kodunu görün! Seninle mütevazı bulmalarımla paylaşıyorum.

Sayfanın kaynak kodu nedir

Benim gibi, sadece HTML programlamasında ilk adımları yap, sayfanın kaynak kodunun ne olduğunu bulmak için gereksiz olmayacak.

Kaynak kodu, html sayfa kodudur - Hyper Metin İşaretleme Dili'ndeki Metin (HTML). Sayfanın içeriğini (metin, tablo) ve etiketleri içerir. İkincisi, tarayıcı için talimatın rolünü oynar: İçeriğin nasıl görüntüleneceği, bir köprü veya medya dosyası ekleneceğini kullanmak için ne tür bir biçimlendirme kullanılır. Peki, bizim için acemi programcılar kaynak kodu en iyi eğitim alanıdır: ilginç bir site ve casus buluyoruz, tasarruf ediyoruz, başarılı parçalar kullanıyoruz. Nasıl?

Google Chrome Tarayıcı Sayfasında Kaynak Kodu Nasıl Görünür

İstediğiniz sayfayı buluruz. Örneğin, Site menüsünün yürütülmesiyle ilgilendim. Google Chrome Tarayıcısındaki Kaynak Kodunu üç yolla açın:

1. Simgeye tıklayın menü Tarayıcının sağ üst köşesinde ve "Ek Araçlar" öğesini seçin. Diğerleri arasında "Kaynak Kodunu Görüntüle" seçeneğine sahiptir. Nadiren kullanımı kabul bu method: Çok fazla gereksiz hareket. Daha kolay yapılabilir.
2. Tuş kombinasyonuna basın CTRL + U. - Yeni pencere kaynak koduyla açılır;
3. Hayranları için bağlam menüsü: Sayfaya sağ tıklayın ve sayfa kodu seçeneğini seçin.

Tarayıcıda HTML sayfa kodunu izlemek için bir görevle. En ilginç aşamaya git.

Kaynak kodunun nasıl düzenlenmesi ve kaydedilmesi

Siteler oluşturmayı öğrenmek için, başkasının HTML kodunu okumak için yeterli değildir. Bununla oynamanız, deneyin, değişiklik yapın ve sonucu kontrol edin. Birkaç başarılı numunenin derlenmesiyle başlamaya başlayabilirsiniz. Kaynak kodunu nasıl düzenlenir ve kaydedebilirsiniz?

Seçenek 1. "Manuel"

Sayfanın kaynak kodunu açtıktan sonra, bağlam menüsünü arayın ve "Kaydet" seçeneğini seçin ve dosyayı kaydedin hdd. Dosyayı not defteri veya not defterinde düzenleyin, değişiklikleri kaydedin ve tarayıcıyı açın. Değişikliklerimizin sonuçları (başarılı ve değil) tarayıcı penceresinde övülecektir.

Seçenek 2. Artıları için

Her gün kaynak koduyla "oynadığınızda", "Kaydet - Aç - Değiştir - Kaydet - Kaydet - Kontrol Et" işlemi. Kendim için, Google Chrome - Firebug Lite için bir eklenti biçiminde bir çözüm buldum. Tarayıcı penceresinden çıkmadan kaynak kodunu düzenlemenizi ve kaydetmenizi sağlar.

1 oy

İyi günler, Blogumun sevgili okuyucuları. Sitede bazı güzel bir çip olur ve soruyu işkence etmeye başlar, yaratıcının böyle ilginç bir etkiye nasıl ulaştığını.

Cevabı bulmak oldukça basit olduğu ortaya çıktı. Ve eğer bazı yetenekleriniz varsa, kendi benzersiz sitenizi oluşturmak için bu tür cips ve kısa bir sürede seçebilirsiniz.

Bugün, sayfa kodunu, belirli bir unsurun nasıl açılacağı hakkında konuşacağız ve bu yeteneği kendiniz için kullanmayı öğreneceğiz.

Temel kod bilgisi

Sitem yeniler için tasarlanmıştır ve ilk önce sitelere ve kodlara iki kelimede söylemek istiyorum.

Bir resim çizmek için, daha sonra küçük parçalara bölün, tarayıcının tüm öğeleri tek bir bütününe getireceği sayesinde kod yazın. Görünüşe göre her şey çok zor mu? Hiç değil ve bu konuda yas tutmaya değmez.

Kaliteli siteler bu şekilde oluşturulur. İstek - bu olguya yakın ve çalışma, arzu yok - kimse seni zorlayamıyor.

Sadece bir şey söyleyeceğim ... Siz tarafından yazılan anlaşılmaz kelimeleri görmekten daha hoş bir şey yoktur, tek bir bütün haline dönüştürülür ve hayata gelin: Bağlantılar İş, Düğmeler Hareket, Resimler Hareketli, Metin tarar. Sanırım Viktor Frankenstein'ın nasıl hissettiğini biliyorum.

Gizli bir dili kavramaya başladığınızda ve her şeyin aslında olduğundan daha basit olduğunu görünce, başlangıçta kendi gücünüze ve beyin fırsatlarına inanamazsınız. Çok havalı.

Siteler nasıl yapılır? İdeal olarak, önce. Sadece bir resim çizer. Örneğin, aşağıdaki şekilde gösterildiği gibi. Sadece bir görüntü ise, bir fotoğraf. Hiçbir referans çalışmıyor, herhangi bir yere gitmediğinizde, arama yapılmaz.

Bu rakam için. Aşağıdaki ekran görüntüsüne bakın. Çok saçma ve çok karmaşık bir karakter kümesi gibi görünebilir. Aslında, her şey çok zor değil, belli bir algoritma var.

Sadece yaklaşık 150 etiket var ve bunların her biri belirli bir eylemden sorumludur: Bağlantı, transfer, yağ, renk, başlık vb. Onlarla uğraşmak o kadar zor değil, eğer bir arzu varsa, zamana acımasız değil.

Bu niteliklerin bilgisi sayesinde, hemen hemen her görevi çözebilirsiniz. Ancak her geliştirici hedefe ulaşmanın yolları kendi bulur.

Deneyimli yaratıcılar derhal sonuçların nasıl elde edileceğini görecek ve diğerleri, makalelerde veya ilk rakiplerin ilk kodunda bir cevap araması gerekir. Sadece üçüncü taraf bir sitede gerekli parçayı alırlar ve kendileri için düzenlerler. Bu, iş sürecini önemli ölçüde azaltır.

Biraz sonra size belirli bir örnek göstereceğim.

Kodu Görüntüle

Öyleyse, önce başka birinin HTML'yi öğrenmeniz gerekiyorsa, nasıl hareket edeceğinizi gösterelim. O zaman diğer tüm soruları daha ayrıntılı olarak düşüneceğiz.

En iyi yol

Birinci tanımlayacağım yöntemi, yeniler için biraz karmaşıktır, ancak bir tanıdık olarak - gidecek, okunur. Sayfayı açın ve farenin sağ tuşuna tıklayın. "Kaydet ..." öğesini seçin.

Web sayfasını tamamen kaydedin. Ekran görüntüsünde görebileceğiniz gibi, her şeyi önceden indirdim. Burada iki klasör var.

İhtiyacınız olan her şey var. Her öğe. Bunu anlarsanız, ihtiyacınız olan her şeyi hızlıca bulabilirsiniz. Ancak, böyle bir görev giderek daha fazla uygulanamaz hale geliyor. İndirme yapılmaz. Sayfayı kopyalamak yasaksa ne yapmalı?

Bu Google Chrome

Muhtemelen fark edebileceğiniz gibi, en sık Google Chrome'u kullanıyorum ve bir başkasının kodunu bu tarayıcıda buluyorum, basitten daha kolaydır. Prensip olarak, her ikisi de diğerlerinde olduğu gibi. Program benzer, ancak aynı olan şey olmayacak. Kodunu bilmek istediğimiz sayfayı açıyoruz ve herhangi bir yere sağ fare düğmesine tıklayın. Görüntülenen sayfanın tıklamasına, sayfa kodunu tıklatın.

Yeni pencere, yeni gelenleri anlamanın oldukça zor olduğu bir kod sayfasını açacaktır. Ancak, vaktinden önce korkmayın.

Sadece bir öğenin kodunu bilmeniz gerekiyorsa, fare ile birlikte getirmek için yeterlidir ve sağ tıklayın. Başka bir Chromium işlevi seçin: "Kod kodunu görüntüleyin".

Örneğin, bir resim veya programlama dilini kullanırken logonun nasıl yapıldığı ile ilgilenebilir miyim? Sonuçta, ne zaman bir kare çizebilirsin cSS yardımı. Birçok uzman, kodla kaydolmak için mümkün olduğunca fazla bilgi verilir. Popüler sitelerde nasıl çalışıyorsunuz?

Öyleyse ortaya çıktı gerekli bilgi. Yukarıdaki HTML'den, CSS'nin dibinde. Bunlar iki dil. Birincisi, metin bileşeninden ve ikinci tasarımdan sorumludur. Css yoksa, her seferinde, yazı tipi boyutunu reçete etmek zorunda kalacaksınız. Her sayfa için çok uzun. Ancak HTML yoktu, metinlerimiz olmazdı. Kabaca açıklandı, ancak genel olarak her şey öyle.

Bu arada, burada nasıl düzenlendiğine ilgi duyuyorsanız, resmin altındaki bağlantının altına bakabilirsiniz. Yani cevap ver.

Mozilla Firefox.

Bir milletvekilinde çalışmak isterseniz, her şey de olacak. Sayfayı açın ve farenin sağ tuşuna tıklayın. Tüm kodun tamamını görmek istiyorsanız "Sayfa Kaynak Kodu".

Herhangi bir maddeye geldiğinizde, kodunu açmak mümkündür.

Burada veriler ekranın alt kısmında görüntülenir ve aksi takdirde her şey dedir.

Yandex Tarayıcı

Yandex tarayıcısında, her şey önceki iki sürümündeki gibidir, sayfayı açın, sağ fare anahtarı, sayfa koduna bakın.

Kodunu bilmek istiyorsak imleci öğeye getiriyoruz.

Burada tam olarak Chrome'da olduğu gibi gösterilir.

Opera

Nihayet Opera.

Bu arada, belki fareyi kullanmak için gerekli olmadığını fark ettiniz. Kodu açmak için hızlı bir tuş kombinasyonu var ve tüm tarayıcılar için aynı: CTRL + U..

Öğeler için: CTRL + Shift + C.

Sonuç böyle nasıl görünüyor.

Yeni başlayanlar ile ilgilenecek

Ve şimdi her şeyin nasıl çalıştığını gör. Size bir site bulun ve gerçekten bir çeşit eşyadan hoşlanırsınız. Örneğin, bu. Bildiğiniz öğenin kodunu nasıl açabilirsiniz.

Şimdi kopyala.

Kullandığım, bu kodu yeni bir HTML dosyasına, vücut etiketinde (İngilizce olarak) yerleştirin.

Şimdi tarayıcıya nasıl bakacağını görelim.

Hazır. Metnin kenarlar boyunca hizalanması ve yeşilimsi bir renk elde edilmesi için, bu belgeye CSS'ye bağlanmanız ve bunu yaptığımız sitedeki başka bir kodu kopyalamanız gerekir.

Şimdi bunu yapmayacağım. Daha fazla zamana ihtiyacı var: Ve benim ve seninkiler. Gelecekteki yayınlarımda tarif edeceğim tüm detayların olduğunu düşünüyorum. Bültene abone olun ve önce makalenin görünümünü öğrenin.

Eğer katlanmak için bir gücünüz yoksa ve şimdi HTML ve CSS hakkında daha fazla bilgi edinmek istiyorsanız, gelenek tarafından ücretsiz eğitim kursları önerebilirim.

İşte html efendisine izin verecek 33 ders - « Ücretsiz kurs html tarafından " .

Ve burada CSS hakkında tam bilgi - "Ücretsiz CSS kursu (45 video eğitimi!)" .

Şimdi biraz daha biliyorsun. Onların çabalarında başarılar diliyorum. Yeni toplantılara!

Olasılık ilke bakın kodu ağ sayfalar Sunucu sonucunda ortaya çıkan tarayıcı aslında aslında her İnternet tarayıcısında. İlgili ekibe erişim yaklaşık olarak aynı şekilde düzenlenmiştir, ancak hangi yöntemde ve hangi formda sunulacağınız için önemli farklılıklar vardır. kodu .

Talimat

1. İÇİNDE tarayıcı Mozilla. Firefox menüdeki "Görüntüle" bölümünü açın ve Faydayı tıklayın. kodu sayfalar " Ayrıca, metne sağ tıklarsanız oluşan içerik menüsündeki aynı öğe var. sayfalar . Ctrl + U tuş kombinasyonunu uygulamaya izin verilir. Mozilla Firefox. Harici programlar kullanmaz - ilk kodu sayfalar Sözdizimi vurgulamak, ayrı bir tarayıcı penceresinde açılacaktır.

2. Gözlemciyede Internet Explorer. Dosya bölümü menüsünü tıklayın ve Not Defteri'nde Düzenle'yi seçin. Not Defteri ad yerine, başlangıçta görüntülemek için tarayıcı ayarlarında atadığınız farklı bir program kodu fakat. Tıklayın sayfalar Bağlantı menüsünü sağ tıklatın, içeriğin açılmasını sağlayan bir öğenin olduğu da kodu sayfalar içinde harici program - "HTML'yi görüntüleyin kodu fakat".

3. İÇİNDE tarayıcı Opera. Menüyü açın, "Sayfa" bölümüne gidin ve muhtemelen "Geliştirme Yöntemi" alt bölümünü tercih edersiniz. kodu »Her iki madde" birincil kodu Freum. Böyle bir seçim yanma reçete edilir ctrl tuşları + U ve CTRL + Shift + U sırasıyla. Bağlam menüsünde, tıklamaya bağlı sayfalar Sağ tıklayın, ayrıca bir öğe var "ilk kodu " Opera kaynak kodunu açar sayfalar HTML dosyalarını düzenlemek için işletim sistemine veya tarayıcı ayarlarına atanan harici programda.

4. Herhangi bir şüphe olmadan Google Chrome tarayıcısı en iyi ilk görüntülemeye sahip kodu fakat. Sayfayı sağ tıklatarak, "Görüntüle'yi tercih edebilirsiniz. kodu fakat sayfalar "Ve sonra sözdizimi geri tepme kaynağı ayrı bir sekmeyle açılacaktır. Ve string "görünümünün aynı menüsünde tercih edebilirsiniz. kodu ve öğesi "ve tarayıcıdaki tarayıcı, HTML ve CSS'yi inceleyebileceğiniz iki ek çerçeveyi açacaktır. kodu herhangi bir element sayfalar . Tarayıcı, imlecin satırlardaki hareketine cevap verecektir. kodu a, HTML'nin bu bölümüne karşılık gelen sayfadaki öğeleri vurgulamak kodu fakat.

5. Apple Safari tarayıcısında "Görünüm" bölümünü genişletin ve "HTML'yi Görüntüle" dizesini seçin. kodu fakat". Oluşan menüde sağ tıklayın sağ tıklayın sayfalar İlgili noktaya "Görünüm Kaynağı" denir. Bu işlem yazma tuşları CTRL + ALT + U. ilk tarafından öngörülmektedir. kodu Ayrı bir tarayıcı penceresinde açılır.

Yeni bir kitap yayınladık "içerik pazarlaması sosyal ağlar: Abonelerin başında oturup markalarına aşık olun. "

Abone ol

Sitenin kaynak kodu, HTML Markup, CSS stillerinin bir kombinasyonudur ve javascript komut dosyalarıTarayıcının Web sunucusundan aldığı.

Kanalımızda daha fazla video - Semantika ile İnternet Pazarlama öğrenin

Komutanın asker verdiği bir takım takımla karşılaştırılabilir. Seyircinin görmediğini ve kafayı duymadığını hayal edin. Onların bakış açısından, ordu bağımsız olarak eylemler gerçekleştirir. Bizim durumumuzda, komutan bir tarayıcıdır, komutlar kaynak kodudur ve yürürken askerler sonucudur.

Bir site, kullanıcı isteğine bir sayfa gönderen bir Web sunucusunda saklanır. Sorgu, URL'yi adres çubuğuna girmek için, bağlantıya tıklayın veya formdaki Veri Gönder düğmesine tıklayın. Hangi dilde web sayfalarının yazıldığı önemli değil, ister yazılım. Herhangi bir sunucu algoritmasının sonucu bir dizi HTML etiket ve metindir.
Sayfanın kaynak kodu, şunları içeren bir veri setidir:

• hTML İşaretleme;
• stilize tablo veya dosyaya bağlantı;
• javascript'te yazılmış programlar veya kodlu dosyalara bağlantılar.

Bu üç bölüm bir tarayıcı tarafından işlenir. Sunucu için, bu sadece talebe cevap olarak göndermek istediğiniz metindir.

Neden kaynak kodunu öğrenmemiz gerekiyor?

Tüm göreceğimiz, özellikle optimize ederken, site ile birlikte ortaya çıkan diğer işleri veya diğer görevleri çözmek için analiz edebileceğiz ve uygulayabileceğiz. Kaynak kodunu görüntüleme, yapabiliriz:

• Analizleri için başkasının sitenizin meta etiketlerine bakın.
• Sitedeki bazı maddelerin varlığını veya yokluğuna bakın: Sayaçlar, Kimlik Kodları Çeşitli sistemlertanımlanmış komut dosyaları ve diğer şeyler.
• Öğelerin parametrelerini bulun: Boyutlar, renkler, yazı tipleri.
• Sayfada bulunan fotoğrafların ve diğer öğelerin bir yolunu bulun.
• Sayfadaki bağlantıları inceleyin.
• Site optimizasyonu işlemine müdahale eden kodla ilgili sorunları bulun: dayanılmaz ayrı dosyaları Stiller, komut dosyaları, geçersiz kod.

Bunlar ana özelliklerdir, ancak aslında kodu okuyabilir, sayfa hakkında daha fazla bilgi edinebilirsiniz.

Sitenin kaynak kodunu nasıl görüntülemek için

Tam olarak sunucuya gönderildiği formda, bunu tarayıcıdan yapmak mümkün olmayacaktır. Ancak, sayfadaki sağ fare düğmesine tıklayarak tüm işaretlemeyi görebilirsiniz. Bundan sonra, Google Chrome örneğinde.

"Sayfa kodunu görüntüleme" seçeneğini seçin ve ayrı bir sekmeyle tam liste kazanın.

Bu sadece analiz etmek zorunda kalacak bir metindir. Ancak, geliştirici araçlarını kullanarak etkileşimli kodu alabilirsiniz.

Site sayfasının kaynak kodunu nasıl bulabilirsiniz?

Tarayıcıdaki menü simgesine tıklayın. Çoğu zaman, sağda ve üç nokta veya çizgili görünümüne sahiptir.

Gelişmiş Araçlar bölümünde "Geliştiricinin Araçları" nu seçin.

Kodun etkin durumunu görüntüleyen bir pencere açılır. Bu, fare işaretlemeye tıkladığında, eleman stilinin görüntülendiğinde ve seçilen bloklar sayfada vurgulanacağı anlamına gelir.

Kaynak sekmesinde, bazı dosyaların içeriğini görüntüleyebilirsiniz: Scriptler, Yazı Tipleri, Görüntüler.

Güvenlik sekmesinde, bir test sertifikası mevcuttur.

Denetimler sekmesi, kaynak barındırılmasını kontrol etmenize yardımcı olacaktır.

Panelin konumu rahatsız edici ise, üç noktaya basabilir ve istediğiniz öğeyi seçerek değiştirebilirsiniz.

Meta etiketleri nasıl görülür

Her HTML belgesi yapı etiketlerini içerir. İşte bunlardan bazıları:

1. HTML tüm belgedir.
2. HİZMET HİZMETİ BÖLÜMÜ.
3. Başlık - Sayfa Başlığı (sekmede görüntülenir).
4. Vücut - belgenin gövdesi.
5. H1-H6 - Sayfa metin başlıkları.
6. Makale - Makale.
7. Bölüm - Bölüm.
8. Menü - Menü.
9. Div - blok.
10. Açıklık hattı.
11. P - paragraf.
12. Tablo - Tablo.

Elementler, eğer varsa, sayfadaki bölümlerin mantıksal ayrılması amaçlanmıştır, stillerle hazırlanırlar. Bir şekilde sayfada görülebilen bir metin içeriyorlar. Ancak baş etiketi mevcut bilgidir. Talimatları için Meta Etiketler hizmet vermektedir. Onlara yazdıkları her şey, sunucu ve arama motorları için tasarlanmıştır.

İçeriği başka bir şekilde tanınamaz.

Bağlantı etiketine dikkat edin. Bununla birlikte, harici eklenti dosyalarına referanslar belirtilir. İsterseniz içeriğini görebilir ve diskte kaydedin. Bunu yapmak için, işaretçiyi adrese çevirin ve PCM'yi tıklayın. Yeni sekmesinde Aç'ı seçin.

Yeni sekme açılır belirtilen dosyahangi görüntülenebilir veya kaydedilebilir.

Script'i hata ayıklamak için kaynak kodunu nasıl görüntüleyebilirsiniz?

Bu durumda, sayfayı yerel makinede açmak uygundur. Yalnızca işaretlemeyi, stilleri ve komut dosyalarını düzeltmeniz gerekirse, doğrudan klasörden yapılabilir. HTML kodu aynı şekilde görüntülenir. Ancak JavaScript kod hataları "Konsol" sekmesinde görülebilir. Burada hata açıklaması ve kaynaklandığı satır numarasını gösterir.

Sözdizimi doğrudan kodda görülebilir. Bunu yapmak için, kaynak sekmesi tasarlanmıştır.

Belirli öğe kodunu nasıl görürsünüz?

Çok sayıda öğeye sahip büyük sayfalar için, istenen kodu tüm işaretlemede bulmak zordur. Bu durumda, özel bir bağlam menüsü komutunu kullanmalısınız. Fareyi parça sallayarak ve PCM'ye basın. "Kodu Görüntüle" komutunu seçin.

Aynı pencere açılır, ancak seçilen nesneye odaklanır.

Özet

Sayfanın kaynak kodunun ne olduğunu söyledik. HTML ve CSS'nin temel bilgilerine hakim olmak ve uygun geliştirici araçları kullanarak, kendi HTML belgelerinizi hata ayıklayabilirsiniz.

İnternetteki kaynak kodunu görüntüleme, yalnızca kendi deneyiminizde değil, aynı zamanda gerçek çalışma örneklerini de kullanmanıza izin verir. Ve SEO uzmanları için, site hakkında çok şey söyleyebileceği bilgiler, bu konuda çok faydalı olacaktır.