HTML PDF-ке
HTML беттерін PDF форматына түрлендіріңіз.
HTML-ді PDF-ке түрлендіру дегеніміз не
HTML-ді PDF-ке — HTML файлды немесе веб-бетті CSS стильдерін, қаріптерін, суреттері мен макетін сақтай отырып PDF құжатқа рендерлеу. Html-ді pdf ретінде сақтау көп жағдайда керек болады: веб-беттерді мұрағаттау, HTML үлгілерінен есеп жасау, банктің веб-кабинетінен анықтама мен түбіртек басып шығару, жаңалық не мақаланың бекітілген көшірмесін алу.
Бұл түрлендіргіштің басты артықшылығы — CSS рендерингінің дәлдігі. Қазіргі HTML Flexbox, Grid, медиа-сұраулар мен таңдамалы қаріптерді пайдаланады — біздің қозғалтқыш (Gotenberg арқылы headless Chromium) осының бәрін, соның ішінде Google Fonts веб-қаріптерін де қолдайды.
.html файл серверге жүктеліп, headless Chromium-да A4 форматында (кітаптық бағытта) рендерленеді және PDF-ке сақталады. Процесс 3–8 секунд алады, ал файл сервердің дискісіне түспейді — ол сол сұраныстың ішінде түрлендіргішке беріледі. Абсолютті URL арқылы қолжетімді сыртқы CSS файлдар мен суреттер қолдау көрсетіледі.
HTML-ді PDF-ке қалай түрлендіру керек
- HTML файлды дайындаңыз — барлық CSS стильдер файл ішінде немесе абсолютті URL арқылы қосылғанына көз жеткізіңіз
- Файлды жүктеңіз — .html немесе .htm файлды жүктеу аймағына сүйреңіз (макс. 10 МБ)
- Өңдеуді күтіңіз — сервер HTML-ді headless Chromium-да ашып, 3–8 секундта рендерлейді
- Нәтиженің алдын ала көрінісін тексеріңіз — әсіресе ендірілген суреттер мен қаріптерге назар аударыңыз
- Дайын PDF файлды құрылғыңызға жүктеп алыңыз — түпнұсқа HTML өзгеріссіз қалады
Артықшылықтары
- CSS толық қолдауы — стильдер, Flexbox, Grid және медиа-сұраулар PDF-те дұрыс рендерленеді
- Chromium қозғалтқышымен рендеринг (Gotenberg) — жаңа Chrome-нан басып шығарғандай нәтиже, ескірген қозғалтқыштарсыз
- Автоматты A4 форматы — кітаптық бағыт пен ұқыпты жиектер өздігінен орнатылады, қолмен ешбір баптау қажет емес
- Бір рет басумен серверлік түрлендіру — .html жүктедіңіз, түймені бастыңыз, PDF алдыңыз; файл серверде тек сұраныс ішінде ғана тұрады және жауаппен бірге жойылады
- Веб-қаріптерді қолдау — Google Fonts пен @font-face дұрыс жұмыс істейді
- Векторлық мәтін — PDF-тегі мәтін нағыз мәтін болып қалады: оны бөлектеуге, көшіруге болады және іздеу жүйелері индекстейді
HTML-ді PDF-ке түрлендіру қашан керек
Шаблоннан инвойс жасау
Бизнес шот пен акт үлгілерін көбіне айнымалылары бар HTML түрінде сақтайды. Деректер қойылған дайын HTML клиентке жіберу үшін PDF-ке тез рендерленеді.
Веб-беттерді мұрағаттау
Жаңалықты, мақаланы немесе өтінімнің нәтижесін заңды түрде жарамды көшірме ретінде сақтау үшін бетті HTML ретінде сақтаңыз (Ctrl+S) да, PDF-ке түрлендіріңіз.
Email-таратуды PDF-ке
Маркетологтар HTML-хаттарды жиі PDF-ке айналдырады: кейбір клиенттер пошта форматындағы хаттан гөрі тіркемені қалайды.
Дашбордтардан есептер
Аналитикалық дашбордтар графиктері бар HTML снапшоттарды береді. Басшылыққа арналған PDF көшірме — апталық есептіліктің қалыпты форматы.
Веб-кабинеттен анықтамаларды басып шығару
Көптеген банктер, салық органдары мен eGov анықтамаларды HTML түрінде көрсетеді. Оны нақты кеңсеге апарып тапсыру үшін PDF нұсқасы қажет болады.
Құжаттама беттерін сақтау
Техникалық жазушылар құжаттаманы статикалық сайт генераторлары (Docusaurus, MkDocs) арқылы жасайды. HTML → PDF түрлендіру тарату үшін офлайн көшірме дайындайды.
HTML-ді PDF-ке немесе браузер арқылы басып шығару
Кез келген қазіргі браузер Ctrl+P → «PDF ретінде сақтау» арқылы бетті PDF-ке басып шығара алады. Ендеше онлайн-сервис не үшін керек? Әдеттегі бизнес-сценарийлерде оның бірнеше артықшылығы бар.
- Автоматтандыру — онлайн-сервис браузерді ашпай-ақ, көптеген HTML файлды API арқылы топтап түрлендіруге қолайлы
- Тұрақты рендер — серверде бір ғана Chromium қозғалтқышы тұр, сондықтан браузеріңіз қалай жаңарса да нәтиже өзгермейді
- Болжамды нәтиже — A4 форматы мен жиектер алдын ала орнатылған, Chrome-ның басып шығару диалогінен қажетті белгілерді іздеудің қажеті жоқ
- Минус: онлайн-сервис файлды серверге жүктеуді талап етеді. Қатаң құпия HTML үшін жергілікті Chrome-нан басып шығарған дұрыс
- Жылдамдығы: сервис арқылы 3–8 секунд, Chrome-да Ctrl+P арқылы 2–5 секунд. Жеке файлдарда бұл айырма байқалмайды
Қауіпсіздік және файлдарды өңдеу
- HTML файл Gotenberg арқылы headless Chromium-да рендерлеу үшін біздің серверге жүктеледі
- Файл тұрақты қоймаға сақталмайды: маршрут оны жадыда ұстап, сол HTTP сұраныстың ішінде қозғалтқышқа береді, ал түрлендіргіш оқшауланған контейнердегі уақытша көшірмемен жұмыс істеп, сұраныс аяқталған соң оны жояды
- Сондықтан «кесте бойынша тазалайтын» ештеңе жоқ — дайын PDF браузерге кеткен сәтте бастапқы HTML серверде қалмайды
- Түрлендіру қозғалтқышы сол серверде жұмыс істейді және тек ішкі мекенжай арқылы қолжетімді: файл сыртқы бұлттарға кетпейді, үшінші тұлғаларға берілмейді
- Сайтпен байланыс HTTPS арқылы жүреді, ал файлдардың мазмұны логқа жазылмайды — журналға тек техникалық қателер түседі
- Жүктелген HTML-дегі JavaScript сіздің браузеріңізде емес, түрлендіргіш жағындағы headless Chromium ішінде орындалады
- Жүктеу көлемі 10 МБ-пен шектелген — base64 түрінде ендірілген суреттері бар HTML бетке де бұл қорымен жетеді
Мәселелерді шешу
- Суреттер PDF-те көрсетілмеді
- Бұл HTML-де салыстырмалы жолдар (мысалы, src="./photo.jpg") қолданылғанын білдіреді — серверде ондай файлдар жоқ. Жолдарды абсолютті URL-ге (https://example.com/photo.jpg) ауыстырыңыз немесе суреттерді base64 түрінде файлға ендіріңіз.
- Қаріп браузердегідей емес, стандартты болды
- Бұл @font-face салыстырмалы URL-ге сілтеме жасайтынын білдіреді. Қаріптерді Google Fonts арқылы абсолютті URL-мен қосыңыз немесе оларды base64 data: URL түрінде HTML-ге ендіріңіз.
- JavaScript мазмұны көрсетілмеді
- Басып шығару алдында қосымша кідіріс қоймаймыз: Chromium бетті жүктелген бойда түсіреді, сондықтан ауыр SPA интерфейсті сызып үлгермеуі мүмкін. Түрлендіру алдында серверлік рендерингті (Next.js, Nuxt) пайдаланыңыз немесе дайын белгілеуді файлға ендіріңіз.
- Бет тым кең немесе тым тар болды
- Бет әдеттегі басып шығарудағыдай A4 парағының еніне қарай рендерленеді. HTML кең экранға немесе тар мобильді көрініске арналған болса, @media print CSS стилін пайдаланыңыз — бұл ережелер рендеринг кезінде қолданылады.
Жиі қойылатын сұрақтар
- Беттегі JavaScript рендерингі қолдау көрсетіле ме?
- Түрлендіру статикалық HTML мен CSS-ті, сондай-ақ қарапайым JavaScript-ті қолдайды (ол headless Chromium-да іске қосылады). Ауыр SPA қосымшалары (React, Vue, Angular) толық рендерленуге үлгермеуі мүмкін. Жақсы нәтиже үшін түрлендіру алдында бетті серверде рендерлеп алыңыз.
- Сыртқы ресурстар (CSS, суреттер) жүктеле ме?
- Абсолютті URL мекенжайлары арқылы қосылған сыртқы CSS файлдар мен суреттер жүктеліп, PDF-ке қосылады. Нәтиже сенімді болуы үшін стильдерді HTML файлдың ішіне инлайн қойыңыз және ресурстардың HTTPS арқылы ашық қолжетімді екеніне көз жеткізіңіз.
- PDF бет өлшемін баптауға бола ма?
- Жоқ, бөлек баптаулар жоқ: құрал PDF-ті әрқашан A4 форматында, кітаптық бағытта, стандартты жиектермен рендерлейді — Chrome-нан әдеттегі басып шығару сияқты. Дегенмен HTML-дегі @media print CSS ережелері рендеринг кезінде қолданылады, сондықтан бет түрін кодтың өзінде басқаруға болады.
- Веб-қаріптер қолдау көрсетіле ме?
- Иә, Google Fonts қаріптері мен таңдамалы @font-face абсолютті URL арқылы қосылып, HTTPS-пен ашық қолжетімді болса жұмыс істейді. HTML-де аталған жергілікті TTF/OTF файлдар жүктелмейді — оларды base64 түрінде ендіріңіз.
- URL арқылы веб-бетті тікелей түрлендіруге бола ма?
- Қазіргі нұсқада тек жергілікті HTML файлды жүктеуге болады. URL бойынша түрлендіру қажет болса, бетті компьютерге сақтаңыз (Ctrl+S → «Веб-бет, толығымен») да, шыққан .html файлды жүктеңіз.
- PDF-тегі мәтін бөлектелуі мүмкін бе?
- Иә, PDF-тегі мәтін нағыз мәтін болып қалады: оны бөлектеуге, көшіруге және Ctrl+F арқылы іздеуге болады. Мұндай PDF-ті іздеу жүйелері де индекстейді.
- Файлдар серверге жүктеле ме?
- Иә, HTML файл headless Chromium-да рендерлеу үшін серверге жүктеледі. Бірақ ол ешжерде сақталмайды: HTML сол сұраныстың ішінде түрлендіргішке беріліп, сұраныспен бірге жоғалады, мазмұны логқа жазылмайды әрі үшінші тұлғаларға берілмейді.
- Бұл сервис wkhtmltopdf немесе Puppeteer-ден немен ерекшеленеді?
- wkhtmltopdf — ескі WebKit негізіндегі ескірген жоба, ол қазіргі CSS-ті қолдамайды. Puppeteer — әзірлеушілерге арналған кітапхана, оған Node.js керек. Біздің сервис — заманауи CSS3-ті қолдайтын жаңа Chromium негізіндегі дайын шешім.
Басқа құралдар
Сондай-ақ оқыңыз
- PDF-ті Word-ке: 2026 жылы түрлендірудің ТОП-5 әдісі
- PDF-ті сапасын жоғалтпай қалай қысу керек: толық нұсқаулық
- PDF файлдарды сапасын жоғалтпай онлайн қалай біріктіруге болады
- PDF электрондық қолтаңбасы: Ресей мен Қазақстандағы құқықтық негіз
- PDF-тен мәтін шығару: OCR пен тікелей шығарудың айырмашылығы
- PDF онлайн электрондық қолтаңба
- PDF редакторы онлайн: Acrobat-сыз не істеуге болады
- PDF-ті құпиясөзбен қорғау: қалай және не үшін
- Барлық нұсқаулықтар →