Taktik pertumbuhan penerbit untuk musim pilihan raya | WEBINAR
Taktik pertumbuhan penerbit untuk musim pilihan raya | WEBINAR
Selepas melalui panduan ini, anda seharusnya dapat memahami cara artikel berita sedia ada diubah suai dan dibuat menggunakan reka bentuk reka letak halaman yang meningkatkan keupayaan Google untuk merangkak dan memahami kandungan halaman.
Tempoh Video
15:35
Jawab Kuiz
Ambil Kuiz Modul Semasa
Bahan
Templat sedia untuk digunakan
Sumber
Laporan dan Sumber
2.1.1 Apakah Reka Bentuk dan Susun Atur?
Reka bentuk dan reka letak tapak anda menentukan cara ia kelihatan kepada pengguna akhir. Ini penting kerana Google akhirnya didorong oleh falsafah mengutamakan pengguna. Halaman web yang memenuhi keperluan pengguna terlebih dahulu, terpantas dan dengan cara yang paling mudah diberi ganjaran dengan kedudukan SERP yang lebih tinggi.
Reka bentuk dan reka letak tapak anda juga menentukan betapa mudahnya perangkak web, seperti bot Google, merangkak dan mengindeksnya. Reka bentuk dan reka letak yang ringkas dan dioptimumkan bermakna merangkak yang cepat dan mudah, yang seterusnya diterjemahkan kepada kedudukan yang lebih baik.
Jadi apakah yang menghalang penerbit daripada melaksanakan amalan terbaik reka bentuk dan reka letak? Selalunya, penerbit berhadapan dengan perkara yang menyakitkan ini:
Untuk menjawab soalan ini, kami melakukan carian Google yang mudah dengan memasukkan kata kunci "Charlie Puth News" ke dalam bar carian.
Berikut ialah hasil carian yang muncul:
Di nombor dua pada kedudukan SERP Cerita Teratas, betul-betul di atas cerita oleh NME, ialah artikel Daily Illini mengenai keluaran terbaru Charlie Puth.
Hakikat bahawa Daily Illini, sebuah akhbar pelajar universiti, mengatasi laman web muzik kendiri terbesar di dunia, menimbulkan beberapa persoalan penting
Bagaimanakah akhbar pelajar di sebuah bandar dengan kira-kira 40,000 penduduk di barat tengah Amerika mengatasi laman web berita muzik terbesar di dunia? Tertarik, kami memutuskan untuk menggali lebih sedikit.
Mula-mula kami menyemak halaman NME di Charlie Puth.
Di luar kelawar, perkara pertama yang kami perhatikan ialah video pop timbul yang cuba memuatkan di sudut kanan bawah skrin. Ini jelas tidak melakukan pekerjaan yang sangat baik untuk dimuatkan. Video penimbal juga menyembunyikan sebahagian daripada tajuk berita dan badannya.
Seterusnya, kami perhatikan bahawa pandangan awal diduduki kebanyakannya oleh perkara yang tidak berkaitan dengan cerita berita. Terdapat iklan spanduk besar yang meliputi kira -kira separuh halaman, dan tentu saja ada video.
Malah, menatal ke halaman, kami menghadapi lebih banyak video, imej yang lebih besar, kaya, iklan pop timbul dan banyak hiperpautan. Memandangkan bagaimana halaman yang kaya dengan media itu, ia tidak mengejutkan sedikit masa untuk memuatkan.
Kami seterusnya memeriksa Daily Illini dan inilah yang kami dapati.
Halaman ini kemas, bersih dan rapi. Ia mempunyai bahagian iklan dan butang menderma besar di bahagian atas, tetapi tidak ada video atau pop timbul yang meliputi pandangan atau menghalang tajuk berita. Kita dapat melihat tajuk utama dengan segera, dan kemungkinan besar bahawa perkara yang sama berlaku untuk crawler web Google.
Pada keseluruhannya, halaman itu ringan, minimalis dan kilat cepat untuk dimuatkan.
Kami memutuskan untuk mengintip di bawah tudung lebih sedikit di kod asas. Dengan mengklik kanan pada halaman dan memilih Sumber Lihat (semasa menggunakan Chrome), kita dapat melihat kod halaman.
Inilah yang kita lihat untuk halaman NME:
Dua perkara menarik perhatian kami di sini:
Ini bukan perkara terbaik untuk halaman untuk dua sebab:
Apabila kita melihat kod untuk halaman Daily Illini di sisi lain, kita melihat ini:
Ini adalah kod HTML yang sangat mudah. Juga, tidak ada skrip yang berjalan di dalam<head> seksyen.
Bagaimanakah ini semua menambah Illini harian yang mengalahkan NME?
Mungkin terdapat beberapa faktor di tempat kerja di sini, dan salah satu di antara mereka adalah reka bentuk dan susun atur. Halaman Illini Daily menggunakan teknik reka bentuk dan susun atur tertentu yang walaupun penerbit kecil dapat meniru dengan mudah untuk meningkatkan strategi SEO keseluruhan mereka.
Ini termasuk menggunakan kod HTML yang bersih dan mudah, mengelakkan skrip di bahagian header, mengekalkan cahaya halaman dan cepat untuk memuatkan, dan tidak terlalu bergantung pada pop-up dan iklan interstisial.
Panduan di bawah menggali setiap satu daripada ini secara terperinci, sambil menjelaskan beberapa teknik lain yang boleh anda laksanakan untuk meningkatkan kedudukan SERP anda dengan ketara.
Semantik berkaitan dengan makna kata -kata. Tag HTML semantik adalah yang jelas menentukan makna mereka kepada pembaca dan crawler web.
Contohnya, apabila kita menggunakan tag seperti<header> , Kami tahu apa yang terkandung - maklumat mengenai tajuk.
Begitu juga<h1> adalah tag semantik yang memberitahu Googlebot bahawa apa yang berikut adalah tajuk yang paling penting dalam artikel itu.
Sebaliknya, ketika kita menggunakan tag seperti<div> , maknanya tidak begitu jelas. Dalam html<div> Berdiri untuk pembahagian, dan semua yang disebutkan adalah bahawa seksyen kod baru telah bermula, tanpa perlu mendedahkan apa -apa maklumat mengenai kandungan seksyen ini.
Crawler web seperti Googlebot dibina menggunakan kecerdasan buatan dan algoritma pembelajaran mesin yang cuba mensimulasikan fungsi otak manusia. Ini bermakna mereka memahami teks dengan cara yang sama seperti otak manusia.
Kod HTML yang mudah untuk difahami oleh manusia juga harus mudah bagi crawler web Google untuk memahami.
Sebagai contoh, pertimbangkan dua keping kod HTML di bawah:
Sumber: https://www.puralsight.com/guides/semantic-html
Halaman ini menggunakan<div> Tag untuk segala -galanya, dari header ke kandungan utama ke footer. Ia tidak jelas dengan membaca tag apa kandungannya.
Sebaliknya, halaman di bawah menggunakan markup semantik. Tajuk diletakkan di dalam<header> tag, footer dalam<footer> tag, dan badan utama artikel masuk dalam<main> tag.
Sumber: https://www.puralsight.com/guides/semantic-html
Oleh kerana ini mudah untuk dibaca dan difahami oleh Googlebot, halaman ini mempunyai peluang yang lebih baik untuk kedudukan yang lebih tinggi daripada yang sebelumnya, semua perkara lain menjadi sama.
Untuk melihat sama ada halaman anda menggunakan markup semantik, klik kanan pada halaman jika anda menggunakan Google Chrome, dan klik Periksa. Anda akan dapat melihat kod sumber HTML halaman. Unsur semantik biasa termasuk<author> ,<video> ,<article> ,<form> ,<header> , dll.
Sekarang kita tahu apa markup semantik dan mengapa ia penting. Tetapi bagaimana kita menggunakannya untuk memperbaiki SEO?
Ia mudah - sentiasa menggunakan markup semantik untuk menandakan maklumat penting mengenai reka bentuk dan susun atur artikel anda. Ini termasuk maklumat artikel berikut:
Pastikan susun atur halaman anda diperintahkan dengan baik untuk meningkatkan merangkak
Anda merancang laman web anda untuk dibaca oleh kedua -dua manusia dan crawler web dan, oleh itu, reka bentuk dan susun atur anda harus mencerminkan fakta ini.
Berikut adalah beberapa petua untuk membantu anda mencapai hasil yang boleh diukur untuk laman web anda.
Anda boleh menggunakan HTML, CSS, JavaScript atau bahasa frontend lain untuk mewujudkan halaman yang kaya dan interaktif. Walau bagaimanapun, ingat bahawa bahasa yang lebih maju, semakin kerumitannya, dan peluang yang lebih besar adalah bahawa crawler web mungkin sukar untuk membaca, mentafsir dan menyusun.
Apa -apa sahaja yang dikodkan dalam HTML mungkin bukan yang paling cantik untuk dilihat, tetapi ia akan dimuat lebih cepat dan lebih dioptimumkan untuk enjin carian untuk alasan mudah bahawa enjin carian dapat membaca dan memahaminya lebih cepat.
Fikirkan HTML biasa sebagai tulang tulang belakang halaman web anda. Anda boleh menambah CSS dan JavaScript untuk memakannya dan menjadikannya kelihatan estetika dan dinamik, tetapi lebih baik untuk menyimpan kandungan yang paling penting dalam kerangka dan bukannya meletakkannya dalam daging.
Jadi bagaimana kita melaksanakan HTML biasa? Satu cara mudah untuk melakukannya adalah meletakkan badan utama kandungan anda di dalam<article> Tag HTML.
Dengan cara ini, ketika crawler web menemui<article> Tag, mereka tahu dengan segera bahawa apa yang berikut adalah kandungan yang paling penting di halaman anda - artikel berita. Ini membantu enjin carian memahami bahawa kandungan yang dibungkus dalam tag ini perlu diberikan berat badan yang lebih besar.
HTML biasa<article> Tag adalah penanda semantik yang kelihatan seperti ini:
Sumber: https://en.wikipedia.org/wiki/article_element
Soalan jelas seterusnya? Sekiranya saya menggunakan CMS seperti WordPress, di mana saya memasukkan tag ini?
Bagaimana untuk melakukan ini: Jika anda membina laman web tersuai menggunakan HTML, maka anda boleh menyemak kod sumber untuk memastikan ia menggunakan HTML biasa, terutama di kawasan kritikal. Kami akan menasihati bercakap dengan lebih terperinci dengan pemaju untuk memastikan anda tidak memusnahkan fungsi secara tidak sengaja.
Jika anda menggunakan WordPress, maka rujuk panduan ini . Anda juga boleh mencari panduan ini mengenai cara memasukkan HTML ke dalam jawatan dan halaman sumber rujukan yang berguna.
Arahan ini adalah untuk WordPress kerana WordPress kekal sebagai CMS yang paling popular untuk penerbit. Jika anda menggunakan CMS yang berbeza seperti Wix, sila rujuk halaman sokongan atau dokumentasi untuk CMS anda.
Sekiranya anda mempunyai akses kepada pasukan pemaju web, lebih baik untuk melakukannya sebagai mengedit kod HTML boleh memakan masa.
Uji untuk memastikan kandungan anda muncul dengan betul dalam semua pelayar, peranti dan saiz. Ini lebih jelas tetapi sering diabaikan. Jika kandungan anda tidak kelihatan seperti yang anda mahukan di semua pelayar dan peranti, ia akan menjejaskan pengalaman pengguna, dan dalam jangka masa panjang, kedudukan SERP anda.
Bagaimana untuk melakukan ini: Untuk menguji kandungan di seluruh platform, anda perlu membuka halaman anda dalam peranti yang berbeza dan dalam pelayar yang berbeza untuk melihat bagaimana ia diberikan.
Sekurang -kurangnya, anda harus menguji perkara berikut:
HTML Markups membantu menyerlahkan unsur -unsur yang berbeza dari halaman anda. Data berstruktur membantu enjin carian membaca apa yang ada di dalam unsur -unsur yang berbeza dari halaman anda dan lebih memahami kandungannya.
Data berstruktur hanyalah satu siri arahan yang ditulis dalam bahasa yang mudah, seperti JSON-LD, yang boleh dimasukkan ke dalam kod HTML sedia ada laman web anda. Fikirkannya seperti penerangan meta, tetapi untuk kepingan kandungan individu pada halaman anda.
Dalam contoh di bawah, data berstruktur membantu Google mengenal pasti lima atribut mengenai halaman dbpedia di John Lennon:
Sumber: https://json-ld.org/
Seperti yang anda lihat, kod itu dalam bahasa mudah yang mudah untuk pembaca manusia dan crawler web untuk difahami.
Berikut adalah satu lagi contoh yang menunjukkan bagaimana data berstruktur boleh dimuatkan ke dalam kod HTML sedia ada laman web anda. Arahan data berstruktur diserlahkan dalam warna hijau.
Sumber: pemaju.google.com
Dalam contoh ini, data berstruktur memberitahu Googlebot bahawa ini adalah halaman resipi mengenai bentuk kek kopi seseorang yang dipanggil Mary Stone.
Menggunakan data berstruktur dalam susun atur laman web anda memberikan hasil yang boleh diukur. Sebagai contoh, menggunakan data berstruktur boleh meningkatkan kadar klik-melalui laman web (CTR) sehingga 30%.
Menggunakan data berstruktur juga membantu kedudukan halaman anda lebih baik pada karusel Google, coretan, video dan ciri panel pengetahuan.
Untuk Google News SEO, penting untuk memasukkan unsur -unsur berikut apabila membuat data berstruktur untuk memberikan nilai tambahan:
Bagaimana untuk melakukan ini: Anda boleh menambah data/skema berstruktur ke kandungan anda sama ada secara manual atau dengan menggunakan plugin untuk CMS tertentu anda.
Semua elemen artikel berita anda harus diatur dalam urutan tertentu untuk membolehkan merangkak lebih cepat dan lebih mudah. Pesanannya adalah seperti berikut:
Pengalaman halaman adalah ukuran bagaimana pengguna mengalami halaman anda. Google mempunyai satu set parameter untuk mengukur pengalaman halaman. Kami telah mendedikasikan keseluruhan modul untuk faktor pengalaman halaman , jadi kami hanya akan melihat secara ringkas setiap di sini.
Bagaimana untuk melakukan ini: Anda boleh menguji pengalaman halaman secara manual dan dengan menggunakan plugin atau aplikasi pihak ketiga. Sebagai contoh, Page Speed Insights adalah alat berguna yang membantu anda menganalisis prestasi tapak anda berdasarkan CWV dan parameter lain dan memberikan skor berdasarkan analisisnya. Ia juga menguji untuk respons mudah alih dan desktop.
Penerbit berita tidak boleh menerbitkan pelbagai artikel berita di bawah URL yang sama. Ini akan menghalang Google daripada mengindeks mereka. Setiap artikel berita harus mempunyai URL tersendiri.
Tambahan pula, URL ini harus kekal. Yang bermaksud bahawa cerita berita yang sama harus dipaparkan pada URL tertentu. Jika cerita berita yang dikaitkan dengan perubahan URL tertentu dengan kerap, Google tidak akan dapat merangkak dan mengindeksnya. Walau bagaimanapun, penerbit perlu mengemas kini cerita berita seberapa kerap yang diperlukan.
Sekiranya pengalihan perlu digunakan untuk artikel berita, mereka harus dilaksanakan mengikut amalan terbaik berikut:
Walaupun item tindakan yang disenaraikan dalam bahagian ini tidak begitu penting seperti yang di atas, kami masih mengesyorkan melaksanakan sebanyak mungkin sebaik sahaja mata kritikal misi yang disenaraikan di atas telah ditangani.
The<head> Elemen halaman mengandungi maklumat penting mengenai halaman yang sebenarnya tidak dipaparkan pada halaman. Apa yang termasuk adalah metadata yang membantu Googlebot mengenal pasti kandungan halaman dan mengklasifikasikannya.
Sebagai peraturan,<head> Unsur harus termasuk hanya tag yang paling penting dan tidak ada yang lain, jadi jawatan dapat merangkak dan diberikan dengan betul. Ini termasuk:
Apa sahaja yang terkandung dalam<head> Elemen mungkin mengelirukan crawler web.
Sebagai contoh, adalah perkara biasa bagi orang baru untuk mengelirukan tag tajuk dengan<h1> dan letakkan yang terakhir dalam<head> unsur. Seperti yang dijelaskan sebelum ini, the<head> elemen hanya boleh mengandungi metadata yang tidak dipaparkan pada halaman.
Walaupun tajuk dan<h1> mesti mengandungi maklumat yang sama pada asasnya, yang pertama adalah metadata yang dimaksudkan untuk perangkak web dan akan dipaparkan dalam hasil SERP dan tab penyemak imbas, manakala yang terakhir ialah maklumat yang akan dipaparkan pada halaman.
Kod di bawah menunjukkan cara meletakkan tajuk dalam<head> unsur.
Sumber: pemaju.mozilla.org
Menggunakan elemen halaman yang memudahkan untuk mengimbas kandungan dan menjadikan navigasi pengalaman geseran untuk pengguna juga memberi kesan kepada SEO.
Halaman yang mudah untuk menavigasi akan mengandungi unsur -unsur ini:
Kecuali anda seorang pemaju web yang berpengalaman, lebih baik untuk berunding dengan pakar dengan cara terbaik untuk melaksanakan UX yang mesra pengguna.
Google mahu penerbit memaparkan iklan tanpa mengganggu pengalaman pengguna. Atas sebab ini ia boleh menghukum laman web yang memaparkan terlalu banyak iklan mengganggu. Walaupun pengalaman pengguna adalah metrik subjektif, Google mempunyai garis panduan dan amalan terbaik tertentu ketika datang ke iklan.
Sebahagian daripada mereka berkaitan dengan:
Untuk lebih lanjut mengenai iklan dan popup, rujuk kepada modul terperinci .
JavaScript sangat bagus untuk mewujudkan kandungan dinamik dan interaktif tetapi crawler web mungkin mengalami kesukaran menjadikannya.
Ini kerana:
Dengan artikel berita, amalan yang baik untuk mengelakkan gangguan seperti karusel artikel yang berkaitan atau galeri imej.
Ramai penerbit yang menjadi prihatin apabila melancarkan semula/mendesain semula laman web mereka, kerana ia memerlukan Google untuk merekrut laman web ini. Ikuti amalan terbaik ini untuk memastikan peralihan yang lancar menjadi normal selepas reka bentuk semula/peluncuran semula:
Simpan halaman artikel anda sebagai cahaya yang mungkin. Kami telah melihat mengelakkan JavaScript dalam artikel, tetapi ia juga amalan yang baik untuk mengelakkan menggunakan kandungan HTML yang berat.
Ini kerana apabila Googlebot merangkak halaman anda, ia hanya boleh memuat turun maksimum 15 MB data halaman dalam merangkak pertama. Bagi kebanyakan halaman, ini bukan isu utama seperti item berat berat seperti video dan imej dirujuk secara berasingan dalam kod yang indeks Googlebot kemudian, dan dengan itu melampaui batas batas 15 MB ini.
Walau bagaimanapun, ini sekali lagi menunjukkan hakikat bahawa halaman anda yang lebih ringan, lebih mudah untuk Googlebot merangkak dan mengindeksnya.
Petua: Jika anda ingin menyemak saiz halaman anda, pergi ke halaman Alat Pemaju Pelayar anda, beralih ke tab Rangkaian, kemudian muat semula halaman. Ini memaparkan semua permintaan penyemak imbas yang dibuat untuk menjadikan halaman sepenuhnya. Permintaan pertama pada senarai ini menunjukkan saiz halaman anda di bawah lajur Saiz. Untuk kebanyakan halaman di Internet, angka ini biasanya dalam kilobytes.
Coretan artikel memberikan pembaca pratonton kandungan pada halaman sebelum mereka mengklik padanya. Google menentukan coretan untuk pergi dengan setiap artikel dengan merangkak teks dalam badan utama artikel tepat di bawah tajuk.
Untuk mengelakkan kemungkinan Googlebot termasuk coretan yang salah pastikan bahawa:
Kadang -kadang, Googlebot mungkin gagal mengindeks imej anda atau mengindeks imej yang berbeza daripada yang anda maksudkan untuk menampilkan artikel anda. Untuk mengelakkan ini, ikuti amalan terbaik ini:
Googlebot menggunakan tajuk artikel anda untuk mengenal pasti dan mengindeksnya dengan betul. Gunakan amalan terbaik berikut ini untuk memastikan ia membaca tajuk anda dengan tepat:
Mari kita lihat dua kajian kes tapak yang telah melaksanakan langkah -langkah yang dibincangkan dalam artikel ini.
Laman web berita moden adalah kompleks dan kaya, dan tidak realistik untuk mengharapkan mereka mematuhi garis panduan ini dengan ketat. Walau bagaimanapun, dalam bahagian ini kami cuba menunjukkan bagaimana mengikuti garis panduan boleh menghasilkan hasil yang boleh diramalkan dan boleh diukur.
The Manly Observer adalah laman web berita hyperlocal yang memenuhi khalayak di pinggir bandar pantai yang popular di Sydney, Australia. Berikut adalah artikel berita biasa di laman web ini:
Kami melihat unsur -unsur reka bentuk berikut yang jelas dan hadir pada pandangan pertama:
Melihat seterusnya pada kod HTML halaman, kita dapat melihat penggunaan markup semantik.
Ini adalah kod yang mudah dibaca oleh manusia. Adalah selamat untuk menganggap bahawa crawler web akan dapat membaca dan mentafsirkan kod ini dengan mudah.
Laman web ini menggunakan skema https: // dan tidak mempunyai iklan pop-up atau interstitial yang dimuatkan dalam pandangan awal.
Usahawan adalah majalah popular untuk usahawan dan perniagaan. Ini adalah bagaimana laman webnya muncul.
Laman web ini kilat cepat untuk dimuatkan dan tidak ada iklan atau video pop timbul di laman web itu sendiri. Kebanyakan penempatan iklan berlaku pada artikel berita individu.
Apabila kita mengklik untuk "Lihat Sumber", kita melihat kod HTML berikut:
Sekilas, kita boleh membuat perkara berikut dari kod ini:
Semasa kita menatal ke bawah, kita melihat elemen kod berikut:
Kami telah membincangkan penggunaan skema.org dan OpenGraph (OG) untuk imej. Untuk rekap, skema.org dan OG adalah jenis data berstruktur yang membantu crawler web mengenal pasti unsur -unsur tertentu kod dengan lebih mudah. Kami melihat skema.org dan OG dilaksanakan di sini.
Selanjutnya, kami juga melihat tag data berstruktur seperti yang ditunjukkan di bawah:
Seperti contoh terdahulu kami, Entrepreneur.com juga menggunakan skema https: // dalam pautannya, tidak mempunyai interstitial atau pop-up yang mengganggu, dan cepat dimuatkan. Artikel berita mengikuti format set tajuk, imej, atribusi pengarang, tarikh dan badan utama kandungan. Ini menghasilkan pengalaman halaman yang lebih baik dan dengan itu meningkatkan SEO teknikal.
Selepas bekerja melalui pelajaran ini, anda harus dapat mengkaji dan mengemas kini halaman berita sedia ada untuk mengoptimumkan reka bentuk dan susun atur mereka untuk mematuhi amalan terbaik SEO teknikal.
