본문 바로가기

전체 글

(26)
티스토리 로딩이미지 소스 추가하는 법. 소스&이미지 첨부 티스토리에 애드센스 광고를 게재하면서 광고 때문에 포스팅 내용이 늦게 나오는 경험 있지 않으셨나요? 사용자가 원하는 내용을 검색해서 들어왔는데 보고 싶은 내용이 늦게 뜬다면 사이트에 계속 있고 싶지 않을 거예요. 그럼 자연스럽게 사이트 밖으로 나오면서 이탈률이 높아질 수밖에 없죠. 이런 식의 이탈률을 줄이는 방법으로 로딩 이미지 사용하는 것을 추천드려요. 포스팅 내용이 나올 때까지 움직이는 이미지가 보임으로 지루함을 줄이고 이탈률도 줄일 수 있어요. 유료 스킨에는 종종 이런 로딩이미지를 보았는데 무료 스킨에도 적용하는 법을 알게되어 공유합니다. 티스토리 로딩이미지 만드는 법 로딩 이미지는 제가 첨부한 것을 받으셔도 되고 아래 사이트에서 받으셔도 됩니다. 아래 사이트는 무료, 유료 두가지가 있는데 무료 로..
티스토리 본문 소제목 꾸미는 방법 - CSS 서식 소스 공유 안녕하세요. 블로그 검색을 하다보면 중간에 제목을 가독성 좋게 꾸민것들을 보셨을꺼에요. 오늘은 티스토리 소제목을 꾸미는 소소를 공유하고 서식에 적용하는 방법까지 알려드릴께요. 이렇게 서식을 이용하여 본문 중간에 소제목을 꾸며주면 우선 가독성이 좋아져요. 하지만 제가 공유하는 티스토리 소제목 꾸미기 CSS 소스는 단순히 모양만 만들어 주는 것이 아니라 h2 tag를 사용하여 검색봇이 이 부분은 제목이구나 알 수 있게 해 두었어요. 검색 엔진은 제목을 사용하여 웹 페이지의 구조와 콘텐츠를 색인화하기 때문이죠. 이렇게 사용을 하면 SEO에도 긍정적인 영향을 줄 수 있지 않을까 생각이듭니다. Html Headings 소스는 ~ 까지 있고 형식은 제목넣기 입니다. 마지막에 꼭 으로 내용을 막아주어야 합니다. h1..
익스플로러 광고창이 계속 뜰때 해결방법 2가지 안녕하세요! 웹 표준 공부하는 디자이너입니다. 3주 전에 아수스 Asus 노트북을 구입하였고 아주 만족하며 사용하고 있습니다. 사용 때마다 속도가 빨라서 너무 기분이 좋아질 정도랍니다. 그런데 며칠 전부터 크롬을 사용할 때마다 익스플로러 광고창이 너무 자주 뜨더라고요. 닫아도 뜨고 닫으면 잠시 뒤에 또 뜨고... 사용하지도 않는 익스플로러에 관심도 없는 광창이 자꾸 뜨니 신경이 쓰이더라고요. 그래서 해결 방법을 찾아보았고 사람들이 많이 추천하는 방법 중 2가지를 소개해 드리려고 합니다. 이 두가지 방법 중 한 가지로 골치 아픈 증상을 해결했어요. 익스플로러 광고창이 자꾸 뜰때 해결 방법 1 제가 인터넷으로 검색해본 결과 익스플로러 광고창을 없애는 방법으로 이 방법을 많이 추천해 주시더라고요. 실제로 이 ..
html, css 공부와 코딩연습을 같이 할 수 있는 w3schools 안녕하세요. 오늘 소개하는 사이트는 제목 그대로 html과 css기초부터 고급까지 배우고 코딩 연습도 같이 할 수 있는 사이트예요. w3schools에서는 html, css 뿐만 아니라 javascript, SQL, Python, php, Bootstrap, jQjuery 도 배울 수 있어요. 게다가 상당한 많은 자료들을 무료로 다 볼 수 있답니다. 정확한 사이트 주소는 www.w3schools.com/ 입니다. 기본적으로 영어로 설명이 되는데 오른쪽 상단에 페이지 번역하기를 이용하면 한글로 번역이 됩니다. 제가 이 w3schools 사이트를 좋아하는 이유는 기초부터 고급까지 설명이 체계적으로 잘 되어있는 것도 좋지만 더 좋은 것은 바로 코딩을 연습하고 웹에서 어떻게 구현되어 보이는지 바로 확인할 수 있..
html에서 css적용하는 3가지 방법과 우선순위 안녕하세요.Html로 뻐대를 만들었다며 조금 더 보기 좋게 꾸미기 위해서 필요한 요소가 바로 CSS (cascading style sheets) 입니다. CSS (cascading style sheets)웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일시트이다. 문서 전체의 일관성을 유지할 수 있고, 세세한 스타일 지정의 필요를 줄어들게 하였다.기존의 HTML은 웹 문서를 다양하게 설계하고 수시로 변경하는데 많은 제약이 따르는데, 이를 보완하기 위해 만들어진 것이 스타일 시트이고 스타일 시트의 표준안이 바로 CSS이다. 간단히 스타일 시트라고도 한다. HTML을 이용해서 웹 페이지를 제작할 경우 전반적인 틀에서 세세한 글꼴 하나 하나를 일일이 지정해주어야 하지만, 웹 페이지의 스타일(작성형식)을 미리 ..
html 문서 구조화 요소 명칭과 역활 html문서를 보면 이래와 같은 문서 구조를 갖추고 있어요. 웹 문서의 소스를 보는 방법은 매우 간단합니다. 소스가 보고 싶은 페이지를 열고 F12버튼을 누르면 해당 페이지에 대한 html 소스를 확인할 수 있어요. 이러한 구조를 갖추어서 코딩해야 하는 이유는 검색엔진, 반응형레이아웃 등을 컴퓨터가 문서의 구조와 내용을 파악해야 하기 때문이죠. ● 머릿말 : header요소웹문서 페이지 혹은 섹션의 머리말 영역을 나타낼때 사용하고 들어가는 내용들에는 웹문서의 제목, 소개 등 문서 관련 설명등이 있어요. ● 탐색메뉴 : nav요소현 문서에서 다른 페이지 혹은 같은 페이지 이동을 할 수 있는 링크로 구성된 섹션을 표현합니다. ● 독립된 본문 : article웹문서에서 주요 내용을 가진 독립된 컨텐츠를 나타냅..
html5 코딩 기본 구문과 html, css차이와 역활 오늘은 html 기본구문과 html, css역활에 대해 공부한것을 기록하려고 합니다. html은 위에 보시다시피 크게 html, head, body 크게 세 덩어리로 나눌 수 있어요. 은 문서형식 선언이며 html5.0으로 제작한다는 의미입니다. 사이에는 meta, title 내용 외에도 많은 태그들이 들어가는데 그 외 태그들은 아래 표를 참고해 주세요. meta 웹 페이지에 추가 정보인 검색키워드, 사이트 설명등이 들어갑니다. title 사이트, 웹페이지의 제목 script script 스크립트 추가 link 웹 페이지에 다른 파일을 추가 (ex. css스타일시트 파일) style 웹페이지에 스타일시트를 추가 base 웹페이지에 기본 경로를 지정 사이에는 타이틀을 제외하고는 눈에 보여지는 내용 보다는 ..
웹표준 코딩은 물론 프로그래밍까지 무료로 공부 할 수 있는 사이트 생활코딩 안녕하세요! 전갈자리에요. 오늘은 무료로 웹표준 코딩은 물론이고 프로그래밍을 배울 수 있는 사이트가 있어 알려드리고 해요. 무료라고 하면 교육의 내용이 떨어지지 않을까? 처음 몇강만 무료이고 뒤에 고급 과정은 유료 아닐까? 의심할 수도 있는데 걱정하지 않으셔도 돼요. ^^ 오늘 소개하는 생활코딩 사이트에서는 html, CSS뿐만 아니라 Database, 언어, 클라이언트, 서버, 데이터과학, 개발도구, 프로젝트관리 등을 배울 수 있어요.저는 web, 클라이언트 메뉴를 자주 이용하고 있어요. 생활코딩은 웹사이트 뿐만 아니라 유튜브 채널을 통해서도 학습을 할 수 있어요.사이트로만 학습이 불편하신 분들은 유튜브 채널을 보시면 좀 더 편하게 공부 할 수 있을거예요. 코딩, 프로그래밍을 배우고 싶은 분들 생활코딩..

loading