로그인 | 관리자

개발 기록과 실무 자료를 빠르게 찾아보세요.

WEB DEVELOPMENT ARCHIVE

AI활용

생성형 AI 활용법과 개발·업무에 적용한 실무 경험을 공유합니다.

목록

[AI 활용] ChatGPT 채팅만으로 반응형 홈페이지 만들어 보기 - 홈페이지 내용 수정하기 (5)

웹마당넷 2026-10-26 15:42:28 10
첨부파일

ChatGPT 채팅만으로 반응형 홈페이지 만들어 보기 - 홈페이지 내용 수정하기 (5)

AI 에이전트 없이 채팅만으로 홈페이지 만들기 - 다섯 번째


지난 강좌에서는 온담 인테리어의 로고를 SVG 파일로 만들어 홈페이지에 적용해 보았습니다.


이번에는 홈페이지의 회사소개 내용을 수정하고, 지금까지 작업한 홈페이지의 최종 완성본을 공개하겠습니다.


1. 회사소개 내용 수정하기


먼저 기존 홈페이지의 회사소개 화면입니다.


editor_20261026153624_179774_2624.png

[기존 회사소개 화면]


기존 회사소개를 채팅으로 교체하는 방법을 알아보기 위해서 괜찮게 만들어진 회사소개 문구를 수정해 보겠습니다.


ChatGPT에게 저번강의에서 저장해 놓았던 HTML파일을 첨부하고 다음과 같이 요청하겠습니다.


ChatGPT에 입력할 프롬프트


- 현재 홈페이지의 디자인과 이미지는 그대로 유지하고, 회사소개 문구만 아래 내용으로 교체해 줘.


공간의 가치를 높이고, 사람의 마음을 담습니다.

온담 인테리어는 단순히 공간을 꾸미는 것이 아니라, 그 공간을 사용하는 사람의 생활과 취향을 디자인합니다.

아파트와 주택, 카페와 상업공간, 사무실까지 공간의 특성과 목적을 고려하여 아름다움과 실용성을 함께 갖춘 인테리어를 제안합니다.

고객과의 충분한 소통을 바탕으로 작은 부분까지 세심하게 살피며, 시간이 지나도 만족할 수 있는 공간을 만들어 가겠습니다.


- 수정한 HTML 파일을 다운로드할 수 있게 해줘.


2. 수정된 홈페이지 확인하기


ChatGPT가 만들어 준 HTML 파일을 다운로드하여 기존 파일과 교체합니다.


editor_20261026154221_953170_8955.png

[수정된 회사소개 화면]


이렇게 HTML 코드를 직접 수정하지 않고도 ChatGPT와의 대화만으로 홈페이지 내용을 변경할 수 있습니다.


사업분야, 시공사례, 공지사항도 같은 방법으로 수정하시면 됩니다.


3. 최종 완성된 홈페이지

지금까지 ChatGPT와의 채팅만으로 반응형 홈페이지를 만들고, 이미지와 로고를 교체하고, 회사소개 내용까지 수정해 보았습니다.

완성된 홈페이지는 아래 링크에서 직접 확인할 수 있습니다.


[ 완성된 홈페이지 바로가기 ]


HTML 파일과 이미지가 포함된 전체 소스도 첨부했으니 다운로드해서 확인해 보시기 바랍니다.


지금까지 별도의 AI 에이전트나 코딩 도구 없이 ChatGPT 채팅만으로 홈페이지를 만들어 보았습니다.


여러분도 같은 방법으로 자신만의 홈페이지를 만들어 보시기 바랍니다.


이번 강좌는 홈페이지 제작을 전혀 모르는 초보자도 ChatGPT의 채팅만으로 홈페이지를 제작하기 위하여 최대한 쉽게 설명한 강좌입니다.

댓글 0

등록된 댓글이 없습니다.
댓글 작성 타인을 비방하거나 광고성 내용을 등록하지 마세요.