무슨 일이야 프로그래머로 구현 기술의 세부 웹 응용 프로그램을 고려하기 전에 사이트에 공개되나요? 는 경우제프 앳 우드잊을 수 있HttpOnly 쿠키,사이트맵,and크로스-사이트 요청의 위조all 에서 동일한 site,무엇이 중요한 것은 나는 잊고 있을 뿐만 아니라?
나는'm 생각하고 이에 대해서는 웹 개발자는's 의 관점,그러한 다른 사람을 창조하는 실제 디자인과 콘텐츠에 대해 사이트입니다. 하는 동안 그래서 사용성과 내용될 수 있습보다 더 중요한 플랫폼으로,당신은 프로그래머는 작은 말하는 것입니다. 당신이 무엇에 대해 걱정할 필요가가는 당신의 구현의 플랫폼은 안정적이,수행,보안,을 충족하고 다른 어떤 비즈니스 목표(지 비용이 너무 많은,너무 오래 걸리를 구축하고 순위뿐만 아니라과 구글로 컨텐츠 지원).
이것을 생각하십의 관점에서는 개발자는's 몇 가지 작업을 위한 인트라넷 형 응용 프로그램에서는 매우 신뢰할 수 있는 환경,그리고 자신의 첫 번째 샷을 잠재적으로 인기이트에 대한 전체 큰 나쁜 world wide web.
또한,나는'm 뭔가를 찾고 있다는 막연한"웹 표준"반응이다. I mean,HTML,JavaScript,and CSS HTTP 를 통해 꽤 많이 주어진 때,특히 나는've 이미 지정한 당신이'다시 전문적인 웹 개발자이다. 그래서 넘어가는,Which 표준? 어떤 상황에서,그리고 왜? 에 대한 링크를 제공하는 표준's specification.
여기에서 아이디어는 우리의 대부분은 already 알 most 에 무엇이 있는지에 대해 이 목록입니다. 하지만 그냥 있을 수 있습니다 하나 또는 두 개의 항목을 명't 이 정말로 보이기 전에,don't 완전히 이해,또는 어쩌면니다.
사용자 인터페이스와 사용자 경험
-인식하는 브라우저 구현하는 표준을 일관성 없는지 확인하십시오 사이트가 작동하는 합리적으로 잘 모든 주요 브라우저입니다. 최소 테스트에 대한 최근Gecko엔진(Chrome),WebKit 엔진(Safari과 몇 가지 모바일 브라우저),Chrome을 지원하는IE 브라우저(활용응용 프로그램의 호환성 VPC 이미지),and오. 또한 방법을 고려브라우저 렌더링이지에서 다양한 운영체제 시스템입니다.
-고려 사람들이 어떻게 사용할 수 있습니다 이외의 사이트에서 주요 브라우저 셀룰라 전화,스크린 독자들이고,검색 엔진에 대한 예입니다. —몇 가지 정보 접근성:WAISection508,모바일 개발:MobiForge.
-준비:업데이트를 배포하는 방법에 영향을 주지 않고 사용자에게 있습니다. 있는 하나 이상의 시험 준비 또는 환경에서 사용할 수 있을 변경 사항을 구현하는 아키텍처,코드 또는 연소 내용과하는지 확인할 수 있는 배포될 제어 방법을 파괴하지 않고는 아무것도. 자동화 방식의 배포를 승인 변경은 라이브 사이트입니다. 이것이 가장 효과적으로 구현과 함께 사용하의 버전 관리 시스템(git,파괴,등.) 고 자동 빌드 기계장치(Ant,넝,etc.).
-Don't 디스플레 비치 오류로 직접 사용합니다.
-Don't 넣어 사용자는'이메일 주소에서 일반 텍스트들 얻을 것이 스팸을 죽음입니다.
-추가 특성rel="nofollow"
user-생성된 링크지.
-빌 잘 고려한 제한 귀하의 사이트로-이것은 또한에 속하는 보안이다.
-배울 수행하는 방법진보적인 증진.
-리디렉션후는 경우에는 게시물에 성공했을 방지하기 위해,새로 고침에서 다시합니다.
-Don't 을 잊지 접근성이 있습니다. It's 항상 좋은 아이디어 및 특정 상황에서 그's법적 요구사항. WAI-ARIA와WCAG2은 좋은 자원이 지역에서.
읽기지't 을 생각하게.
Security
-It's 많이 소화하지OWASP 개발 가이드웹 사이트의 보안을 위에서 아래로.
-에 대해 알고 주입에 특히SQL injection그리고 어떻게 그것을 방지합니다.
-를 신뢰하지 않는 사용자 입력,또는 다른것에서 온 요청을(을 포함하는 쿠키고 숨겨진 형태 필드의 값!).
-해시 사용하여 암호소금그리고 사용하는 다른 소금을 위해 당신의 행하여지는 무지개 공격입니다. 사용 slow 해싱 알고리즘과 같은 bcrypt(시간을 테스트)또는 scrypt(더 강해지만,새로운) (1, 2), 저장하기 위한 암호를 암호화합니다. (어떻게 안전하게 암호를 저장). 는NIST 또한 승인 PBKDF2 를 해시 암호"및 그'sFIPS 승인했습니다.순(자세한 정보여기). 피MD5 를 사용하여 또는 샤 가족이 직접 있습니다.
-지't 하려고 올라와 자신의 멋진 인증 system. It's 같은 쉬운 것은 잘못이에서 미묘한 방법으로는 쓸만하고 당신은 것't 도 그것을 알지 after 당신이'다시 해킹된다.
알 수 있도록 도와드규칙이 처리를 위해 신용카드. (이 질문으로 잘)
-사용하여 SSL/TLS]30/HTTPS모든 사이트는 민감한 데이터 입력(정,개인 식별 정보,신용 카드 정보). 보's 암호화무료 인증 기관 어떤 도움이 될 수 있습니다.
-지 세션 납치.
-피크로스사이트스크립팅 여부(XSS).
-피크로스 사이트 요청의 위조(CSRF).
-피킹.
-유지하는 시스템(s)날짜와 최신 패치입니다.
-는지 확인하는 데이터베이스 연결 정보를 확보하고 있다고 판단합니다.
-에 대한 정보를 자신을 유지하는 최신 공격 기법 및 취약성에 영향을 미치는 플랫폼입니다.
읽기Google 브라우저 Security Handbook.
읽기웹 응용 프로그램커's Handbook.
-고려한최소 권한 원칙. 도 앱을 실행하려면 서버로 비 root]39. (tomcat 예)
-Putrel="noopener noreferrer"에서
모든 사용자가 제공하는 링크와 함께target="_blank"
지에서 자바스크립트 대상에서 페이지로 리디렉션 페이지를 다른 곳과 같은 가짜 로그인 페이지입니다. 자세한 정보
-고려 이용하여 엄격한 콘텐츠 보안 정책]41.
**성능
-구현 캐시 필요한 경우,을 이해하고HTTP 캐싱제대로 뿐만 아니라HTML5 매니페스트.
-최적화 이미지-don't use a20KB 이미지를 반복되는 배경입니다.
-콘텐츠를 압축하 속도에 대한 참조하십시오brotli,gzip/(deflate 더).
-결합/연결하여 여러 스타일 시트 또는 여러 개의 스크립트 파일의 수를 줄이는 브라우저 연결을 향상 gzip 으로 압축 능력 중복 사이의 파일이 있습니다.
-살펴야후 뛰어난 성능사이트의 많은 훌륭한 지침을 포함하여,개선 프런트 엔드 성능 및 그들의YSlow도구(필요 Firefox,Safari,Chrome 또는 오페라). 또한,구글 페이지의 속도(사용으로확)는 또 다른 도구에 대한 성능 프로파일링과 최적화를 위해 귀하의 이미지를 너무입니다.
-용CSS 이미지를 스프라이트에 대한 작은 관련 이미지 도구 모음과 같은(보"을 최소화하는 HTTP 요청이"점)
-사용하여SVG 이미지를 스프라이트에 대한 작은 관련 이미지 도구 모음과 같은. SVG 색상은 까다로운 방법입니다. 에 대해 읽을 수 있습니다 그것은여기.
바쁜 웹 사이트에 고려해야한다분할 구성 요소에 도메인. 특히...
-정적 컨텐츠(즉,이미지,CSS,자바 스크립트,그리고 일반적으로 컨텐츠는't 필요에 액세스하여 쿠키)를 이동해야에서 별도의 도메인_를 사용하지 않는 쿠키_기 때문에,모든 쿠키를 위한 도메인 및 그 하위 도메인과 함께 보내는 모든 요청을 도메인 및 그 하위 도메인입니다. 하나 좋은 옵션을 사용하여 컨텐츠 전달 네트워크(CDN),고려한 경우에는 CDN 실패할 수 있습니다 포함하여 대체 Cdn,로컬 또는 사본 제공할 수 있는 대신 합니다.
-을 최소화하의 총수는 HTTP 요청에 필요한 브라우저를 렌더링하는 페이지입니다.
를 선택하고템플릿 엔진및 렌더링/미리 컴파일을 사용하여 작업자 같은 꿀꺽 또는 단순
-이 있는지 확인하십시오favicon.ico
파일에서 사이트의 루트,즉/favicon.ico
. 브라우저가 자동으로 그것을 요청,경우에도 이 아이콘을 언급하지 않으면에서 HTML 다. 지 않는 경우에는/favicon.ico
,이것은 결과에서 많은 404s,배수신 서버로의 대역폭이 있습니다.
SEO(Search Engine Optimization)
사"수색 엔진을 친절"Url,즉사용 example.com/pages/45-article-title
대신example.com/index.php?page=45
사용하는 경우-#
동적 콘텐츠를 변경#
에서#
그리고 그 서버에서$_REQUEST["_escaped_fragment_"]
은 무엇 googlebot 대신 사용하는#!
. 다른 말로,./#!페이지=1
로 된다./?_escaped_fragments_=페이지=1
. 또한 사용자는 이를 사용할 수 있는 FF.b4 또는 크롬,역사입니다.pushstate 으({"foo":"bar"},"에 대한","./?페이지=1");
훌륭한 명령입니다. 그래서 비록 주소 표시줄에는 변경된 페이지가 다시 로드되지는 않습니다. 이를 사용할 수 있습?
대신에#!
유지하는 동적인 내용과 또한 서버에 알려할 때 당신은 링크를 이메일 우리가 우리가 이 페이지 AJAX 하지 않습을 만들 필요가 다른 추가 요청을 합니다.
-Don't 링크를 사용하는 말"다 여기를 클릭하". You'다시을 낭비하는 서구의 기회 그것은 일을 어렵게 사람을 위해니다.
-는XML 사이트 맵,바람직하게는 기본 위치는/sitemap.xml
.
-사용하여<link rel="정식".../>
할 때 여러 Url 을 가리키는 동일한 콘텐츠,이 문제를 처리할 수도 있습에서Google 웹마스터 도구.
-사용하여구글은 웹마스터 도구와빙 웹마스터 도구.
-설치Google 애널리틱스오른쪽에서 시작(또는 오픈 소스 분석 도구는 다음과 같의 의견).
-는 방법을 알robots.txt검색 엔진은 거미 작동합니다.
-요청을 리디렉션(용 301Moved Permanently)요청
www.example.com를
example.com`(또는 다른 방법으로 라운드)분할을 방지하기 위해 google 순위 사이에 두 곳입니다.
알고 있을 수 있다는 심하게 행동하는 거미는 거기에있다.
-이 있는 경우 텍스트가 아닌 내용으로 보 Google's sitemap 확장을 위한 비디오 등입니다. 거기에 몇 가지 좋은 정보에서 이것에 대해[팀 Farley's답변.
기술**
-이해HTTP그리고 같은 것들 GET,POST,세션,쿠키,그리고 무엇을 의미하는지"stateless".
-적XHTML/HTMLCSS에 따라W3C 사양확인검증. 여기에 목표를 방지하는 것입 브라우저는 단점이드 보너스로 훨씬 쉽게 작동하는 기존의 브라우저 화면 독자 및 모바일 장치가 있습니다.
-을 이해하는 방법을 자바 스크립트에서 처리되는 브라우저입니다.
-을 이해하는 방법을 자바스크립트,스타일 시트,및 다른 사용하는 리소스 페이지 로드 및에 미치는 영향을 고려식성능입니다. 그것은 지금으로 널리 적절한스크립트로 이동하는 맨 아래당신의 페이지 예외적으로는 같은 것들을 분석 애플리케이션 또는 HTML5shim.
-는 방법을 이해하 JavaScript 샌드박스,작동하려는 경우에 특히 유용 iframe.
-인식 자바스크립트 수 및 비활성화됩니다,그는 아약스에 따라서 확장,지를 계산할 수 있습니다. 는 경우에도 대부분의 일반 사용자가에 그것을 떠나 이제는 기억,NoScript더 많은 인기를 끌고,모바일 장치의 예상대로 작동하지 않을 수 있습니다,그리고 구글지't 행의 대부분은 당신의 자바스크립트 인덱싱이다.
-배우차이 301and302 재(이것은 또한 서구 문제가 있습니다.)
-배울 만큼 당신에 대해 할 수 있는 배포 플랫폼입니다.
-사용하십시오리셋 스타일 시트또는정상화합니다.css.
-고려 JavaScript 프레임워크(예:jQuery,mootools 의,프로토타입,Dojo또는YUI3)을 숨길 수있는 많은 브라우저의 차이점을 자바스크립트를 사용할 때 DOM 습니다.
인 인식의 성능과 JS 프레임워크를 함께 사용하는 것과 같은 서비스구글 라이브러리 API로드 프레임워크는 브라우저를 사용할 수 있습의 복사본을 프레임워크는 이미 캐시기보다는 다운로드 복사본에서의 사이트입니다.
-Don't 바퀴를 재발견 할 수 있습니다. 아무것도 하기 전에 검색에 대한 구성 요소 또는 예제에서 어떻게 그것을 할 수 있습니다. 가 99%기회는 누군가가 그것을 수행하고 발표했 OS 버전의 코드입니다.
-Flipside 의 것,don't 을 시작으로 20 기 전에 라이브러리를've 도 결정의 요구가 무엇인지. 특히 클라이언트 측의 웹디 it's 거의 항상 더 궁극적으로 중요한 물건을 유지하는 가볍고,빠르고 유연합니다.
버그 수정
이해 당신'll spend20%시간의 코딩과 지구 온난화의 80%를 유지하는,그래서 코드습니다.
-설정하는 좋은 오류 보고의 솔루션입니다.
-는 사람들을위한 시스템을 연락처로 당신을 제안 및 비판입니다.
-문서 애플리케이션이 어떻게 작동하는지를 위한 미래 지원하고 사람들이 수행하는 유지 보수입니다.
-자주 백업! (고 있는지 확인 백업 기능)이 있는 복구 전략을,단지 백업 전략입니다.
-사용하여 제어 시스템을 저장하는 파일과 같은전복,Mercurial또는Git.
-Don't 하는 것을 잊지 당신의 승인 테스트. 프레임워크는 다음과 같셀레늄도움이 될 수 있습니다. 특히면 완전히 자동화할 수 있습니다 테스트는,아마도를 사용하여 지속적인 통합 도구와 같은Jenkins.
-는지 확인할 수 있는 충분한 장소에 로그인을 사용하여 프레임워크와 같은log4j,log4net또는log4r. 뭔가 잘못되면 라이브 사이트에서,당신은 당'해야의 방법을 찾는다.
-로그인할 때을 포착하는지 확인 모두 예외 처리 및 처리되지 않은 예외가 있습니다. 보고서/분석하고 로그 출력,그것이'll 어디에 있는지 보여주 핵심적인 문제로 귀하의 사이트입니다.
기타
-를 모두 구현하는 서버측과 클라이언트 측면을 모니터링 및 분석(한 적극적인 보다는 오히려 반응성).
-과 같은 서비스를 사용 UserVoice 및 내부통신기(또는 어떤 다른 유사한 공구)을 지속적으로 유의 터치와 함께 사용자에게 있습니다.
따라트 빈센트 드리센비'sGit 분기 모델의
물건을 많이 생략하지 않기 때문에 그들이'다시 유용하지 않는 답변이지만,때문에 그들이'다시 중 하나가 너무 상세한 범위를 벗어나,좀 너무 멀리 가지를하고자하는 사람에 대한 개요를 얻을 것을 그들이 알고 있어야 합니다. 을 주시기 바랍 편집 이뿐만 아니라,아마 일부를 놓친 물건 또는 몇 가지 실수를했다.