{"id":695,"date":"2026-10-30T13:39:31","date_gmt":"2026-10-30T12:39:31","guid":{"rendered":"https:\/\/webbay.pl\/blog\/?p=695"},"modified":"2026-10-30T17:18:09","modified_gmt":"2026-10-30T16:18:09","slug":"hosting-html","status":"publish","type":"post","link":"https:\/\/webbay.pl\/blog\/2026\/10\/30\/hosting-html\/","title":{"rendered":"Hosting HTML: publikacja strony i 4 cz\u0119ste b\u0142\u0119dy"},"content":{"rendered":"\n<style>\n\/* Styl lokalny dla szkicu WebBay. Tre\u015b\u0107 pozostaje w blokach Gutenberg\/Kadence. *\/\nbody.page-id-8{background:#fff}\nbody.page-id-8 .content-area{margin-top:0;margin-bottom:0}\nbody.page-id-8 .site-container,body.page-id-8 .content-container{max-width:none;padding:0}\nbody.page-id-8 .entry-content-wrap{padding:0}\nbody.page-id-8 .entry-content{margin:0}\n.wb-premium{--wb-ink:#183451;--wb-text:#40566c;--wb-blue:#287cde;--wb-action:#2168bc;--wb-line:#dce8f3;color:var(--wb-ink);background:#fff;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;font-size:17px;line-height:1.65;width:100%;isolation:isolate}\n.wb-premium *{box-sizing:border-box}\n.wb-premium{margin:0!important}\n.wb-premium .wp-block-group{margin-block:0}\n.wb-premium .wp-block-group__inner-container{display:contents}\n.wb-premium .wp-block-group__inner-container>*{margin-block-start:0}\n.wb-premium p,.wb-premium h1,.wb-premium h2,.wb-premium h3,.wb-premium .wp-block-group{margin-top:0}\n.wb-premium p{color:var(--wb-text);margin-bottom:16px}\n.wb-premium h1,.wb-premium h2,.wb-premium h3{color:var(--wb-ink);font-family:inherit;font-weight:700;letter-spacing:-.035em}\n.wb-premium h1{font-size:clamp(38px,4.25vw,62px);line-height:1.1;margin:22px 0 24px}\n.wb-premium h1 span{color:#2168bc}\n.wb-premium h2{font-size:clamp(30px,3vw,42px);line-height:1.18;margin-bottom:18px}\n.wb-premium h3{font-size:22px;line-height:1.3;margin-bottom:12px}\n.wb-premium a{color:#2168bc;text-decoration-thickness:1px;text-underline-offset:4px}\n.wb-premium a:hover{color:#183451}\n.wb-premium a:focus-visible,.wb-premium summary:focus-visible,.wb-premium input:focus-visible,.wb-premium button:focus-visible{outline:3px solid #183451;outline-offset:4px}\n.wb-premium [id]{scroll-margin-top:30px}\n.wb-wrap{max-width:1216px!important;padding:0 32px;margin:0 auto!important}\n.wb-header{background:#fff;border-bottom:1px solid #e7eff7}\n.wb-header-inner{display:flex;align-items:center;gap:30px;min-height:94px}\n.wb-brand{margin:0!important;white-space:nowrap}\n.wb-brand a{font-size:31px;font-weight:800;letter-spacing:-1.6px;line-height:1;text-decoration:none!important;color:#183451!important;display:inline-flex;align-items:center;min-height:44px}\n.wb-brand span{color:#287cde}\n.wb-brand small{font-size:10px;letter-spacing:1.5px;font-weight:700;color:#40566c;border-left:1px solid #cbdcec;padding:7px 0 7px 12px;margin-left:12px}\n.wb-desktop-nav{margin-left:auto!important}\n.wb-nav-links{display:flex;gap:24px;margin:0!important;align-items:center}\n.wb-nav-links a{color:#334d66;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap;padding:12px 0}\n.wb-header-cta{margin:0!important}\n.wb-header-cta a{display:block;border:1px solid #cbdeef;border-radius:8px;padding:10px 15px;text-decoration:none;font-size:14px;font-weight:700;white-space:nowrap;color:#183451}\n.wb-header-cta span{margin-left:9px;color:#2168bc}\n.wb-mobile-menu{display:none}\n.wb-hero{padding:76px 0 44px;background:radial-gradient(ellipse at 85% 8%,#dceeff 0%,transparent 53%),linear-gradient(120deg,#fff 0%,#f2f8ff 100%);border-bottom:1px solid #e7eff7}\n.wb-premium .wb-hero-grid>.kt-row-column-wrap{grid-template-columns:1.4fr 1fr;gap:64px;padding:0;align-items:center}\n.wb-kicker{color:#2168bc!important;font-size:11px;font-weight:800;letter-spacing:1.7px;line-height:1.6;margin:0 0 17px!important}\n.wb-hero-kicker{display:inline-flex;align-items:center;gap:9px}\n.wb-hero-kicker:before{content:\"\";width:7px;height:7px;border-radius:100%;background:#287cde;box-shadow:0 0 0 4px #dceeff;flex-shrink:0}\n.wb-premium .wb-lead{font-size:18px;line-height:1.75;max-width:580px;margin-bottom:28px}\n.wb-buttons{gap:12px!important;display:flex;align-items:center;flex-wrap:wrap;margin:24px 0 0}\n.wb-premium .wb-buttons .wp-block-button{margin:0}\n.wb-premium .wp-block-button__link{font-size:14px;font-weight:700;line-height:1.4;border:1px solid transparent;border-radius:8px;padding:16px 20px;text-decoration:none;box-shadow:none;transition:background .15s,color .15s,box-shadow .15s}\n.wb-primary .wp-block-button__link{background:#2168bc!important;color:#fff!important;box-shadow:0 6px 16px #2168bc20!important}\n.wb-primary .wp-block-button__link:hover{background:#183451!important}\n.wb-secondary .wp-block-button__link{background:#fff!important;border-color:#cbddec!important;color:#183451!important}\n.wb-secondary .wp-block-button__link:hover{background:#eaf4ff!important}\n.wb-proof{font-size:12px;margin:22px 0 0!important;color:#40566c!important}\n.wb-proof span{padding:0 7px;color:#2168bc}\n.wb-plan-card{position:relative;isolation:isolate;background:#fff;border:1px solid #d2e4f5;border-radius:24px;box-shadow:0 22px 60px #184b7d12;padding:32px;transform:rotate(1deg)}\n.wb-plan-card:before{content:\"\";position:absolute;inset:14px -12px -12px 14px;z-index:-1;border:1px solid #c8dff5;border-radius:24px;background:transparent;transform:rotate(-3deg)}\n.wb-premium .wb-plan-title{font-size:28px;line-height:1.23;margin-bottom:24px}\n.wb-step{display:flex;gap:15px;padding:18px 0;border-top:1px solid #e6eef6}\n.wb-step-number{background:#f2f8ff;border:1px solid #dceeff;border-radius:11px;flex:0 0 40px;height:40px;display:flex;align-items:center;justify-content:center;color:#2168bc!important;font-size:12px;font-weight:800;margin:0!important}\n.wb-step-copy{min-width:0}\n.wb-premium .wb-step h3{font-size:16px;letter-spacing:-.02em;margin:0 0 5px}\n.wb-step p:not(.wb-step-number){font-size:13px;line-height:1.6;margin:0}\n.wb-plan-note{font-size:11px;border-top:1px solid #e6eef6;padding-top:18px;margin:0!important}\n.wb-search-panel{margin:58px 0 0!important;background:#fff;border:1px solid #dce8f3;border-radius:16px;display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:center;padding:26px 30px;box-shadow:0 8px 22px #18345104}\n.wb-search-caption h2{font-size:21px;margin:0 0 4px;letter-spacing:-.02em}\n.wb-search-caption p{font-size:14px;margin:0}\n.wb-search .wp-block-search__label{font-size:11px;color:#40566c;display:block;margin-bottom:6px;font-weight:700}\n.wb-search .wp-block-search__inside-wrapper{gap:8px}\n.wb-search .wp-block-search__input{min-width:0;width:100%;border:1px solid #738ba3!important;border-radius:7px;padding:12px 14px;font-family:inherit;font-size:14px;color:#183451;background:#fff;height:48px}\n.wb-search .wp-block-search__input::placeholder{color:#596e82;opacity:1}\n.wb-search .wp-block-search__button{background:#183451;color:#fff;font-size:14px;font-weight:700;border:0;border-radius:7px;margin:0;padding:10px 20px;height:48px}\n.wb-section{padding:86px 0}\n.wb-intro{max-width:700px;margin:0 0 38px!important}\n.wb-section-lead{font-size:17px;line-height:1.75;max-width:640px}\n.wb-premium .wb-use-grid>.kt-row-column-wrap{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:0;align-items:stretch}\n.wb-use-grid .wp-block-kadence-column>.kt-inside-inner-col{height:100%}\n.wb-use-card{height:100%;padding:28px;background:#fff;border:1px solid #dce8f3;border-radius:16px;box-shadow:0 5px 14px #18345103;transition:box-shadow .15s,border-color .15s}\n.wb-use-card:hover{border-color:#9ebfe0;box-shadow:0 12px 26px #18345109}\n.wb-card-label{font-size:10px;font-weight:800;letter-spacing:1.25px;color:#2168bc!important;margin:0 0 24px!important}\n.wb-use-card h3{font-size:22px;margin-bottom:10px}\n.wb-use-card>p:not(.wb-card-label){font-size:14px;min-height:68px;margin-bottom:18px}\n.wb-card-details{border-top:1px solid #e3edf6;padding-top:16px;font-size:13px;margin:0}\n.wb-card-details summary{font-size:13px;color:#2168bc;font-weight:700;cursor:pointer;min-height:28px;list-style:none}\n.wb-card-details summary:after{content:\"+\";float:right;font-size:18px;line-height:22px}\n.wb-card-details[open] summary:after{content:\"\u2212\"}\n.wb-card-details p{margin:12px 0 0}\n.wb-featured:has(.wp-block-query-no-results){display:none}\n.wb-cost{background:linear-gradient(110deg,#f2f8ff,#e7f2ff);border-block:1px solid #dce8f3}\n.wb-premium .wb-cost-grid>.kt-row-column-wrap{grid-template-columns:1fr 1.12fr;gap:80px;padding:0;align-items:start}\n.wb-cost-item{display:flex;gap:20px;border-bottom:1px solid #cbdff2;padding:22px 0}\n.wb-cost-item:first-child{padding-top:0}\n.wb-cost-item:last-child{border:0;padding-bottom:0}\n.wb-cost-number{font-weight:700;color:#2168bc!important;font-size:13px;flex:0 0 24px;margin:3px 0 0}\n.wb-cost-item h3{font-size:20px;margin:0 0 8px}\n.wb-cost-item p:not(.wb-cost-number){font-size:14px;margin:0}\n.wb-source-note{font-size:11px;margin:32px 0 0!important;padding-top:22px;border-top:1px solid #cbdff2;line-height:1.7}\n.wb-faq-list{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;align-items:start}\n.wb-faq{border:1px solid #dce8f3;border-radius:12px;background:#fff;padding:21px 24px;margin:0}\n.wb-faq summary{font-size:16px;font-weight:650;line-height:1.5;color:#183451;cursor:pointer;list-style:none;position:relative;padding-right:28px;min-height:26px}\n.wb-faq summary:after{content:\"+\";position:absolute;right:0;top:0;color:#2168bc;font-size:22px;font-weight:400}\n.wb-faq[open]{background:#f7fbff;border-color:#bed6ed}\n.wb-faq[open] summary:after{content:\"\u2212\"}\n.wb-faq p{font-size:14px;line-height:1.8;margin:16px 0 0}\n.wb-premium summary::-webkit-details-marker{display:none}\n.wb-directory{background:#f8fbff;border-block:1px solid #e5eef6}\n.wb-operator-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}\n.wb-operator{display:flex;align-items:center;justify-content:center;min-height:74px;border:1px solid #dce8f3;border-radius:10px;background:#fff;font-size:17px;font-weight:700;letter-spacing:-.03em;color:#334d66!important;margin:0!important}\n.wb-directory-bottom{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-top:26px!important}\n.wb-directory-note{max-width:620px;font-size:12px;margin:0!important}\n.wb-text-cta{font-size:13px;font-weight:700;flex-shrink:0;margin:0!important}\n.wb-empty{border:1px dashed #bdd3e8;border-radius:16px;background:linear-gradient(110deg,#f7fbff,#fff);padding:32px;max-width:none}\n.wb-empty-title{font-size:20px;font-weight:700;color:#183451!important;margin-bottom:8px!important}\n.wb-empty p{font-size:15px;max-width:720px}\n.wb-empty p:last-child{margin:0;font-weight:700;font-size:14px}\n.wb-query .wb-post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}\n.wb-post-grid>.wp-block-post{border:1px solid #dce8f3;border-radius:16px;padding:24px;overflow:hidden}\n.wb-post-grid .wp-block-post-featured-image{margin:-24px -24px 20px}\n.wb-post-grid .wp-block-post-featured-image img{width:100%;aspect-ratio:16\/9;object-fit:cover}\n.wb-post-category{font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}\n.wb-post-grid .wp-block-post-title{font-size:22px;margin:0 0 14px}\n.wb-post-grid .wp-block-post-title a{color:#183451;text-decoration:none}\n.wb-post-grid .wp-block-post-excerpt{font-size:14px}\n.wb-method{background:linear-gradient(110deg,#f2f8ff,#fff);border-top:1px solid #dce8f3}\n.wb-premium .wb-method-grid>.kt-row-column-wrap{grid-template-columns:1fr 1.12fr;gap:80px;padding:0}\n.wb-method h3{font-size:20px;margin:0 0 10px}\n.wb-method h3:not(:first-child){margin-top:26px}\n.wb-method-grid .wp-block-kadence-column:last-child p{font-size:14px}\n.wb-method-note{padding-left:16px;border-left:3px solid #287cde;margin-top:24px}\n.wb-footer{background:#fff;border-top:1px solid #dce8f3;padding:52px 0 0}\n.wb-footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px;padding-bottom:44px}\n.wb-footer-tagline{font-size:15px;margin:18px 0 0!important}\n.wb-footer-column h3{font-size:13px;letter-spacing:0;margin-bottom:16px}\n.wb-footer-column p{font-size:13px;margin-bottom:9px}\n.wb-footer-column a{text-decoration:none;color:#40566c;display:inline-block;padding:4px 0}\n.wb-footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e5edf5;padding-top:20px;padding-bottom:20px}\n.wb-footer-bottom p{font-size:11px;margin:0}\n.wb-footer-bottom a{color:#40566c;text-decoration:none}\n@media(max-width:1100px){.wb-header-inner{gap:22px}.wb-nav-links{gap:16px}.wb-nav-links a{font-size:12px}.wb-header-cta a{font-size:12px;padding:10px}.wb-premium .wb-hero-grid>.kt-row-column-wrap{gap:36px}.wb-plan-card{padding:25px}.wb-premium h1{font-size:49px}.wb-premium .wb-cost-grid>.kt-row-column-wrap,.wb-premium .wb-method-grid>.kt-row-column-wrap{gap:44px}.wb-directory-bottom{gap:24px}.wb-text-cta{flex-shrink:1}}\n@media(max-width:900px){.wb-header-inner{min-height:82px;flex-wrap:wrap;padding-top:15px;padding-bottom:15px;gap:12px 24px}.wb-desktop-nav{order:3;width:100%;margin-left:0!important}.wb-nav-links{justify-content:space-between}.wb-nav-links a{font-size:13px;padding:4px 0}.wb-header-cta{margin-left:auto!important}.wb-hero{padding-top:48px}.wb-premium .wb-hero-grid>.kt-row-column-wrap{grid-template-columns:1fr;gap:38px}.wb-premium h1{font-size:52px;max-width:670px}.wb-premium .wb-lead{max-width:650px}.wb-plan-card{transform:none;max-width:none;padding:28px}.wb-plan-card:before{display:none}.wb-plan-card .wb-plan-title{font-size:24px}.wb-plan-card .wb-plan-title br{display:none}.wb-step{padding:16px 0}.wb-plan-card .wb-step h3{font-size:17px}.wb-step p:not(.wb-step-number){font-size:14px}.wb-search-panel{margin-top:32px!important;gap:24px;grid-template-columns:1fr;padding:24px}.wb-section{padding:64px 0}.wb-premium .wb-use-grid>.kt-row-column-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.wb-use-card{padding:24px}.wb-premium .wb-cost-grid>.kt-row-column-wrap,.wb-premium .wb-method-grid>.kt-row-column-wrap{grid-template-columns:1fr;gap:34px}.wb-premium h2 br{display:none}.wb-operator-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.wb-query .wb-post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wb-directory-bottom{align-items:start;flex-direction:column;gap:14px}.wb-footer-top{grid-template-columns:1.2fr 1fr 1fr;gap:24px}.wb-faq{padding:20px}.wb-faq summary{font-size:15px}}\n@media(max-width:600px){.wb-wrap{padding-left:20px;padding-right:20px}.wb-header-inner{min-height:76px;position:relative;gap:10px}.wb-brand a{font-size:27px}.wb-brand small{font-size:8px;margin-left:9px;padding-left:9px;letter-spacing:1px}.wb-desktop-nav,.wb-header-cta{display:none}.wb-mobile-menu{display:block;margin:0 0 0 auto!important}.wb-mobile-menu>summary{cursor:pointer;list-style:none;border:1px solid #b8cee2;border-radius:7px;padding:8px 13px;font-size:13px;color:#183451;font-weight:700;min-height:42px}.wb-mobile-menu>summary:after{content:\" +\";padding-left:7px;color:#2168bc}.wb-mobile-menu[open]>summary:after{content:\" \u2212\"}.wb-mobile-menu[open]{width:100%;margin:0!important}.wb-mobile-menu[open]>summary{position:absolute;right:20px;top:17px}.wb-mobile-menu .wb-nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid #dce8f3;margin-top:8px!important}.wb-mobile-menu .wb-nav-links a{padding:12px 4px;border-bottom:1px solid #e7eff7;font-size:14px}.wb-mobile-menu>p:last-child{margin:12px 0 4px;font-size:14px;font-weight:700}.wb-hero{padding:35px 0 28px}.wb-kicker{font-size:10px;letter-spacing:1.3px}.wb-hero-kicker{font-size:8.5px;letter-spacing:1.1px;gap:8px}.wb-premium h1{font-size:39px;line-height:1.12;letter-spacing:-.045em;margin:19px 0 22px}.wb-premium .wb-lead{font-size:16px;line-height:1.8;margin-bottom:22px}.wb-buttons{gap:10px!important;margin-top:20px}.wb-buttons .wp-block-button{width:100%}.wb-premium .wp-block-button__link{width:100%;padding:15px 14px;font-size:14px}.wb-proof{font-size:10px;line-height:1.9;margin-top:18px!important}.wb-proof span{padding:0 3px}.wb-premium .wb-hero-grid>.kt-row-column-wrap{gap:28px}.wb-plan-card{padding:25px 22px;border-radius:17px}.wb-plan-card .wb-plan-title{font-size:24px;line-height:1.25;margin-bottom:20px}.wb-step{gap:13px}.wb-step-number{flex-basis:34px;height:34px;font-size:11px}.wb-plan-card .wb-step h3{font-size:15px}.wb-step p:not(.wb-step-number){font-size:12px}.wb-plan-note{font-size:10px;line-height:1.7}.wb-search-panel{padding:22px 18px;border-radius:13px;margin-top:24px!important;gap:20px}.wb-search-caption h2{font-size:20px}.wb-search-caption p{font-size:13px}.wb-search .wp-block-search__input{font-size:12px;padding:11px 10px}.wb-search .wp-block-search__button{font-size:12px;padding:10px 15px}.wb-search .wp-block-search__inside-wrapper{gap:7px}.wb-section{padding:52px 0}.wb-premium h2{font-size:31px;line-height:1.2;letter-spacing:-.035em;margin-bottom:16px}.wb-section-lead{font-size:15px}.wb-intro{margin-bottom:28px!important}.wb-premium .wb-use-grid>.kt-row-column-wrap{grid-template-columns:1fr;gap:14px}.wb-use-card{padding:25px;border-radius:14px}.wb-card-label{margin-bottom:19px!important}.wb-use-card h3{font-size:23px}.wb-use-card>p:not(.wb-card-label){min-height:0;font-size:15px}.wb-card-details summary{font-size:14px;min-height:30px}.wb-card-details p{font-size:14px}.wb-premium .wb-cost-grid>.kt-row-column-wrap,.wb-premium .wb-method-grid>.kt-row-column-wrap{gap:32px}.wb-cost-item{gap:13px}.wb-cost-item h3{font-size:21px}.wb-cost-item p:not(.wb-cost-number){font-size:14px}.wb-source-note{font-size:11px}.wb-faq-list{grid-template-columns:1fr;gap:11px}.wb-faq{padding:21px 18px}.wb-faq summary{font-size:15px}.wb-operator-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wb-operator{min-height:64px;font-size:16px}.wb-directory-note{font-size:12px}.wb-text-cta{font-size:14px}.wb-empty{padding:25px 22px}.wb-empty .wb-empty-title{font-size:20px}.wb-empty p{font-size:14px}.wb-query .wb-post-grid{grid-template-columns:1fr}.wb-method h3{font-size:21px}.wb-method-grid .wp-block-kadence-column:last-child p{font-size:14px}.wb-footer{padding-top:36px}.wb-footer-top{grid-template-columns:1fr 1fr;gap:30px 18px;padding-bottom:30px}.wb-footer-brand{grid-column:1\/-1}.wb-footer-tagline{font-size:14px;margin-top:12px!important}.wb-footer-tagline br{display:none}.wb-footer-column h3{font-size:14px}.wb-footer-column p{font-size:12px}.wb-footer-column a{overflow-wrap:anywhere}.wb-footer-bottom{flex-direction:column;gap:8px;padding-top:18px;padding-bottom:24px}}\n@media(max-width:359px){.wb-wrap{padding-left:16px;padding-right:16px}.wb-premium h1{font-size:35px}.wb-hero-kicker{font-size:7.5px;letter-spacing:.7px}.wb-premium h2{font-size:28px}.wb-plan-card{padding:22px 18px}.wb-use-card{padding:23px}.wb-search-panel{padding:19px 15px}.wb-proof{font-size:9px}.wb-search .wp-block-search__button{padding:10px 11px}.wb-mobile-menu[open]>summary{right:16px}.wb-footer-top{gap:28px 15px}.wb-operator{font-size:15px}}\n@media(prefers-reduced-motion:reduce){.wb-premium *{transition:none!important;scroll-behavior:auto!important}}\n\/* Nadpisanie stylu przycisku wyszukiwania z motywu, tylko w tym projekcie. *\/\n.wb-premium .wb-search .wp-block-search__button{background:#183451!important;color:#fff!important;border:1px solid #183451!important}\n.wb-premium .wb-search .wp-block-search__button:hover{background:#2168bc!important;border-color:#2168bc!important}\n.wb-premium .wb-empty .wb-empty-title{font-size:20px}\n@media(max-width:600px){.wb-hero-kicker{font-size:10px;letter-spacing:1px}.wb-proof{font-size:11px}.wb-plan-note{font-size:11px}.wb-card-label{font-size:11px}.wb-source-note{font-size:12px}.wb-footer-bottom p{font-size:12px}}\n\n.wb-article{--wb-ink:#183451;--wb-text:#40566c;background:#fff;color:var(--wb-text)}\n.wb-article .wb-article-main{max-width:900px;margin:0 auto;padding:58px 36px 72px;min-width:0;font-size:18px;line-height:1.8}\n.wb-article .wb-article-main>*,.wb-article .wb-article-main>.wp-block-group__inner-container>*{margin:0 0 24px}\n.wb-article .wb-article-main h1{font-size:clamp(31px,4.1vw,55px);line-height:1.13;letter-spacing:-1.7px;color:#183451;margin:18px 0 26px;font-weight:750;max-width:none}\n.wb-article .wb-article-main h2{font-size:31px;line-height:1.24;letter-spacing:-.6px;margin:54px 0 20px;color:#183451;scroll-margin-top:36px}\n.wb-article .wb-article-main h3{font-size:24px;line-height:1.3;margin:34px 0 16px;color:#183451}\n.wb-article .wb-article-main a{color:#2168bc;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}\n.wb-article .wb-article-main p{font-size:inherit;line-height:inherit;color:inherit}\n.wb-article .wb-article-main .wb-article-lead{font-size:21px;line-height:1.65;color:#183451}\n.wb-article .wb-article-main .wb-article-meta{font-size:14px;color:#40566c;border-top:1px solid #dce6ef;padding-top:20px}\n.wb-article .wb-article-main .wb-article-disclosure,.wb-article .wb-article-main .wb-article-note{font-size:15px;line-height:1.7;background:#f2f8ff;padding:20px 24px;border-radius:14px}\n.wb-article .wb-article-main .wp-block-image{margin:32px 0;max-width:100%}\n.wb-article .wb-article-main .wp-block-image img{height:auto;width:100%;display:block;border-radius:20px}\n.wb-article .wb-article-main .wb-article-diagram{max-width:700px;margin:40px auto}\n.wb-article .wb-article-main figcaption{color:#40566c;font-size:14px;line-height:1.6;margin-top:12px;text-align:left}\n.wb-article .wb-article-main .wb-toc{background:#f2f8ff;border:1px solid #dceeff;border-radius:18px;padding:26px 26px 26px 52px;columns:2;column-gap:42px;font-size:16px;line-height:1.6}\n.wb-article .wb-article-main li{padding-left:4px;margin-bottom:11px;break-inside:avoid}\n.wb-article .wb-article-main ul,.wb-article .wb-article-main ol{margin-left:0;padding-left:26px}\n.wb-article .wb-article-main .wp-block-table{max-width:100%;margin:28px 0;overflow-x:auto;border:1px solid #dce6ef;border-radius:14px}\n.wb-article .wb-article-main table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.65;table-layout:fixed;margin:0;border:0}\n.wb-article .wb-article-main th,.wb-article .wb-article-main td{padding:15px 13px;border:0;border-bottom:1px solid #dce6ef;vertical-align:top;overflow-wrap:break-word;hyphens:auto;text-align:left}\n.wb-article .wb-article-main th{background:#e8f3ff;color:#183451;font-weight:700}\n.wb-article .wb-article-main tr:nth-child(even){background:#f8fbff}\n.wb-article .wb-article-main .wp-block-table figcaption{padding:12px 16px;margin:0;background:#f2f8ff;font-size:13px}\n.wb-article .wb-article-main .wb-final-cta{padding:28px;border-radius:18px;background:linear-gradient(120deg,#f2f8ff,#dceeff);text-align:center}\n.wb-article .wb-article-main .wb-final-cta a{display:inline-block;padding:15px 23px;background:#2168bc;color:white;border-radius:10px;text-decoration:none;font-weight:700;line-height:1.5}\n.wb-article .wb-article-main code{font-size:.9em;color:#183451;background:#eef4fa;padding:2px 5px}\n.wb-article .wb-article-main strong{color:#183451}\n.wb-article .wb-article-main .wb-kicker{font-size:12px;letter-spacing:1.1px;line-height:1.6;color:#2168bc}\nbody:has(.wb-article) .entry-related,body:has(.wb-article) .post-navigation,body:has(.wb-article) .entry-author,body:has(.wb-article) .comments-area{display:none}\n@media(max-width:767px){.wb-article .wb-article-main{padding:36px 24px 48px;font-size:17px;line-height:1.8}.wb-article .wb-article-main h1{letter-spacing:-.9px}.wb-article .wb-article-main h2{font-size:27px;margin-top:42px}.wb-article .wb-article-main .wb-article-lead{font-size:19px}.wb-article .wb-article-main .wb-toc{columns:1;padding:23px 24px 23px 44px}.wb-article .wb-article-main .wb-final-cta{padding:20px}.wb-article .wb-article-main table{font-size:13px;line-height:1.6}.wb-article .wb-article-main th,.wb-article .wb-article-main td{padding:10px 7px}.wb-article .wb-article-main .wb-article-note,.wb-article .wb-article-main .wb-article-disclosure{padding:16px}}\n@media(max-width:359px){.wb-article .wb-article-main{padding:30px 16px 42px}.wb-article .wb-article-main h1{font-size:30px}.wb-article .wb-article-main h2{font-size:25px}.wb-article .wb-article-main table{font-size:12px}.wb-article .wb-article-main th,.wb-article .wb-article-main td{padding:9px 5px}.wb-article .wb-article-main .wb-final-cta a{padding:13px}}\n\n\n\/* Etap 3: oryginalny znak WebBay, zachowane proporcje. *\/\n.wb-premium .wb-brand{margin:0!important;flex-shrink:0}\n.wb-premium .wb-brand img{display:block;width:180px!important;height:auto!important;max-width:100%;border-radius:0}\n.wb-premium .wb-brand a{display:block;line-height:0}\n.wb-article .wb-mid-cta{background:linear-gradient(120deg,#f2f8ff,#dceeff);border:1px solid #d1e4f7;border-radius:18px;padding:28px;margin:32px 0!important}\n.wb-article .wb-mid-cta h3{margin:0 0 12px;font-size:26px}\n.wb-article .wb-mid-cta p{margin:0 0 18px}\n.wb-article .wb-mid-cta .wp-block-button__link{color:#fff!important;text-decoration:none!important}\n@media(max-width:600px){.wb-premium .wb-brand img{width:156px!important}.wb-article .wb-mid-cta{padding:22px}.wb-article .wb-mid-cta h3{font-size:24px}}\n\n<\/style>\n\n\n<div id=\"poczatek\" class=\"wp-block-group wb-premium wb-article\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<header class=\"wp-block-group wb-header\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<div class=\"wp-block-group wb-wrap wb-header-inner\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<figure class=\"wp-block-image size-full wb-brand\"><a href=\"https:\/\/webbay.pl\/blog\/\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"200\" src=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster.jpg\" alt=\"WebBay \u2014 strona g\u0142\u00f3wna bloga\" class=\"wp-image-24\" srcset=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster.jpg 600w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster-300x100.jpg 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/figure>\n\n\n<nav class=\"wp-block-group wb-desktop-nav\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p class=\"wb-nav-links wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#zastosowania\">Zastosowania<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#koszty\">Ceny i odnowienia<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#problemy\">Pomoc<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#operatorzy\">Operatorzy<\/a><\/p>\n\n<\/div><\/nav>\n\n\n<details class=\"wp-block-details wb-mobile-menu is-layout-flow wp-block-details-is-layout-flow\"><summary>Menu<\/summary>\n<p class=\"wb-nav-links wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#zastosowania\">Zastosowania<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#koszty\">Ceny i odnowienia<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#problemy\">Pomoc<\/a> <a href=\"https:\/\/webbay.pl\/blog\/#operatorzy\">Operatorzy<\/a><\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/ranking-hostingow\/\">Ranking hosting\u00f3w \u2192<\/a><\/p>\n\n<\/details>\n\n\n<p class=\"wb-header-cta wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/ranking-hostingow\/\">Zobacz ranking <span aria-hidden=\"true\">\u2197<\/span><\/a><\/p>\n\n<\/div><\/div>\n\n<\/div><\/header>\n\n\n<div class=\"wp-block-group wb-article-main\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n\n<h1 class=\"wp-block-heading\">Hosting HTML: publikacja strony i 4 cz\u0119ste b\u0142\u0119dy<\/h1>\n\n\n<p class=\"wp-block-paragraph\">Hosting HTML ma udost\u0119pni\u0107 gotowe pliki HTML, CSS i JavaScript; taka strona nie potrzebuje WordPressa ani bazy danych. Potrzebujesz us\u0142ugi, kt\u00f3ra udost\u0119pni pliki pod publicznym adresem przez HTTPS. Wybierz platform\u0119 statyczn\u0105, je\u015bli masz same pliki i potrafisz je aktualizowa\u0107, albo zwyk\u0142y hosting WWW, gdy chcesz w jednym pakiecie tak\u017ce skrzynki pocztowe, obs\u0142ug\u0119 PHP lub pomoc przy konfiguracji.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Najwa\u017cniejsze pytanie brzmi: czy witryna tylko wy\u015bwietla informacje, czy r\u00f3wnie\u017c wykonuje zadania po stronie serwera? Formularz, kt\u00f3ry rzeczywi\u015bcie dor\u0119cza wiadomo\u015b\u0107, logowanie u\u017cytkownik\u00f3w i przechowywanie zam\u00f3wie\u0144 wymagaj\u0105 dodatkowego zaplecza. Sam wygl\u0105d formularza w HTML takiego zaplecza nie tworzy.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" loading=\"eager\" decoding=\"async\" src=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-okladka-premium.webp\" alt=\"Plik HTML, strza\u0142ka przesy\u0142ania i karty strony obok koperty kontaktowej\" width=\"1200\" height=\"675\" class=\"wp-image-694\" srcset=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-okladka-premium.webp 1200w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-okladka-premium-300x169.webp 300w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-okladka-premium-1024x576.webp 1024w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-okladka-premium-768x432.webp 768w\" sizes=\"(max-width: 1200px) 100vw, 1200px\" \/><\/figure>\n\n\n<h2 id=\"spis-tresci\" class=\"wp-block-heading\">W tym poradniku<\/h2>\n\n\n<ol class=\"wp-block-list wb-toc\"><li><a href=\"#co-kupujesz\">Co oznacza hosting HTML i czego nie zawiera automatycznie?<\/a><\/li><li><a href=\"#wybor-uslugi\">Hosting HTML: platforma statyczna czy zwyk\u0142e WWW?<\/a><\/li><li><a href=\"#cloudflare-kroki\">Przyk\u0142ad: wgranie gotowych plik\u00f3w do Cloudflare Pages<\/a><\/li><li><a href=\"#bledy\">Hosting HTML: 4 cz\u0119ste b\u0142\u0119dy po wgraniu strony<\/a><\/li><li><a href=\"#przyklad-sciezek\">Przyk\u0142ad naprawy \u015bcie\u017cek obraz\u00f3w<\/a><\/li><li><a href=\"#odbior-formularza\">Jak odebra\u0107 dzia\u0142aj\u0105cy formularz?<\/a><\/li><li><a href=\"#formularze-poczta\">Formularz i poczta: dwie osobne decyzje<\/a><\/li><li><a href=\"#github-warunki\">Dlaczego nie polecam ka\u017cdemu firmowemu projektowi GitHub Pages?<\/a><\/li><li><a href=\"#lista-odbioru\">Kr\u00f3tka lista odbioru strony HTML<\/a><\/li><\/ol>\n\n\n<h2 id=\"co-kupujesz\" class=\"wp-block-heading\">Co oznacza hosting HTML i czego nie zawiera automatycznie?<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Przegl\u0105darka pobiera pliki HTML, arkusze styl\u00f3w, skrypty i obrazy. Przy stronie statycznej serwer nie musi generowa\u0107 ka\u017cdej podstrony z bazy. Nadal odpowiadasz za tre\u015b\u0107, aktualizacj\u0119 u\u017cywanych bibliotek, dost\u0119pno\u015b\u0107 link\u00f3w i kopi\u0119 \u017ar\u00f3de\u0142. Brak WordPressa zmniejsza liczb\u0119 element\u00f3w do utrzymania, lecz nie oznacza braku jakichkolwiek obowi\u0105zk\u00f3w.<\/p>\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>Potrzeba<\/th><th>Strona z samych plik\u00f3w<\/th><th>Co sprawdzi\u0107 przed wyborem<\/th><\/tr><\/thead><tbody><tr><td>Wizyt\u00f3wka, portfolio, cennik us\u0142ug<\/td><td>Zwykle wystarczy<\/td><td>W\u0142asna domena, HTTPS, aktualizacja plik\u00f3w i warunki wykorzystania<\/td><\/tr><tr><td>Poczta kontakt@twoja-domena.pl<\/td><td>Nie wynika z hostingu statycznego<\/td><td>Oddzielna us\u0142uga e-mail lub pakiet WWW ze skrzynkami<\/td><\/tr><tr><td>Formularz kontaktowy<\/td><td>Potrzebuje dzia\u0142aj\u0105cego odbiorcy \u017c\u0105dania<\/td><td>Backend albo us\u0142uga formularzy, ochrona przed spamem i przetwarzanie danych<\/td><\/tr><tr><td>Skrypt PHP i baza MySQL<\/td><td>Nie zadzia\u0142aj\u0105 jako zwyk\u0142e pliki statyczne<\/td><td>Hosting z odpowiednim \u015brodowiskiem wykonawczym<\/td><\/tr><tr><td>Sklep z koszykiem i p\u0142atno\u015bci\u0105<\/td><td>Frontend mo\u017ce by\u0107 statyczny, transakcja nie<\/td><td>Platforma sprzeda\u017cowa lub w\u0142asny bezpieczny backend<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n<p class=\"wp-block-paragraph\">Je\u015bli nie masz jeszcze gotowych plik\u00f3w, zacznij od <a href=\"https:\/\/webbay.pl\/blog\/2026\/10\/29\/jak-zalozyc-strone-internetowa\/\">wyboru sposobu wykonania strony<\/a>. Tutaj zak\u0142adamy, \u017ce witryna ju\u017c istnieje i chcesz j\u0105 poprawnie umie\u015bci\u0107 w internecie.<\/p>\n\n\n<h2 id=\"wybor-uslugi\" class=\"wp-block-heading\">Hosting HTML: platforma statyczna czy zwyk\u0142e WWW?<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Platforma statyczna pasuje do osoby, kt\u00f3ra dostaje od wykonawcy gotowy katalog strony albo samodzielnie korzysta z generatora plik\u00f3w. Aktualizacja polega wtedy na ponownym wdro\u017ceniu wersji. Hosting HTML w klasycznym pakiecie WWW mo\u017ce by\u0107 wygodniejszy dla ma\u0142ej firmy potrzebuj\u0105cej r\u00f3wnocze\u015bnie kilku skrzynek, panelu i obs\u0142ugi technicznej. Sam fakt, \u017ce oferta reklamuje WordPressa, nie wyklucza strony HTML; potwierd\u017a jednak w\u0142asn\u0105 domen\u0119, katalog publikacji i spos\u00f3b przesy\u0142ania plik\u00f3w.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Nie por\u00f3wnuj wy\u0142\u0105cznie ceny serwera. Zapisz osobno koszt domeny, poczty, formularza i pracy przy aktualizacjach. Darmowe miejsce na pliki nie oznacza bezp\u0142atnej domeny, skrzynek ani dowolnych zastosowa\u0144. Przy zwyk\u0142ym hostingu WWW <a href=\"https:\/\/webbay.pl\/ranking-hostingow\/\">ranking WebBay pomo\u017ce por\u00f3wna\u0107 operator\u00f3w i warunki pakiet\u00f3w<\/a>; nie jest zestawieniem wszystkich platform statycznych.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Przyk\u0142ad: fotograf ma 12 podstron i 80 zdj\u0119\u0107. Nie potrzebuje kont u\u017cytkownik\u00f3w, przyjmuje zapytania telefonicznie i aktualizuje portfolio raz w miesi\u0105cu. To dobry kandydat do statycznego wdro\u017cenia. Je\u017celi dodaje formularz rezerwacji ze stanem dost\u0119pno\u015bci, problemem przestaje by\u0107 liczba plik\u00f3w \u2014 pojawia si\u0119 obs\u0142uga danych i logika rezerwacji.<\/p>\n\n\n<h2 id=\"cloudflare-kroki\" class=\"wp-block-heading\">Przyk\u0142ad: wgranie gotowych plik\u00f3w do Cloudflare Pages<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Poni\u017csza \u015bcie\u017cka dotyczy r\u0119cznego Direct Upload. Wymaga w\u0142asnego konta Cloudflare i uprawnie\u0144 do projektu. Nie wymaga przenoszenia dzia\u0142aj\u0105cej domeny na etapie pr\u00f3by. Wed\u0142ug dokumentacji sprawdzonej 30.10.2026 projekt utworzony w ten spos\u00f3b nie mo\u017ce zosta\u0107 p\u00f3\u017aniej prze\u0142\u0105czony na integracj\u0119 Git; dla niej powstaje nowy projekt.<\/p>\n\n\n<ol class=\"wp-block-list\"><li>Przygotuj katalog zawieraj\u0105cy <code>index.html<\/code>, pliki CSS, JavaScript i obrazy. Usu\u0144 kopie robocze, has\u0142a, pliki konfiguracyjne zaplecza oraz dane klient\u00f3w. Nie wgrywaj ca\u0142ego dysku ani katalogu projektu z niepotrzebnymi materia\u0142ami.<\/li><li>W panelu wybierz <strong>Workers &amp; Pages \u2192 Create application \u2192 Get started \u2192 Drag and drop your files<\/strong>.<\/li><li>Nazwij projekt i przeci\u0105gnij katalog strony albo przygotowane archiwum. Plik <code>index.html<\/code> ma by\u0107 na najwy\u017cszym poziomie publikowanych plik\u00f3w, a nie w dodatkowym katalogu nadrz\u0119dnym.<\/li><li>Wybierz <strong>Deploy site<\/strong>, a nast\u0119pnie odpowiedni krok zapisu i wdro\u017cenia pokazany przez panel. Otw\u00f3rz otrzymany adres <code>nazwa-projektu.pages.dev<\/code>.<\/li><li>Sprawd\u017a stron\u0119 g\u0142\u00f3wn\u0105 i ka\u017cd\u0105 podstron\u0119, zdj\u0119cia, menu, polskie znaki i wersj\u0119 telefonu. Zapisz lokaln\u0105 kopi\u0119 dok\u0142adnie tej wersji.<\/li><\/ol>\n\n\n<p class=\"wp-block-paragraph\">R\u0119czne przeci\u0105ganie ma limit 1000 plik\u00f3w i 25 MiB na pojedynczy plik. Du\u017cy film nie powinien trafi\u0107 tu jako przypadkowy plik obok HTML. Przy wi\u0119kszej witrynie wybierz w\u0142a\u015bciwy spos\u00f3b wdra\u017cania lub osobne przechowywanie multimedi\u00f3w. R\u0119czny upload z panelu nie kompiluje katalogu Pages Functions, wi\u0119c nie traktuj go jako gotowej drogi do w\u0142asnego backendu.<\/p>\n\n\n<h3 id=\"poprawki\" class=\"wp-block-heading\">Jak wprowadzi\u0107 zmian\u0119 bez zgubienia poprzedniej wersji?<\/h3>\n\n\n<p class=\"wp-block-paragraph\">Edytuj \u017ar\u00f3d\u0142a lokalnie, sprawd\u017a ca\u0142\u0105 stron\u0119 i utw\u00f3rz now\u0105 wersj\u0119 przez <strong>Create a new deployment<\/strong>. Wybierz podgl\u0105d, je\u015bli chcesz najpierw obejrze\u0107 poprawk\u0119. Nie zaczynaj od zmiany DNS dzia\u0142aj\u0105cej witryny. W\u0142asn\u0105 domen\u0119 pod\u0142\u0105cz dopiero po sprawdzeniu wdro\u017cenia, zgodnie z dokumentacj\u0105 us\u0142ugi i obecn\u0105 konfiguracj\u0105 domeny; nie usuwaj przy tym rekord\u00f3w poczty. Sam adres domeny i skrzynki s\u0105 osobnymi us\u0142ugami.<\/p>\n\n\n<h2 id=\"bledy\" class=\"wp-block-heading\">Hosting HTML: 4 cz\u0119ste b\u0142\u0119dy po wgraniu strony<\/h2>\n\n\n<ul class=\"wp-block-list\"><li><strong>404 na stronie g\u0142\u00f3wnej:<\/strong> sprawd\u017a po\u0142o\u017cenie i nazw\u0119 <code>index.html<\/code>. Wgrywanie nadrz\u0119dnego katalogu zamiast jego zawarto\u015bci mo\u017ce zmieni\u0107 \u015bcie\u017ck\u0119.<\/li><li><strong>Brak zdj\u0119\u0107 lub styl\u00f3w:<\/strong> usu\u0144 odwo\u0142ania do lokalnego dysku, np. <code>C:\\projekt\\zdjecie.jpg<\/code>. U\u017cywaj \u015bcie\u017cek odpowiadaj\u0105cych strukturze opublikowanych katalog\u00f3w i zgodnej wielko\u015bci liter.<\/li><li><strong>Dzia\u0142a menu, ale nie formularz:<\/strong> sprawd\u017a jego <code>action<\/code> albo rzeczywiste wywo\u0142anie API. HTML nie jest us\u0142ug\u0105 wysy\u0142ania wiadomo\u015bci. Je\u015bli formularz korzysta z w\u0142asnego skryptu PHP, sprawd\u017a tak\u017ce <a href=\"https:\/\/webbay.pl\/blog\/2026\/10\/30\/hosting-php-mysql\/\">wymagania hostingu PHP i zaplecza aplikacji<\/a>.<\/li><li><strong>Podstrona dzia\u0142a po klikni\u0119ciu, ale nie po od\u015bwie\u017ceniu:<\/strong> ustal, czy masz osobne pliki, czy aplikacj\u0119 JavaScript z routingiem. Dla aplikacji potrzebne mog\u0105 by\u0107 w\u0142a\u015bciwe regu\u0142y obs\u0142ugi \u015bcie\u017cek, nie kolejne kopie <code>index.html<\/code> tworzone na \u015blepo.<\/li><\/ul>\n\n\n<h2 id=\"przyklad-sciezek\" class=\"wp-block-heading\">Przyk\u0142ad: jedna strona dzia\u0142a, a podstrona traci zdj\u0119cia<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Wyobra\u017a sobie niewielkie portfolio z plikami <code>index.html<\/code>, <code>oferta\/index.html<\/code>, <code>assets\/site.css<\/code> i <code>assets\/portret.webp<\/code>. Nazwy oraz katalogi s\u0105 przyk\u0142adowe. Fotograf otrzymuje ca\u0142\u0105 paczk\u0119 od wykonawcy i chce j\u0105 opublikowa\u0107 bez zmiany wygl\u0105du. Zaczyna od kopii tej paczki, a nie od przenoszenia pojedynczych plik\u00f3w w przypadkowe miejsca.<\/p>\n\n\n<p class=\"wp-block-paragraph\">W g\u0142\u00f3wnym <code>index.html<\/code> zapis <code>assets\/portret.webp<\/code> prowadzi do katalogu obok tego dokumentu. W zagnie\u017cd\u017conym <code>oferta\/index.html<\/code> ten sam zapis wskazuje ju\u017c katalog <code>oferta\/assets<\/code>. Je\u017celi go nie ma, obraz si\u0119 nie wczyta. Dla tego przyk\u0142adu poprawne odwo\u0142anie z podstrony to <code>..\/assets\/portret.webp<\/code>. Pocz\u0105tkowe <code>..<\/code> oznacza wyj\u015bcie o jeden poziom wy\u017cej. To naprawa konkretnej struktury, a nie uniwersalny fragment do wklejenia do ka\u017cdej witryny.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Alternatywa <code>\/assets\/portret.webp<\/code> zaczyna \u015bcie\u017ck\u0119 w korzeniu domeny. Jest wygodna, je\u015bli projekt zawsze zajmuje ca\u0142\u0105 domen\u0119. Mo\u017ce jednak przesta\u0107 pasowa\u0107, gdy p\u00f3\u017aniej umie\u015bcisz go pod <code>example.org\/portfolio\/<\/code>. Ustal jeden model z wykonawc\u0105. Nie mieszaj bez potrzeby pe\u0142nych adres\u00f3w, \u015bcie\u017cek wzgl\u0119dem domeny i \u015bcie\u017cek wzgl\u0119dem dokumentu. Nie zmieniaj hurtowo uko\u015bnik\u00f3w, dop\u00f3ki nie wiesz, z kt\u00f3rego dokumentu powstaje b\u0142\u0119dne \u017c\u0105danie.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Rozstrzygnij problem w przegl\u0105darce: otw\u00f3rz brakuj\u0105cy obraz w nowej karcie albo sprawd\u017a jego adres w narz\u0119dziach deweloperskich, w karcie sieci. Por\u00f3wnaj \u017c\u0105dany adres z rzeczywistym po\u0142o\u017ceniem pliku. Je\u017celi nazwa jest poprawna, sprawd\u017a jeszcze wielko\u015b\u0107 liter i rozszerzenie: <code>Portret.webp<\/code> oraz <code>portret.webp<\/code> nie powinny by\u0107 u\u017cywane zamiennie. Nast\u0119pnie popraw \u017ar\u00f3d\u0142o odwo\u0142ania, wdr\u00f3\u017c wersj\u0119 podgl\u0105dow\u0105 i otw\u00f3rz bezpo\u015brednio r\u00f3wnie\u017c podstron\u0119 oferty. Nie wystarczy, \u017ce obraz wygl\u0105da dobrze na stronie g\u0142\u00f3wnej.<\/p>\n\n\n<p class=\"wp-block-paragraph\">W Cloudflare Pages <code>oferta\/index.html<\/code> jest udost\u0119pniany pod \u015bcie\u017ck\u0105 <code>\/oferta\/<\/code>. Pojedynczy plik <code>oferta.html<\/code> mo\u017ce prowadzi\u0107 do wariantu bez rozszerzenia. Dlatego kopiuj ko\u0144cowy adres z rzeczywi\u015bcie otwartej strony. Zapisz obok niego adres przyk\u0142adowego obrazu i CSS; te trzy odno\u015bniki tworz\u0105 prost\u0105 kontrol\u0119 po nast\u0119pnej aktualizacji. Szczeg\u00f3lne zasady routingu aplikacji JavaScript trzeba oceni\u0107 oddzielnie od tej prostej witryny z osobnymi plikami.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2.webp\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2.webp\" alt=\"Hosting HTML: \u015bcie\u017cka obrazu assets ze strony g\u0142\u00f3wnej, b\u0142\u0119dne oferta\/assets i poprawne ..\/assets z podstrony\" width=\"1000\" height=\"1242\" class=\"wp-image-797\" srcset=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2.webp 1000w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2-242x300.webp 242w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2-824x1024.webp 824w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/webbay-wb73-diagram-praktyczny-v2-768x954.webp 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a><figcaption class=\"wp-element-caption\">Wariant \/assets\/portret.webp zaczyna od korzenia domeny, nie od katalogu dokumentu. Sprawd\u017a go ponownie przy publikacji pod \/portfolio\/.<\/figcaption><\/figure>\n\n\n<h2 id=\"odbior-formularza\" class=\"wp-block-heading\">Odbi\u00f3r formularza: wy\u015bwietlony przycisk to dopiero pocz\u0105tek<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Przed testem wybierz skrzynk\u0119, kt\u00f3r\u0105 kontrolujesz, i jedn\u0105 rozpoznawaln\u0105 tre\u015b\u0107, na przyk\u0142ad \u201ePr\u00f3ba formularza \u2014 portfolio\u201d. Nie wysy\u0142aj wielu zg\u0142osze\u0144 i nie u\u017cywaj cudzych danych. Najpierw sprawd\u017a, czy pusty wymagany e-mail wywo\u0142uje zrozumia\u0142y komunikat. Potem wykonaj jedn\u0105 prawid\u0142ow\u0105 pr\u00f3b\u0119. Zapisz, czy pojawi\u0142a si\u0119 informacja o wys\u0142aniu, czy wiadomo\u015b\u0107 rzeczywi\u015bcie dotar\u0142a oraz gdzie trafi\u0142a odpowied\u017a po klikni\u0119ciu \u201eOdpowiedz\u201d w poczcie.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Je\u017celi formularz pokazuje sukces bez odebranej wiadomo\u015bci, sprawd\u017a wynik us\u0142ugi przyjmuj\u0105cej zg\u0142oszenia, ustawienia odbiorcy i folder spamu. Sam status pomy\u015blnego \u017c\u0105dania HTTP nie jest dowodem dostarczenia do skrzynki. Je\u017celi zg\u0142oszenie odrzucono, nie usuwaj zabezpiecze\u0144 przeciw spamowi tylko po to, by komunikat znikn\u0105\u0142. Przeka\u017c wykonawcy czas pr\u00f3by i widoczny b\u0142\u0105d, bez has\u0142a do poczty. Do czasu naprawy podaj sprawny telefon lub inny rzeczywisty kontakt; nie zostawiaj czytelnika z przyciskiem, kt\u00f3ry jedynie udaje wysy\u0142anie.<\/p>\n\n\n<h2 id=\"formularze-poczta\" class=\"wp-block-heading\">Formularz i poczta: dwie osobne decyzje<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Nie umieszczaj has\u0142a SMTP ani prywatnego klucza API w JavaScript \u2014 pliki otrzymuje przegl\u0105darka u\u017cytkownika. Formularz powinien korzysta\u0107 z serwera lub us\u0142ugi przygotowanej do publicznego przyjmowania zg\u0142osze\u0144. Sprawd\u017a walidacj\u0119, zabezpieczenie przed spamem, potwierdzenie b\u0142\u0119du i dostarczenie wiadomo\u015bci. Link <code>mailto:<\/code> mo\u017ce otworzy\u0107 program pocztowy odwiedzaj\u0105cego, ale nie gwarantuje wysy\u0142ki i nie zast\u0119puje formularza.<\/p>\n\n\n<p class=\"wp-block-paragraph\">Dobierz informacj\u0119 o przetwarzaniu danych i zakres formularza do jego rzeczywistego dzia\u0142ania. Nie zbieraj niepotrzebnych danych. Skrzynk\u0119 we w\u0142asnej domenie kup lub zachowaj niezale\u017cnie od miejsca publikacji HTML; praktyczn\u0105 stron\u0119 opisuje poradnik <a href=\"https:\/\/webbay.pl\/blog\/2026\/10\/28\/poczta-firmowa-we-wlasnej-domenie\/\">o firmowej poczcie<\/a>.<\/p>\n\n\n<h2 id=\"github-warunki\" class=\"wp-block-heading\">Dlaczego nie polecam ka\u017cdemu firmowemu projektowi GitHub Pages?<\/h2>\n\n\n<p class=\"wp-block-paragraph\">GitHub Pages dobrze kojarzy si\u0119 z dokumentacj\u0105 i portfolio programistycznym, ale trzeba przeczyta\u0107 zasady u\u017cycia. Oficjalna dokumentacja wyklucza wykorzystywanie us\u0142ugi jako darmowego hostingu do prowadzenia biznesu online, e-commerce oraz witryn nastawionych g\u0142\u00f3wnie na transakcje komercyjne lub komercyjny SaaS. Nie wybieraj jej automatycznie dla sklepu, bo obs\u0142uguje HTML. Techniczna mo\u017cliwo\u015b\u0107 opublikowania plik\u00f3w nie jest zgod\u0105 na ka\u017cdy rodzaj dzia\u0142alno\u015bci.<\/p>\n\n\n<h2 id=\"lista-odbioru\" class=\"wp-block-heading\">Kr\u00f3tka lista odbioru strony HTML<\/h2>\n\n\n<ol class=\"wp-block-list\"><li>Wszystkie podstrony otwieraj\u0105 si\u0119 bezpo\u015brednio, r\u00f3wnie\u017c po od\u015bwie\u017ceniu.<\/li><li>Telefon nie ma poziomego przewijania, zdj\u0119cia nie zas\u0142aniaj\u0105 tre\u015bci, linki s\u0105 czytelne.<\/li><li>HTTPS dzia\u0142a pod docelowym adresem, a stara witryna nie zosta\u0142a przypadkiem nadpisana.<\/li><li>Formularz faktycznie dostarcza zg\u0142oszenie albo na stronie jest uczciwie podany inny kontakt.<\/li><li>Poczta dzia\u0142a po pod\u0142\u0105czeniu domeny.<\/li><li>Masz lokaln\u0105 kopi\u0119 \u017ar\u00f3de\u0142, dost\u0119p do konta us\u0142ugi i instrukcj\u0119 ponownego wdro\u017cenia.<\/li><\/ol>\n\n\n<p class=\"wp-block-paragraph\">Kopi\u0119 plik\u00f3w trzymaj r\u00f3wnie\u017c poza kontem publikacji. <a href=\"https:\/\/webbay.pl\/blog\/2026\/10\/28\/backup-hostingu-retencja-przywracanie\/\">Zasady przechowywania i przywracania kopii<\/a> s\u0105 potrzebne tak\u017ce wtedy, gdy witryna nie korzysta z bazy danych.<\/p>\n\n\n<h2 id=\"zrodla\" class=\"wp-block-heading\">\u0179r\u00f3d\u0142a i data weryfikacji<\/h2>\n\n\n<p class=\"wp-block-paragraph\">Dokumentacja pierwotna odczytana 30.10.2026. Scenariusz fotografa i lista odbioru s\u0105 opracowaniem WebBay; instrukcja opisuje dokumentacj\u0119, a nie wdro\u017cenie wykonane na koncie czytelnika.<\/p>\n\n\n<ul class=\"wp-block-list\"><li><a href=\"https:\/\/developers.cloudflare.com\/pages\/get-started\/direct-upload\/\" target=\"_blank\" rel=\"noopener\">Cloudflare \u2014 Direct Upload, r\u0119czne wdro\u017cenie i jego ograniczenia<\/a>.<\/li><li><a href=\"https:\/\/developers.cloudflare.com\/pages\/framework-guides\/deploy-anything\/\" target=\"_blank\" rel=\"noopener\">Cloudflare \u2014 statyczny HTML i plik index.html<\/a>.<\/li><li><a href=\"https:\/\/developers.cloudflare.com\/pages\/platform\/limits\/\" target=\"_blank\" rel=\"noopener\">Cloudflare Pages \u2014 limity platformy<\/a>.<\/li><li><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Learn_web_development\/Extensions\/Server-side\/First_steps\/Client-Server_overview\" target=\"_blank\" rel=\"noopener\">MDN \u2014 rozdzielenie przegl\u0105darki i zaplecza serwera<\/a>.<\/li><li><a href=\"https:\/\/docs.github.com\/en\/pages\/getting-started-with-github-pages\/github-pages-limits\" target=\"_blank\" rel=\"noopener\">GitHub Pages \u2014 ograniczenia i dopuszczalne u\u017cycie<\/a>.<\/li><li><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Learn_web_development\/Howto\/Web_mechanics\/What_is_a_URL\" target=\"_blank\" rel=\"noopener\">MDN \u2014 adresy wzgl\u0119dne i bezwzgl\u0119dne<\/a>.<\/li><li><a href=\"https:\/\/developers.cloudflare.com\/pages\/configuration\/serving-pages\/\" target=\"_blank\" rel=\"noopener\">Cloudflare Pages \u2014 obs\u0142uga \u015bcie\u017cek dokument\u00f3w HTML<\/a>.<\/li><\/ul>\n\n<\/div><\/div>\n\n<footer class=\"wp-block-group wb-footer\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<div class=\"wp-block-group wb-wrap wb-footer-top\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<div class=\"wp-block-group wb-footer-brand\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<figure class=\"wp-block-image size-full wb-brand\"><a href=\"https:\/\/webbay.pl\/blog\/\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"200\" src=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster.jpg\" alt=\"WebBay \u2014 strona g\u0142\u00f3wna bloga\" class=\"wp-image-24\" srcset=\"https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster.jpg 600w, https:\/\/webbay.pl\/blog\/wp-content\/uploads\/2026\/10\/logo_templatemonster-300x100.jpg 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/figure>\n\n\n<p class=\"wb-footer-tagline wp-block-paragraph\">Lepsze pytania.<br> \u015awiadomy wyb\u00f3r hostingu.<\/p>\n\n<\/div><\/div>\n\n\n<div class=\"wp-block-group wb-footer-column\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h3 class=\"wp-block-heading\">Odkrywaj<\/h3>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#zastosowania\">Hosting wed\u0142ug zastosowania<\/a><\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#koszty\">Ceny i odnowienia<\/a><\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#problemy\">Pytania i odpowiedzi<\/a><\/p>\n\n<\/div><\/div>\n\n\n<div class=\"wp-block-group wb-footer-column\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h3 class=\"wp-block-heading\">WebBay<\/h3>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/ranking-hostingow\/\">Ranking hosting\u00f3w \u2197<\/a><\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/#metodologia\">Metodologia i afiliacja<\/a><\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"mailto:contact@webbay.pl\">contact@webbay.pl<\/a><\/p>\n\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n<div class=\"wp-block-group wb-wrap wb-footer-bottom\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p class=\"wp-block-paragraph\">\u00a9 WebBay \u00b7 Centrum wiedzy o hostingu<\/p>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/webbay.pl\/blog\/\">Strona g\u0142\u00f3wna \u2192<\/a><\/p>\n\n<\/div><\/div>\n\n<\/div><\/footer>\n\n<\/div><\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>Gotowa strona HTML nie wymaga WordPressa. Wybierz miejsce publikacji, wgraj pliki i sprawd\u017a formularz, poczt\u0119 oraz typowe b\u0142\u0119dy \u015bcie\u017cek.<\/p>\n","protected":false},"author":2,"featured_media":694,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":true,"_kad_post_footer":true,"_kad_post_classname":"","footnotes":""},"categories":[9],"tags":[],"class_list":["post-695","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wybor-hostingu"],"_links":{"self":[{"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/posts\/695","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/comments?post=695"}],"version-history":[{"count":4,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/posts\/695\/revisions"}],"predecessor-version":[{"id":841,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/posts\/695\/revisions\/841"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/media\/694"}],"wp:attachment":[{"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/media?parent=695"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/categories?post=695"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webbay.pl\/blog\/wp-json\/wp\/v2\/tags?post=695"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}