인사의 글

환영합니다! fluorF's laboratory의 5번째 버전 'MondrianAI'로 다시 찾아뵙게 된 것을 기쁘게 생각합니다. 이 홈페이지는 1997년에 처음 제작되었고, 2004년 Cyworld 미니홈피를 거쳐 2006년에 다시 개별적인 웹사이트로 독립하여 지금에 이르고 있습니다.

제 홈페이지는 저의 개인적인 생각과 이야기, 그리고 각지를 돌아다니며 찍은 사진들을 한 곳에 모아놓은 작은 공간입니다. 소셜 미디어를 통한 개인 채널이 범람하는 이 때에 html을 사용하여 개별적인 개인 홈페이지를 제작한다는 것은 어떻게 보면 예스러운 일일 수 있으나, 저는 개인적으로 웹에 저만의 독립된 공간을 가지고 있다는 것에 큰 자부심을 가지고 있으며, 또 이를 관리하고 확장시켜 나가는 수고로움도 기쁨으로 여기고 있습니다.

화학자의 실험 선반에 갖가지 다양한 시약들과 기구들이 놓여있듯 이 홈페이지에도 수많은 읽을거리, 볼거리들이 가득합니다. 부디 방문자 하나하나가 여기 있는 내용들을 부담 없이 즐겁게 즐길 수 있기를 희망합니다.

5번째 버전의 특징 (2026.08.01)

4번째 리뉴얼을 진행한 지 10여 년이 지나면서 브라우저로 보이는 홈페이지 디자인에 많은 문제점이 노출되기 시작했습니다. 10년이면 강산도 변한다는데, 새로운 규약이 등장하면서 다양한 발전이 동시다발적으로 이뤄지는 웹 표준이 10년 전과 동일하리라고 바라는 것은 무리겠지요. 예전만 해도 최신식 기술을 적용했다고 생각했던 홈페이지 디자인은 어느새 구식이 되어 있었고, 이에 따라 의도했던 대로 페이지가 보이지 않거나 규격이 조금씩 틀어지는 문제가 발생했습니다.

이러한 문제를 어떻게 극복해야 하나 망연자실해 하고 있을 때, 새로운 가능성을 제시해 준 것은 다름 아닌 인공지능을 통한 바이브 코딩(vibe coding) 경험이었습니다. 코딩에 필요한 지식이 별로 없었던 저도 인공지능과의 대화를 통해 원하는 기능을 갖춘 웹 애플리케이션을 제작할 수 있었고, 거기에서 굉장한 희열을 느낀 저는 홈페이지 리뉴얼도 거대 언어 모델(LLM)의 도움을 받기로 했습니다. 덕분에 새로운 사실을 많이 배우면서 기존의 홈페이지를 효과적으로 갱신할 수 있었습니다.

다만 fluorF.net의 정체성처럼 이제는 완전히 정착한 몬드리안의 추상화 디자인을 버리고 싶지는 않았습니다. 그래서 4번째 리뉴얼의 디자인을 살리되 변화한 웹 표준과 최근 널리 사용하는 html 및 css 스타일을 최대한 도입하였습니다. 또한 데스크탑을 통해 방문하는 분들이 대부분 과거보다 훨씬 큰 모니터를 사용하시기 때문에, 페이지의 폭은 (최대 화면 기준) 1000 px에서 1440 px로, 컨텐츠의 폭은 800 px에서 1000 px로 다소 상향했습니다.

한가지 특기할 만한 사항은 이번 버전에서는 JavaScript를 적극적으로 사용했다는 것인데, 지난 버전에서는 사진첩에서만 일부 적용했던 것을 이제는 전 페이지에 걸쳐 공통 컴포넌트 로딩 및 최종 수정일 기재와 같은 기능 구현에 폭넓게 활용하게 되었습니다. 이 역시 인공지능을 통한 학습 덕분에 가능한 일이었습니다.

4번째 버전의 특징 (2015.03.01)

웹사이트를 제작하는데 핵심 마크업 언어가 되는 HTML5는 2004년 첫 제안 이후 발전이 꾸준히 이어졌고, 이제 주요 브라우저들(크롬, 파이어폭스, 사파리, 오페라, 인터넷 익스플로러)에서도 여러 다양한 태그를 지원하기에 이르렀습니다. 더욱이 이들이 종속형 시트, 곧 CSS의 최신 버전인 CSS3를 점차 확대 지원하게 되면서 웹 디자인은 보다 큰 유연성을 가지게 되었습니다. 하지만 스마트폰과 태블릿 PC를 통한 웹 브라우징이 현격하게 늘어남에 따라 데스크탑 모니터와는 다른 규격과 이동성을 가진 이들 장치의 화면에서도 충분히 웹을 즐기기 위한 방안들이 추가로 요구되었고, 이는 소위 '반응형 웹(responsive web)' 디자인의 출현을 앞당기게 되었습니다.

본 홈페이지의 4번째 버전 리뉴얼은 바로 이 반응형 웹 디자인에 초점을 맞추어 제작되었습니다. 이전 버전의 홈페이지는 데스크탑으로 즐기기에는 무리가 없었으나 모바일이나 태블릿 PC로 즐기기에는 여러 가지 부족한 점이 많았습니다. 실제로 구글에서는 이전 버전 홈페이지의 모바일 적합성이 크게 뒤떨어지는 것으로 조사되었다는 권고성 메일을 보낸 바 있습니다. 게다가 2015년 들어서 모바일을 통한 홈페이지 접속자 수가 데스크탑을 통한 접속자 수를 초월, 모바일 기기를 통한 홈페이지 화면 문제는 더이상 간과할 수 없는 중요한 이슈가 되었습니다. 이에 홈페이지를 모바일과 태블릿 PC, 데스크탑 디스플레이에서, 그리고 다양한 화면 크기에서도 적절하게 즐길 수 있도록 미디어 쿼리와 유동형 박스 등의 기법을 도입하였습니다. 동시에 웹 표준을 지키기 위해 마크업 언어들은 W3C에서 정한 표준안과 권고안을 모두 따르게 하였습니다.

또한 해당 리뉴얼 주제에 맞게끔 전체적인 디자인도 새롭게 바꾸었는데, 이번 리뉴얼의 주제는 '몬드리안(Mondrian)'으로 저명한 네덜란드의 화가 피터르 몬드리안(Pieter Mondrian)의 추상화를 웹사이트 디자인으로 채택하였습니다.

그리고 과거 버전은 모든 컨텐츠를 영어로 쓰고 한국어를 부분적으로 활용하고자 하였으나 국내 접속자 수가 월등히 많다는 점, 그리고 업데이트의 속도를 높일 수 있다는 점을 고려하여 모든 컨텐츠를 한국어로 하되 필요한 부분에서 영어를 병기하기로 결정하였습니다.

홈페이지 역사

서비스업체 날짜 코드명 및 특징
NETSGO 1997.??.?? Story Store WYSIWYG 제작 툴 이용
2000.??.?? Transport King! "Transport Tycoon" 게임 팬페이지
Cyworld 2004.02.28 fluorF's minihompy 싸이월드 미니홈피
Dothome 2007.09.03 The Red Chocolate Craquelure 프레임셋 적용
2008.11.09 Black and White 자바스크립트 이용 네비게이션 바
2011.04.11 A True Laboratory HTML4.01 및 CSS 최초 적용
2015.03.01 Mondrian HTML5, CSS3, 반응형 웹 디자인 적용
2026.08.01 MondrianAI ChatGPT 활용 grid layout, JavaScript 컴포넌트 적용

릴리스 노트

버전 날짜 변경이력
v.6.0.0. 2026.08.01. 리뉴얼 홈페이지 오픈

폰트 정보

본 홈페이지에서는 한국어 및 영어 서체로 오픈 폰트이자 구글 웹폰트인 '나눔 고딕체(Nanum Gothic)'와 제주도청에서 제작하여 무료로 배포한 '제주 고딕체(Jeju Gothic)'를 사용합니다.

최종 수정일: