본문 바로가기
블로그 꾸미기

티스토리 블로그 꾸미기 시작!

by 12th_moon 2020. 9. 18.

 

 

 

 

 

 

 

요즘 초등학생들은 코딩 교육이 필수라는데

나는 아주아주 예전에 초등학교를 졸업한지라 내게 HTML의 마지막 기억은 <marquee>태그랄까ㅋ

(왜 차고 많은 것들 중 하필 이걸까ㅋ)

 

그래서 그동안 네이버 블로그보다 더 취향에 맞게 꾸밀 수 있는 티스토리를 하고 싶어도

스킨을 건들 줄 몰라 그동안 만들어놓기만 하고 방치 아닌 방치ㅠㅠ

... 하다가!

 

얼마 전 좋은 기회가 되어 HTML5와 CSS3, 그리고 아주아주아주 약간의 JavaScript를 배울 기회가 생겼다 :)

 

그래서 조금씩 차근차근 나만의 블로그를 새로 꾸며보면서

그새 다 까먹은 웹디자인 복습을 해보려 한다.

 

 

 

 

 

 

 

 

 

티스토리에는 웹디자인 배웠답시고 처음부터 스킨 만든다며 괜히 나댈 필요 없이

블로그 관리 > 스킨 변경에 들어가 보면 적용 버튼 하나로 끝나는 훌륭한 디자인들이 많다.

 

심지어 상단에 보이는 웬만한 스킨들은 이미 다 반응형이라

이 중 가장 내 스타일인 Odyssey로 적용하고 소소하게 하나씩 내 스타일로 바꿔 보기로 했다.

 

 

 

 

 

 

 

 

 

 

우선 첫날은 이 정도만 수정!

왼쪽은 스킨 변경한 직후, 오른쪽은 내가 약간 편집한 후의 캡처다.

(변경 직후엔 캡처하기 까먹어서 다 바꾼 후에 다시 스킨 새로 적용해보고 캡처ㅠㅠ 바보ㅠㅠ)

 

1. 상단 내비게이션 부분의 배치와 배경을 살짝 바꾸고,

2. 그 밑에 타이틀에 사진을 배치하고 길이(height) 더 길게.

3. 인기글 하나를 크게 배치했는데 요건 그냥 스킨 옵션에서 적용해준 거.

4. 하단 우측에 클릭하면 상단으로 바로 가는 top버튼 만들어 고정해주기.

5. 그 밖에 자잘한 거 등등(폰트 변경, 포인트 컬러 변경 등등)...

 

(아무래도 바꾸다 보니 이전에 과제했던 홈페이지 메인과 매~우 흡사하게 나와서

사람 취향이란 게 이렇게나 무섭구나 싶기도 하고ㅋ)

 

 

 

 

 

아무래도 내 취향이 많이 반영된 결과물이라 할 수 있는데

여기서 '내 취향'이라고 하면, 마우스가 향했을 때 무언가 반응이 있는 걸 좋아해서

어떻게 보면 그런 쓰잘데 없는 것 위주로 꾸민 것 같기도 하다.

그래도 뭐 어떠냐, 내 건데 ㅋㅋㅋ(클라이언트는 나다!!)

 

 

 

 

 

 

 

 

오늘 나름의 포인트는 css 한 줄로 왠지 있어 보이는 배경화면 고정과(왼쪽),

밑으로 조금 내려가면 갑자기 뿅! 생기면서 마우스를 가져다 대면 진해지고 커지는 top버튼(오른쪽)이랄까.

 

나처럼 티스토리 블로그 꾸미기를 시작하는 누군가에게 이제부터 쓸 글이 도움이 된다면 더없이 기쁘겠지만

그럴 일은 뭐 거의 없을 것 같고ㅋ

그냥 앞으로 복습 겸, 하나씩 수정할 때마다 한번 html, css와 함께 여기에 기록해봐야지!

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

댓글