본문 바로가기

Programing30

iframe 정리 웹페이지에 다른 웹페이지를 삽입하는 방법. 편리하지만 악성코드를 갖고있는 신뢰할 수 없는 외부 사이트가 실행되면 자동으로 악성코드가 실행 될 수 있기 때문. 이러한 문제를 위해 HTML5에서는 샌드박스라는것을 도입하여 삽입된 웹 페이지에서 자바 스크립트 등이 실행되지 않도록 차단함. 다음과 같은 방식으로 iframe tag를 사용 할 수 있으며, 속성값으로 아래과 같이 sandbox라는 속성을 부여하면 iframe으로 호출한 사이트에서 보안을 위협할 수 있는 내용의 실행을 방지해줌. ** 보안을 위협할 수 있는 내용이라고 하면 form tag로 데이터를 전송하는 것이나, javascript를 이용하여 보안에 위협이 될만한 행동을 할 수 있기때문에 해당 동작을 sandbox라는 속성으로 막아줌. (HTML.. 2016. 9. 17.
모바일 지원(viewport) 현재 자신이 작업한 웹 페이지가 모베일에서 어떻게 보이는 확인하기 위해서는 (Chrome에서) F12를 눌러 개발자 도구를 실행시면 각각의 장치마다 해당 웹 페이지가 어떻게 보이는지 화면을 확인 할 수 있다. html의 head 하위에 meta tag로 아래와 같이 viewport를 추가하면 처리 가능 위와 같이 처리하면 각 장치의 화면 크기에 맞추어 웹페이지를 표시하도록 도와 준다. 각각의 페이지 사이즈마다 웹페이지의 구성을 다르게 하는것은 CSS에서 처리해야할 사항. 2016. 9. 17.
유지 보수 규모가 큰 사이트가 되면 유지보수를 효율적으로 해서 프로젝트의 복잡도를 낮추는 것이 정말 중요한 일. 따라서 대규모의 CSS 시스템을 구축할 때 여러가지 테크닉이 필요함. Link와 import 두 방법 모두 같은 방식. 수많은 사이트들의 공통적인 CSS를 하나의 CSS파일로 관리하면 추후 유지보수시 편리함이 있음. : CSS 내부에서 다른 CSS를 호출할 떄 사용 코드 경량화(minify) CSS는 네트워크를 통해서 전송되며 CSS크기가 커지면 생산자와 소비자 모두에게 손해임. 따라서 코드의 크기를 줄이는 것을 통해 이런 문제를 완화해주는 도구가 minify 도구. ( http://adam.id.au/clean-css-online/) Preprocessor CSS에 편리한 기능을 더한 새로운 언어를 만.. 2016. 9. 17.
HTML 기초 스터디 Note 웹 홈페이지를 구성하는 언어. 웹 페이지에서 F12를 누르면 생성되는 개발자모드에서 현재 페이지의 HTML 코드를 확인할수 있다. HTML의 경우 웹프로그래밍의 시작이며 문법이 어렵지않아 쉽게 배울 수 있음. HTML파일을 생성하는 방법메모장에서 HTML로 생성할 수 있으며 HTML파일을 생성하려면이름에 .html확장자를 붙여 준다. (이름.html )모든 확장자를 선택해 준다. (*.*)인코딩은 UTF-8 (인코딩을 UTF-8로 맞추는 정확한 이유는 잘 모르겠지만, 웹페이지 개발시 인코딩이 잘못되어 글씨가 깨지는 경우를 많이 봐 왔기에)위와 같이 생성된 파일을 실행하면 자동으로 인터넷창으로 파일이 열리고 작성된 내용을 확인 할 수 있다. 이후에 수정한 Tag를 확인 하려고 하면, 생성한 Html 파일의.. 2016. 9. 15.