본문 바로가기

전체985

아이콘과 파비콘 만들기 아이콘(Icon): 이미지(image)를 뜻하는 그리스말에서 왔다. 동방 정교회에서 종교적인 그림을 일컫는 말이었다. 파비콘(favicon): 좋아하는(favorite) 아이콘(icon)을 줄인 말이다. 인터넷 브라우저 탭에서 블로그 이름 앞에 나타나는 그림을 일컫는다. (# 옛날엔 브라우저 주소창 주소 앞에 나타났었다.) 티스토리 블로그는 블로그 이미지, 아이콘 그리고 파비콘을 넣을 수 있다. 아이콘은 여러 가지 파일 형식(JPG, GIF, PNG)을 지원하므로 아이콘으로 쓰고 싶은 그림 파일을 적당한 크기 32x32, 64x64로 편집해서 올리면 된다. 그런데 파비콘(favicon)은 ICO 형식으로 만든 파일만 올릴 수 있다. 파비콘을 어떻게 만들까? 고민하지 말고 아래 링크한 사이트에서 만들면 된.. 2020. 11. 6.
도올 만화 논어 1~5 논어 일기 쓰기는 아주 단순한 흥미에서 시작했지만 며칠 해보고 나니 인터넷을 뒤져서 공부하기엔 너무 어렵다. 대단한 공부는 아니기에 전문가가 보는 책을 사기도 그렇고 해서 한문 선생님께서 추천한 만화책을 샀다. 도올 선생께서 옮겼다고 하니 믿을 만하다. 이제 이걸로 공부를 할 것이다. 논어를 읽으매 읽기 전과 후가 다르지 않다면 그는 전혀 논어를 읽은 자가 아니다. —정자 1032~1085 기원전 551년, 공자는 아버지 '숙량흘'과 어머니 '안씨녀' 사이에서 태어났다. 아들을 바라던 부모가 니구산에서 빌고 안 후 얻었다고 하여 또, 머리가 니구산 꼭대기처럼 움푹 들어갔다고 하여 이름을 언덕 구(丘)로 했다고 한다. 키가 무려 9척 6촌에 달하고 노래도 아주 잘했다고 한다. 선비 사(士)로 부르는 집단은.. 2020. 11. 5.
브라우저 전쟁 1996년부터 컴퓨터를 쓰기 시작했으며 1997년 피씨 통신 시대까지 거쳤으니 나름 인터넷의 역사를 알만큼 안다. 브라우저가 없는 인터넷은 생각하기 어려우니 인터넷은 브라우저의 역사와 함께 한다. 위키백과에 있는 브라우저 전쟁을 우리말로 옮겨 본다. 우리말로 옮기기 어려운 용어가 워낙 많아서 영어를 그대로 쓰기도 했지만 대부분 우리말로 바꿔 보려고 힘썼다.  줄이거나 우리말로 옮긴 말1. world side web: 웹. 2. Internet Explorer: 익스플로러. 3. Netscape Navigator: 내비게이터. 4. Firefox: 불여우 5. Hypertext: 초문서 6. version: 판브라우저 전쟁은 브라우저 점유율을 둘러싼 경쟁을 말한다. 1990년 대 후반은 마이크로소프트의 익.. 2020. 11. 5.
학이편 8장 子曰 君子不重則不威 學則不固 主忠信 無友不如己者 過則勿憚改 자왈 군자부중즉불위 학즉불고 주충신 무우불여기자 과즉물탄개 선생님께서 말씀하셨다. 군자가 진중하지 않으면 위엄이 없으니 배운 바도 견고하지 못하다. 믿음에 충실해야 하며, 자기만 못한 사람을 벗으로 삼지 말고, 허물이 있다면 고치기를 꺼리지 말아야 한다. 맨끝에 있는 '과즉물탄개'가 많이 들어왔던 말이라 쏙 들어온다. 사람은 누구나 자기 허물엔 관대하다. 남들이 지적하지 않아도 자기가 어떤 허물을 가지고 있음을 알았다면 스스로 고쳐나가려 힘써야 한다. 반면 자기만 못한 사람과 사귀지 말라는 언뜻 들으면 좋게 들리지 않는다. 못하다는 아마 인성이 갖추어지지 않은 이를 뜻하는 것이리라. 근묵자흑이란 말도 있듯이 친구를 보면 그 사람 됨됨이를 알 수 .. 2020. 11. 4.
아이콘 쉽게 만들기_Fontawesome 블로그 살결을 다듬을 때 아이콘이 필요하다. 개인적으로 이미지가 없는 가벼운 살결을 좋아하지만 모두를 텍스트로 만들면 아무래도 볼품이 조금 아쉽다. 내 블로그 살결에 있는 몇몇 아이콘은 손으로 그려서 스캔한 것이다. 아무래도 정교함이 떨어진다. 이런 저런 검색으로 아이콘을 아주 쉽게 만들 수 있는 방법을 찾았기에 소개한다. http://fontawesome.io/icons/ 연결고리를 따라 들어가면 아래와 같은 아이콘을 만난다. Fontawesome에서는 오로지 CSS만으로 위에 있는 벡터 아이콘을 만들고 크기와 빛깔을 바꿀 수 있다. 그림자까지 넣을 수 있다. 보고 있는 블로그 사이드바에 있는 목록 앞에 달린 그림이 이렇게 만든 것이다. 쓰는 방법도 아주 간단하다. 먼저 이 사이트에 이메일로 인증을 받.. 2020. 11. 4.
티스토리 레터 스킨 바꾸기 화려함보다 간단함을 좋아한다. 스킨도 마찬가지다. 티스토리에서 제공하는 스킨 가운데 간단함이 돋보이는 편지(letter)를 하나씩 바꿔 나가려고 한다. 1. 영어로 된 부분을 한글로 바꾼다. admin -> 관리자; about me -> 이 블로그는; TAG -> 꼬리표 삭제 -> 지우기; 수정 -> 고치기; 확인 -> 남기기; 태그 -> 꼬리표; 인기 포스트 -> 인기글 2. 색을 무채색으로 바꾼다. 이것은 스킨 옵션에서 선택하여 쉽게 바꿀 수 있다. 3. 이미지를 바꾼다. 이것은 손으로 그렸다. 4. 수식 입력을 가능하게 한다. 요소 안에 아래와 같이 넣어 주면 라텍($\LaTeX$)으로 수식을 넣을 수 있다. $$x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}$$ 5. 글꼴을 바꾼다. 고.. 2020. 11. 3.
학이편 7장 子夏曰 賢賢易色 事父母 能竭其力 事君 能致其身 與朋友交 言而有信 雖曰未學 吾必謂之學矣 자하왈 현현이색 사부모 능갈기력 사군 능치기신 여붕우교 언이유신 수왈미학 오필위지학의 자하가 말했다. “색을 좋아하듯이 어진 사람을 좋아하고 온 힘을 다해 부모를 섬기며, 몸을 다해 임금을 섬기며, 벗과 사귈 때 말에 믿음이 있으면 비록 그가 배우지 않았어도 나는 반드시 배웠다고 말할 것이다.” '색'하면 '주색'이 딱 떠오른다. 굳이 여색이 아니더라도 사람들이 밝히는 색이 여러 가지다. 요즘은 특히 온갖 유혹이 넘쳐나는 세상이니 더더욱 그렇다. 가장 좋아하는 어떤 것보다 어진 사람을 좋아해야 한다고 풀이하고 싶다. 비록 몇 장 읽지 않았는데 논어는 공부보다 인성이 먼저라고 밝히고 있다. 세상은 많이 배우고 공부한 사람.. 2020. 11. 3.
WWW란? WWW는 World Wide Web이다. 간단하게 웹(Web)으로 부른다. 웹은 인터넷으로 접근할 수 있고 하이퍼텍스트로 연결되는 Uniform Resource Locators (URLs)으로 식별하는 문서나 자원이 있는 정보공간이다. 영국 과학자 Tim Berners-Lee가 1989년에 만들었다. 1990년 핵연구를 위한 유럽 조직인 CERN에서 일할 때 첫 웹브라우저를 선보였다. 1991년 웹브라우저를 조직 밖으로 공개하였다. 1991년 1월에 다른 연구 협회에 공개하였고 8월에 일반에 공개하였다. 월드 와이드 웹 (World Wide Web)은 정보화 시대가 발전하는데 핵심이었으며 인터넷을 통한 상호 작용에 수십억 명이 주요 도구로 사용하고 있다. 웹 페이지는 주로 HTML (Hypertext M.. 2020. 11. 1.
미끄러져 나오는 메뉴 날마다 조금씩 블로그 살결을 바꾸고 있다. 오늘은 옆에서 미끄러져 나오는 메뉴 만들기를 소개한다. 수업 시간에 쓸 목적으로 만든 블로그라 목록이 많다. 사이드바가 길어지는 것이 맘에 들지 않아 카테고리만 따로 뗴어내 감춰두고 필요할 때 보이게 하고 싶어졌다. 찾아보니 자바스크립트(javascript)나 제이쿼리(jquery)로 만든 것이 많다. 아무래도 씨에스에스(CSS)로만 만든 것이 맘에 들어서 골랐다. 먼저 skin.html파일 윗부분에 아래와 같은 태그를 넣고 style.css파일에 이어지는 코드를 넣어서 완성하였다. 나름대로 보기 좋다. ≡ /* ---------------------------------------------- */ /* menu*/ /* ---------------------.. 2020. 11. 1.
스킨 편집할 때 좋은 프로그램 괄호 brackets 티스토리 블로그 살결(skin)을 만지작거린다. 크게 아는 것은 없지만 남이 만든 것을 해석할 줄은 안다. 티스토리에서 새로 내 놓은 스킨 '포스터'를 짜집기 해 보았다. 스킨을 손보는 일은 생각보다 아주 번거롭다. 번거로움을 상당히 줄여줄 프로그램을 소개한다. brackets을 내려받아 실행하면 별다른 설명 없이 쉽게 따라할 수 있다. 프로그램 이름을 괄호(brackets)로 붙인 것이 재밌다. brackets.io/ A modern, open source code editor that understands web design Brackets is a lightweight, yet powerful, modern text editor. We blend visual tools into the editor .. 2020. 11. 1.
HTML과 CSS란 무엇인가? 티스토리 스킨을 고치거나 만들기 위해서는 먼저 에이치티엠엘(HTML)과 시에스에스(CSS)를 알아야 한다. 티스토리 관리자 화면에서 스킨 편집으로 들어가서 html 편집 단추를 누르면 skin.html과 style.css를 편집할 수 있다. 모두 영어로 쓰인 파일이 열린다. 이 파일을 편집하려면 프로그래밍 언어를 알아야 한다. 아래를 여행하면 거의 모든 걸 알 수 있다. 가끔씩 시간이 날 때마다 한두 가지 올려 보려 한다. HTML https://www.w3schools.com/html/ HTML Tutorial HTML Tutorial HTML is the standard markup language for Web pages. With HTML you can create your own Website... 2020. 11. 1.
HTTP와 HTTPS 올해부터 티스토리는 보안 HTTPS 접속으로 바꾼다고 한다. 이제까지는 일반 HTTP와 보안 HTTPS 가운데 하나를 고를 수 있었다. 그간 보안 접속 HTTPS로 바꾸면 위험을 알리는 메시지가 떠서 그냥 일반 HTTP 접속를 써왔는데 원인을 알아보려고 자료를 찾아 보았다. 경고 메시지가 뜨는 까닭은 내가 만든 스킨에서 스크립트 화일을 일반 HTTP접속으로 받아왔기 때문이다. HTTP와 HTTPS는 어떻게 다른가? HTTP는 초문서 전송 규약(HyperText Transfer Protocol)을 줄인 말이다. 이 방식은 웹 문서를 평문으로 주고 받기때문에 중간에서 전송되는 정보를 엿볼 수 있다. 이 문제를 해결하기 위하여 HTTPS(HTTP Secure)는 문서를 암호화하여 주고 받도록 하는 것이다. 뉴.. 2020. 11. 1.
반응형

티스토리툴바