[{"data":1,"prerenderedAt":349},["ShallowReactive",2],{"guide-web-encoding-tools":3},{"id":4,"title":5,"body":6,"date":339,"description":340,"extension":341,"meta":342,"navigation":343,"path":344,"readingTime":345,"seo":346,"stem":347,"__hash__":348},"guides\u002Fguides\u002Fweb-encoding-tools.md","Web Encoding Tools: HTML, URL, Base64 Compared",{"type":7,"value":8,"toc":318},"minimark",[9,14,34,37,41,122,126,131,134,147,151,154,165,169,172,183,187,190,205,209,213,224,228,231,235,238,242,270,274,277,300,304],[10,11,13],"h2",{"id":12},"why-web-encoding-matters","Why Web Encoding Matters",[15,16,17,18,22,23,22,26,29,30,33],"p",{},"Web pages contain text that browsers must interpret correctly. Special characters like ",[19,20,21],"code",{},"\u003C",", ",[19,24,25],{},">",[19,27,28],{},"&",", and ",[19,31,32],{},"\""," have meaning in HTML, URL, and JavaScript contexts. Encoding ensures these characters are treated as data — not markup or syntax.",[15,35,36],{},"Without proper encoding, pages break, links fail, and security vulnerabilities like XSS can slip in.",[10,38,40],{"id":39},"types-of-web-encoding","Types of Web Encoding",[42,43,44,60],"table",{},[45,46,47],"thead",{},[48,49,50,54,57],"tr",{},[51,52,53],"th",{},"Encoding",[51,55,56],{},"Purpose",[51,58,59],{},"Example",[61,62,63,80,94,108],"tbody",{},[48,64,65,69,72],{},[66,67,68],"td",{},"HTML entities",[66,70,71],{},"Safe display of special chars in HTML",[66,73,74,77,78],{},[19,75,76],{},"<"," → ",[19,79,21],{},[48,81,82,85,88],{},[66,83,84],{},"URL encoding",[66,86,87],{},"Safe characters in URLs",[66,89,90,93],{},[19,91,92],{},"%20"," → space",[48,95,96,99,102],{},[66,97,98],{},"Base64",[66,100,101],{},"Binary data as ASCII text",[66,103,104,107],{},[19,105,106],{},"SGVsbG8="," → \"Hello\"",[48,109,110,113,116],{},[66,111,112],{},"Unicode escapes",[66,114,115],{},"Represent any character in JS\u002FCSS",[66,117,118,121],{},[19,119,120],{},"\\u0041"," → \"A\"",[10,123,125],{"id":124},"when-to-use-each-encoding","When to Use Each Encoding",[127,128,130],"h3",{"id":129},"html-entity-encoding","HTML Entity Encoding",[15,132,133],{},"Use HTML encoding when you need to display characters that have special meaning in HTML markup:",[135,136,137,141,144],"ul",{},[138,139,140],"li",{},"User-generated content rendered in a page",[138,142,143],{},"Displaying code snippets",[138,145,146],{},"Showing mathematical symbols or foreign characters",[127,148,150],{"id":149},"url-encoding","URL Encoding",[15,152,153],{},"Use URL encoding when passing data in query strings, path segments, or fragment identifiers:",[135,155,156,159,162],{},[138,157,158],{},"Query parameters with spaces or special characters",[138,160,161],{},"Form submissions via GET",[138,163,164],{},"Building API URLs dynamically",[127,166,168],{"id":167},"base64-encoding","Base64 Encoding",[15,170,171],{},"Use Base64 when you need to represent binary data as text:",[135,173,174,177,180],{},[138,175,176],{},"Embedding images in HTML or CSS (Data URIs)",[138,178,179],{},"Email attachments (MIME)",[138,181,182],{},"API payloads that require text-safe binary transport",[127,184,186],{"id":185},"unicode-escapes","Unicode Escapes",[15,188,189],{},"Use Unicode escapes when you need to represent characters that cannot be typed directly or must be safe in string literals:",[135,191,192,195,202],{},[138,193,194],{},"JavaScript strings with rare characters",[138,196,197,198,201],{},"CSS ",[19,199,200],{},"content"," property values",[138,203,204],{},"JSON that must avoid certain code points",[10,206,208],{"id":207},"common-pitfalls","Common Pitfalls",[127,210,212],{"id":211},"double-encoding","Double Encoding",[15,214,215,216,219,220,223],{},"Encoding already-encoded data produces gibberish. For example, encoding ",[19,217,218],{},"&"," again gives ",[19,221,222],{},"&",". Always check whether data is already encoded before processing.",[127,225,227],{"id":226},"wrong-encoding-for-the-context","Wrong Encoding for the Context",[15,229,230],{},"Using URL encoding inside HTML attributes, or HTML encoding inside URLs, produces broken output. Match the encoding to the context where the data will be consumed.",[127,232,234],{"id":233},"encoding-vs-encryption","Encoding vs Encryption",[15,236,237],{},"Encoding transforms data for transport compatibility. It does not protect data from reading. Anyone can decode Base64 or HTML entities. Use encryption for confidentiality — not encoding.",[10,239,241],{"id":240},"encoding-workflow-tips","Encoding Workflow Tips",[243,244,245,252,258,264],"ol",{},[138,246,247,251],{},[248,249,250],"strong",{},"Encode at the boundary."," Encode data right before it enters a new context (HTML, URL, JavaScript).",[138,253,254,257],{},[248,255,256],{},"Decode only when needed."," Decode only right before the data is consumed.",[138,259,260,263],{},[248,261,262],{},"Never encode twice."," Track whether data has been encoded to avoid stacking.",[138,265,266,269],{},[248,267,268],{},"Test edge cases."," Try ampersands, angle brackets, non-ASCII characters, and emoji in your encoding pipeline.",[10,271,273],{"id":272},"try-it-yourself","Try It Yourself",[15,275,276],{},"Use the HTML Encoder tool to encode or decode HTML entities instantly. For URL encoding and Base64, try the URL Encoder and Base64 tools.",[135,278,279,287,294],{},[138,280,281,286],{},[282,283,285],"a",{"href":284},"\u002Ftools\u002Fhtml-encoder","HTML Encoder"," — Encode and decode HTML entities",[138,288,289,293],{},[282,290,292],{"href":291},"\u002Ftools\u002Furl-encoder","URL Encoder"," — Encode and decode URL components",[138,295,296,299],{},[282,297,98],{"href":298},"\u002Ftools\u002Fbase64"," — Encode and decode Base64 data",[10,301,303],{"id":302},"related-guides","Related Guides",[135,305,306,312],{},[138,307,308],{},[282,309,311],{"href":310},"\u002Fguides\u002Fhtml-encoding-guide","HTML Encoding Guide",[138,313,314],{},[282,315,317],{"href":316},"\u002Fguides\u002Fhtml-entity-reference","HTML Entity Reference",{"title":319,"searchDepth":320,"depth":320,"links":321},"",2,[322,323,324,331,336,337,338],{"id":12,"depth":320,"text":13},{"id":39,"depth":320,"text":40},{"id":124,"depth":320,"text":125,"children":325},[326,328,329,330],{"id":129,"depth":327,"text":130},3,{"id":149,"depth":327,"text":150},{"id":167,"depth":327,"text":168},{"id":185,"depth":327,"text":186},{"id":207,"depth":320,"text":208,"children":332},[333,334,335],{"id":211,"depth":327,"text":212},{"id":226,"depth":327,"text":227},{"id":233,"depth":327,"text":234},{"id":240,"depth":320,"text":241},{"id":272,"depth":320,"text":273},{"id":302,"depth":320,"text":303},"2026-05-28","Essential encoding and decoding tools every web developer needs — HTML, URL, Base64, and more compared.","md",{"immutable":343},true,"\u002Fguides\u002Fweb-encoding-tools",5,{"title":5,"description":340},"guides\u002Fweb-encoding-tools","4BU3X0Plt6f2WhCTQtgFRyHjHN8g2kNvxu79FOCeeZA",1780401330437]