Heading Checker

Paste HTML to see your H1 to H6 outline, catch skipped levels, empty or duplicate headings, and export a clean heading structure. Everything runs in your browser.

','','

','

','

Open Graph Tags: The Complete Guide

','

Open Graph tags control the title, description and image shown when your pages are shared on social platforms. This guide explains every property you need and how to test the result before publishing.

','

What are Open Graph tags?

','

They are meta tags placed in the head of a page. Platforms read them to build a link preview, which makes a clear and accurate set of tags worth the effort.

','

Required properties

','

Every page should define a title, a type, an image and a canonical URL so platforms can build a complete card.

','

Image sizes

','

A landscape image around 1200 by 630 pixels is a common starting point.

','

Image sizes

','

','

Testing your tags

','

Use the sharing debugger of each platform to refresh cached previews after you change a tag.

','

FREQUENTLY ASKED QUESTIONS ABOUT SOCIAL PREVIEWS AND METADATA

','

Final thoughts

','

Keep your tags short, accurate and consistent with the visible page content.

','

','',''].join('\n'); var LABELS={empty:'Empty headings',skip:'Skipped heading levels',hidden:'Hidden headings',long1:'Long H1 headings',long:'Long headings',short:'Very short headings',caps:'All-caps headings',dup:'Duplicate headings',nosec:'Headings with no text beneath'}; var A={heads:[],title:'',notes:[],intro:0,total:0,scope:'',analyzed:false},vis=[],mode='outline',timer=0,busy=false,dtimer=0; /* ---------- Parsing ---------- */ function textOf(n){ var s=''; (function w(x){ if(x.nodeType===3){s+=x.data;return;} if(x.nodeType!==1)return; var t=x.localName; if(t==='script'||t==='style'||t==='noscript'||t==='template')return; if(t==='img'){s+=' '+(x.getAttribute('alt')||'')+' ';return;} if(t==='br')s+=' '; for(var c=x.firstChild;c;c=c.nextSibling)w(c); })(n); return norm(s); } function isHidden(x){ for(var a=x;a&&a.nodeType===1;a=a.parentNode){ if(a.hasAttribute('hidden')||a.getAttribute('aria-hidden')==='true'||/display\s*:\s*none|visibility\s*:\s*hidden/i.test(a.getAttribute('style')||''))return true; } return false; } function wc(s){return s?s.split(/\s+/).length:0;} function add(h,k,sev,msg){h.issues.push({k:k,sev:sev,msg:msg});} function analyze(){ var r={heads:[],title:'',notes:[],intro:0,total:0,scope:'',analyzed:false},src=V('paste'); if(!src.trim())return r; if(src.indexOf('<')<0){r.notes.push('The pasted text contains no HTML tags, so no headings can be found. Paste the page source (for example from View Source).');return r;} r.analyzed=true; var doc=new DOMParser().parseFromString(src,'text/html'); var tt=doc.querySelector('title');r.title=tt?norm(tt.textContent):''; doc.querySelectorAll('script,style,noscript,template').forEach(function(n){n.remove();}); var scope; if($('mainOnly').checked){ doc.querySelectorAll('nav,aside,[role=navigation],[role=complementary]').forEach(function(n){if(n.parentNode)n.remove();}); doc.querySelectorAll('header,footer,[role=banner],[role=contentinfo]').forEach(function(n){if(n.parentNode&&!n.closest('main,article,[role=main]'))n.remove();}); scope=doc.querySelector('main,[role=main]'); r.scope=scope?'the

element':'the page body (no

found)'; if(!scope)scope=doc.body; }else{scope=doc.body;r.scope='the whole page body';} var sel='h1,h2,h3,h4,h5,h6'+($('roleHeading').checked?',[role=heading]':''); var nodes=[].slice.call(scope.querySelectorAll(sel)),skipH=$('skipHidden').checked; nodes.forEach(function(n){ var hid=isHidden(n);if(hid&&skipH)return; var m=/^h([1-6])$/.exec(n.localName),lvl; if(m)lvl=+m[1];else{lvl=parseInt(n.getAttribute('aria-level'),10);if(!(lvl>=1&&lvl<=6))lvl=2;} var text=textOf(n); n.__hi=r.heads.length; r.heads.push({i:r.heads.length,level:lvl,tag:m?n.localName.toUpperCase():'role=heading',text:text,chars:text.length,words:wc(text),hidden:hid,sec:0,issues:[]}); }); var cur=-1,w=doc.createTreeWalker(scope,NodeFilter.SHOW_ELEMENT|NodeFilter.SHOW_TEXT),n; while((n=w.nextNode())){ if(n.nodeType===1){if(n.__hi!=null)cur=n.__hi;continue;} var p=n.parentNode;if(!p||p.nodeType!==1||p.closest(sel))continue; var c=n.data.trim();if(!c)continue; var k=c.split(/\s+/).length; if(cur<0)r.intro+=k;else r.heads[cur].sec+=k; } var maxLen=parseInt(T('maxLen'),10)||70,seen={},prev=0; r.heads.forEach(function(h){var k=h.text.toLowerCase();if(k)seen[k]=(seen[k]||0)+1;}); r.heads.forEach(function(h,idx){ var next=r.heads[idx+1]; if(!h.text)add(h,'empty','bad','Heading is empty.'); if(prev&&h.level>prev+1)add(h,'skip','warn','Jumps from H'+prev+' to H'+h.level+' (no H'+(prev+1)+').'); if(h.hidden)add(h,'hidden','warn','Heading is hidden from view.'); if(h.chars>maxLen)add(h,h.level===1?'long1':'long',h.level===1?'warn':'tip','Heading is '+h.chars+' characters long (threshold '+maxLen+').'); if(h.text&&h.words===1&&h.chars<4)add(h,'short','tip','Heading is very short and may not describe the section.'); if(h.text&&(h.text.match(/[A-Za-z]/g)||[]).length>=8&&h.text===h.text.toUpperCase())add(h,'caps','tip','Heading is written in all capitals, which is harder to read.'); if(h.text&&seen[h.text.toLowerCase()]>1)add(h,'dup','warn','Same text is used by '+seen[h.text.toLowerCase()]+' headings.'); if(h.sec===0&&!(next&&next.level>h.level))add(h,'nosec','tip','No text appears under this heading before the next one.'); prev=h.level; }); r.total=r.intro+r.heads.reduce(function(a,h){return a+h.sec+h.words;},0); return r; } /* ---------- Diagnostics ---------- */ function diagnose(){ var L={bad:[],warn:[],tip:[],ok:[]},hs=A.heads; if(!A.analyzed){if(A.notes.length)A.notes.forEach(function(m){L.warn.push(m);});else L.tip.push('Paste HTML source or upload a file, then select Check headings.');return L;} L.tip.push('Analyzed '+A.scope+'. Page title: '+(A.title?'"'+A.title+'"':'not found')+'.'); if(!hs.length){L.bad.push('No headings were found. Add at least one H1 that describes the page.');return L;} var cnt=[0,0,0,0,0,0,0];hs.forEach(function(h){cnt[h.level]++;}); if(cnt[1]===0)L.bad.push('There is no H1. Add one clear H1 that names the page topic.'); else if(cnt[1]>1)L.warn.push('There are '+cnt[1]+' H1 headings. HTML allows this, but most SEO guidance recommends a single H1 per page.'); else L.ok.push('The page has exactly one H1.'); if(hs[0].level!==1)L.warn.push('The first heading is an H'+hs[0].level+', not an H1. The outline normally starts with the H1.'); var h1=hs.filter(function(h){return h.level===1;})[0]; if(h1&&A.title&&h1.text){if(h1.text.toLowerCase()===A.title.toLowerCase())L.ok.push('The H1 matches the page title.');else L.tip.push('The H1 and the