{"id":78,"date":"2024-10-16T23:41:24","date_gmt":"2024-10-17T03:41:24","guid":{"rendered":"http:\/\/localhost:4000\/?p=78"},"modified":"2024-11-15T00:11:03","modified_gmt":"2024-11-15T05:11:03","slug":"how-to-make-a-website-responsive","status":"publish","type":"post","link":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/","title":{"rendered":"How to Make a Website Responsive"},"content":{"rendered":"\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<p><a href=\"https:\/\/www.youtube.com\/watch?v=vQDgoQKfdzM\">https:\/\/www.youtube.com\/watch?v=vQDgoQKfdzM<\/a><\/p>\n\n\n\n<p>Creating a <strong>responsive website<\/strong> ensures that your content looks good across various devices, from small phone screens to large desktop monitors. Here&#8217;s a step-by-step guide to making your website responsive, including techniques for layout, images, and text.<\/p>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">1. Set up the HTML Viewport Meta Tag<\/h3>\n\n\n\n<p>This is crucial to ensure your website scales correctly on all devices.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;head&gt;\n  &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n&lt;\/head&gt;<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>What it does:<\/strong> This tag tells the browser to adjust the website&#8217;s dimensions based on the device\u2019s screen size.<\/li>\n\n\n\n<li>Without it, mobile browsers may render your website like a desktop site, making it look zoomed out or squished.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">2. Responsive Text Using CSS<\/h3>\n\n\n\n<p>You want <strong>text<\/strong> to be smaller on phones and larger on desktops for readability.<\/p>\n\n\n\n<p><strong>Option 1: Media Queries<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>h1 {\n  font-size: 2rem; \/* Default mobile size *\/\n}\n\n@media (min-width: 640px) {\n  h1 {\n    font-size: 3rem;\n  }\n}\n\n@media (min-width: 960px) {\n  h1 {\n    font-size: 4rem;\n  }\n}<\/code><\/pre>\n\n\n\n<p><strong>Option 2: CSS Clamp Function<\/strong><\/p>\n\n\n\n<p>Instead of media queries, you can use the <code>clamp()<\/code> function to make text adjust fluidly across screen sizes.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>h1 {\n  font-size: clamp(2rem, 5vw, 4rem);\n}<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Clamp parameters:<\/strong><\/li>\n\n\n\n<li>Minimum size: <code>2rem<\/code><\/li>\n\n\n\n<li>Preferred size: <code>5vw<\/code> (5% of viewport width)<\/li>\n\n\n\n<li>Maximum size: <code>4rem<\/code><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">3. Responsive Images<\/h3>\n\n\n\n<p>Images should resize to fit their containers while maintaining their aspect ratio.<\/p>\n\n\n\n<p><strong>Basic CSS for Responsive Images:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>img {\n  max-width: 100%;  \/* Prevents overflow *\/\n  height: auto;     \/* Maintains aspect ratio *\/\n}<\/code><\/pre>\n\n\n\n<p><strong>Using the <code>&lt;picture&gt;<\/code> tag for adaptive images:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;picture&gt;\n  &lt;source media=\"(min-width: 640px)\" srcset=\"large-image.jpg\"&gt;\n  &lt;img src=\"small-image.jpg\" alt=\"Responsive cat\"&gt;\n&lt;\/picture&gt;<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>How it works:<\/strong> The browser loads a different image based on the viewport width.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">4. Responsive Layouts with CSS Grid and Flexbox<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Option 1: CSS Grid for Complex Layouts<\/strong><\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>.container {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n  gap: 1rem;\n}<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Auto-fit and Min-Max:<\/strong> This layout adjusts the number of columns based on screen width without needing media queries.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Option 2: Flexbox for Flexible Layouts<\/strong><\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>.container {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 1rem;\n}\n\n.item {\n  flex: 1 1 240px; \/* Grow, shrink, and base size *\/\n}<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Flex wrap:<\/strong> Ensures elements move to the next row when they can\u2019t fit on the current row.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">5. Use Media Queries for Precise Control<\/h3>\n\n\n\n<p>Even with fluid layouts, media queries provide control over content at specific breakpoints.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>@media (min-width: 640px) {\n  .container {\n    grid-template-columns: repeat(2, 1fr);\n  }\n}\n\n@media (min-width: 960px) {\n  .container {\n    grid-template-columns: repeat(4, 1fr);\n  }\n}<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">6. Best Practices for Responsive Design<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Mobile-First Design:<\/strong> Start with the simplest mobile layout and enhance it for larger screens.<\/li>\n\n\n\n<li><strong>Optimize Images:<\/strong> Use lightweight images to improve load times, especially for mobile users.<\/li>\n\n\n\n<li><strong>Test on Real Devices:<\/strong> Simulate devices in your browser and test on actual phones and tablets.<\/li>\n\n\n\n<li><strong>Avoid Fixed Widths:<\/strong> Use percentages, <code>vw<\/code> (viewport width), and <code>em<\/code>\/<code>rem<\/code> units to ensure flexibility.<\/li>\n<\/ol>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">Example: Responsive Card Layout<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;div class=\"container\"&gt;\n  &lt;div class=\"card\"&gt;Card 1&lt;\/div&gt;\n  &lt;div class=\"card\"&gt;Card 2&lt;\/div&gt;\n  &lt;div class=\"card\"&gt;Card 3&lt;\/div&gt;\n  &lt;div class=\"card\"&gt;Card 4&lt;\/div&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code>.container {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n  gap: 1rem;\n}\n\n.card {\n  padding: 1rem;\n  background-color: #f0f0f0;\n  border-radius: 8px;\n}<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">7. Conclusion<\/h3>\n\n\n\n<p>Responsive web design is all about ensuring your site works well on all screen sizes. <strong>Use the viewport tag<\/strong>, media queries, <code>clamp()<\/code> for fonts, and CSS <strong>Grid\/Flexbox for layouts<\/strong>. These tools will help you create fluid, adaptable designs that provide a great user experience across devices.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p>This guide gives you a solid foundation to start making your website responsive. Do you need help with specific parts of the process or a live example?<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>https:\/\/www.youtube.com\/watch?v=vQDgoQKfdzM Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors. Here&#8217;s a step-by-step guide to making your website responsive, including techniques for layout, images, and text. 1. Set up the HTML Viewport Meta Tag This is crucial to ensure your website scales correctly [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":149,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[21,33,34,22,35,19,20],"class_list":["post-78","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tech","tag-css","tag-css3","tag-hmtl5","tag-html","tag-viewport","tag-web-design","tag-web-development"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Make a Website Responsive - My Tech Talks with ChatGPT<\/title>\n<meta name=\"description\" content=\"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Make a Website Responsive - My Tech Talks with ChatGPT\" \/>\n<meta property=\"og:description\" content=\"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\" \/>\n<meta property=\"og:site_name\" content=\"My Tech Talks with ChatGPT\" \/>\n<meta property=\"article:published_time\" content=\"2024-10-17T03:41:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-11-15T05:11:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"404\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"adminwp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"adminwp\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\"},\"author\":{\"name\":\"adminwp\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580\"},\"headline\":\"How to Make a Website Responsive\",\"datePublished\":\"2024-10-17T03:41:24+00:00\",\"dateModified\":\"2024-11-15T05:11:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\"},\"wordCount\":413,\"publisher\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580\"},\"image\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp\",\"keywords\":[\"css\",\"css3\",\"hmtl5\",\"html\",\"viewport\",\"web design\",\"web development\"],\"articleSection\":[\"Technology\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\",\"url\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\",\"name\":\"How to Make a Website Responsive - My Tech Talks with ChatGPT\",\"isPartOf\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp\",\"datePublished\":\"2024-10-17T03:41:24+00:00\",\"dateModified\":\"2024-11-15T05:11:03+00:00\",\"description\":\"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.\",\"breadcrumb\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage\",\"url\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp\",\"contentUrl\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp\",\"width\":720,\"height\":404,\"caption\":\"How to make your website responsive\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/zenteno.org\/tech-talks\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Make a Website Responsive\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#website\",\"url\":\"https:\/\/zenteno.org\/tech-talks\/\",\"name\":\"My Tech Talks with ChatGPT\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/zenteno.org\/tech-talks\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580\",\"name\":\"adminwp\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/IMG_1739.jpg\",\"contentUrl\":\"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/IMG_1739.jpg\",\"width\":512,\"height\":512,\"caption\":\"adminwp\"},\"logo\":{\"@id\":\"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/image\/\"},\"sameAs\":[\"http:\/\/localhost:4000\"],\"url\":\"https:\/\/zenteno.org\/tech-talks\/author\/adminwp\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Make a Website Responsive - My Tech Talks with ChatGPT","description":"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/","og_locale":"en_US","og_type":"article","og_title":"How to Make a Website Responsive - My Tech Talks with ChatGPT","og_description":"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.","og_url":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/","og_site_name":"My Tech Talks with ChatGPT","article_published_time":"2024-10-17T03:41:24+00:00","article_modified_time":"2024-11-15T05:11:03+00:00","og_image":[{"width":720,"height":404,"url":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp","type":"image\/webp"}],"author":"adminwp","twitter_card":"summary_large_image","twitter_misc":{"Written by":"adminwp","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#article","isPartOf":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/"},"author":{"name":"adminwp","@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580"},"headline":"How to Make a Website Responsive","datePublished":"2024-10-17T03:41:24+00:00","dateModified":"2024-11-15T05:11:03+00:00","mainEntityOfPage":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/"},"wordCount":413,"publisher":{"@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580"},"image":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage"},"thumbnailUrl":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp","keywords":["css","css3","hmtl5","html","viewport","web design","web development"],"articleSection":["Technology"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/","url":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/","name":"How to Make a Website Responsive - My Tech Talks with ChatGPT","isPartOf":{"@id":"https:\/\/zenteno.org\/tech-talks\/#website"},"primaryImageOfPage":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage"},"image":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage"},"thumbnailUrl":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp","datePublished":"2024-10-17T03:41:24+00:00","dateModified":"2024-11-15T05:11:03+00:00","description":"Creating a responsive website ensures that your content looks good across various devices, from small phone screens to large desktop monitors.","breadcrumb":{"@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#primaryimage","url":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp","contentUrl":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/hq720.webp","width":720,"height":404,"caption":"How to make your website responsive"},{"@type":"BreadcrumbList","@id":"https:\/\/zenteno.org\/tech-talks\/how-to-make-a-website-responsive\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/zenteno.org\/tech-talks\/"},{"@type":"ListItem","position":2,"name":"How to Make a Website Responsive"}]},{"@type":"WebSite","@id":"https:\/\/zenteno.org\/tech-talks\/#website","url":"https:\/\/zenteno.org\/tech-talks\/","name":"My Tech Talks with ChatGPT","description":"","publisher":{"@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/zenteno.org\/tech-talks\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/b6442e8a5e39de0647f2ecf534e18580","name":"adminwp","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/image\/","url":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/IMG_1739.jpg","contentUrl":"https:\/\/zenteno.org\/tech-talks\/wp-content\/uploads\/2024\/10\/IMG_1739.jpg","width":512,"height":512,"caption":"adminwp"},"logo":{"@id":"https:\/\/zenteno.org\/tech-talks\/#\/schema\/person\/image\/"},"sameAs":["http:\/\/localhost:4000"],"url":"https:\/\/zenteno.org\/tech-talks\/author\/adminwp\/"}]}},"_links":{"self":[{"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/posts\/78","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/comments?post=78"}],"version-history":[{"count":2,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/posts\/78\/revisions"}],"predecessor-version":[{"id":150,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/posts\/78\/revisions\/150"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/media\/149"}],"wp:attachment":[{"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/media?parent=78"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/categories?post=78"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zenteno.org\/tech-talks\/wp-json\/wp\/v2\/tags?post=78"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}