'이것은 혁명이 될 것이다'라는 기사가 나온 후. 물론 업계 내외의 도전도 있었지만, 더 중요한 것은 모든 세부 사항을 요구하는 사람들이 늘어났다는 것입니다. 오늘 밤은 일찍 집에 들어와 아주 일찍 잠자리에 들었습니다. 한밤중에 꿈에서 깨어났는데, 꿈에서 저는 초등학교 때 친구들과 함께 "The Next"라는 게임을 하고 있었습니다. 아침에 일어나서 뭔가 해야겠다는 생각이 들어서 결국 TMENU를 수정했습니다(오랜 시간 미뤄졌었습니다). 그다음에 앞서 언급한 5가지 사항에 대해 실제 사례를 자세히 적어야겠다는 생각이 들었습니다. 그래서 이 글을 쓰기 시작했습니다.
꿈에서는 초등학교로 돌아가는 것이 합리적입니다. 하나는 'The Next' 게임이 생각난다는 것이고, 다른 하나는 나와 피아오피아오가 다른 사람들에게 자주 하는 말이다. HTML을 잘 배우려면 먼저 초등학교 때 중국어 책을 읽어야 한다. 초등학교로 돌아가는 이유는 그곳의 책들이 너무 과한 시험 위주의 교육에 방해받지 않을 것이고, 그 안에 담긴 '본질'에는 진정성이 있고, 중국어 책은 제목, 문단, 목록 등 HTML의 본질을 뜻하기 때문이다. , 및 참고문헌.
HTML 학습의 본질은 무엇이든 사용하는 것입니다. ——Ghost. 물론 이 문장에는 설명이 필요하며 참고예는 초등학교 중국어 책입니다.
먼저 홈페이지 제작 과정을 살펴보겠습니다. 내 기억으로는 나의 첫 웹사이트가 1998년에 만들어졌다. 당시 사람들은 테이블을 이용해 웹페이지를 만들었다. 테이블 시대에 우리가 찾는 가장 어려운 질문은 무엇입니까?
고유한 3행 및 무한 열 레이아웃:
고유한 1픽셀 테두리:
테이블 시대(내 기억으로는 2001년경) 이후
를 사용하는 사람들이 처음으로 등장했다. 그래서 중국에는 CSS 트렌드가 있었습니다. 사용법은 그것을 여러 테이블에 넣은 다음 CSS의 절대 위치 지정을 사용하고 일부 JS를 추가하여 떠다니게 만드는 것입니다. 나중에 어떤 사람들이 CSS를 공부하기 시작했습니다. "Fengren Design" 초기에 CSS 책을 들고 나에게 이것 저것 이야기를 나누는 사람들이 많았던 것으로 기억됩니다. 이 사람들은 결국 직업을 바꿨습니다.) 이때 가장 어려웠던 주제가 당시 '자바 특수효과'라 불리던 동동을 만드는 것이라고 느꼈습니다. 이때 어떤 사람이 제안한 XML에 매료됐지만 이를 일종의 데이터 저장소 정도로만 여겼습니다. (실제로 이것은 Qzone 구현의 프로토타입이기도 했습니다.)
2004년 5월 1일, 세계 노동절을 맞아 전자산업출판사는 "웹사이트 재구성 - 웹 표준으로 디자인하기"라는 책을 번역하여 출판했습니다. 그 결과 "DIV CSS"에 대한 믿음이 전국적으로 퍼졌습니다. 이는 그야말로 중국 웹사이트 재구성의 획기적인 시작이 시작되었음을 의미하지만, 다른 관점에서 보면 이 책은 중국의 WebReBuilder를 화덕에서 끌어내던졌습니다. 또 다른 화덕으로. 나는 이 책을 수당시대의 관점에서만 볼 수 있다고 생각한다. 왜냐하면 그것은 단지 혁신적인 황제와 새로운 왕조의 탄생을 의미할 뿐, 본질적으로 사회 변화와 진화를 촉진하지는 않기 때문입니다. 이 책은 테이블 중첩을 div 중첩으로 바꿉니다. 그 당시(지금까지) 가장 인기 있는 말은 "내 웹사이트는 'DIV CSS'로 만들어졌습니다."였습니다. 이때 저는 이 유행에 동참하지 않았고 아직 풀리지 않은 매우 중요한 질문이 있기 때문에 기다리고 있었습니다. 해결됨: "왜? 'TABLE CSS' 대신 'DIV CSS'가 필요합니다.":
"This Will Be a Revolution"의 인용문:
먼저 두 가지 예를 살펴보겠습니다. 표면적으로 테이블과 div는 동일하지만 제품 관리자가 수정을 제안하면 성능이 변경되어야 합니다. div는 이 유형으로 쉽게 변경할 수 있습니다. html을 수정하지 않으면 테이블이 죽더라도 그러한 변경을 완료할 수 없다는 것을 예제에서 볼 수 있습니다. "DIV CSS"는 조판 자유화로 인해 "TABLE CSS"보다 낫습니다. 위의 예를 예로 들면 테이블은 수명 동안 이를 달성할 수 없습니다.
Qzone3.0쯤에서야 위의 답을 찾기 시작했는데 거의 1년이 걸렸습니다. 그러다가 Qzone4.0에서는 "dl, dt, dd" 3개의 마커와 TMENU의 탄생이 사용되었습니다. 지금 매우 후회되는 것은 모든 사람을 또 다른 세대 간 시작인 "XHTML CSS"로 데려왔으며 동시에 모든 사람을 새로운 뜨거운 침대로 데려왔다는 것입니다. 뜨거운 침대에 들어가기는 쉽지만 빠져나오기는 어렵다. 그제서야 두 명의 재건축 연예인인 아지에(Ajie)와 라오간(Lao Gan)이 점차 인터넷에서 사라지는 이유를 이해하기 시작했다. 저는 이전에 일어난 일에 대해 그들을 비난하기보다는 이해하기 시작했고, 마음 속으로 은밀한 결정을 내리기도 했습니다. '건전한 경쟁'의 초석을 다진 'SB' 콘셉트가 시작됐다.
역사적 여정은 위와 같습니다. HTML 학습의 본질로 돌아가는 것은 무엇이든 사용하는 것입니다. 즉, 태그는 남용될 수 없으며 콘텐츠의 본질로 돌아가는 태그는 자격을 갖춘 태그입니다. TMENU를 예로 들어보겠습니다.
앞의 HTML 코드는 다음과 같습니다.
현재 HTML 코드는 다음과 같습니다.
메뉴리스트는 다음과 같습니다
둘의 차이점은 누구나 알 수 있습니다. 추가 지도 태그와 hn 태그가 있습니다. 왜 이런가요? 또 다른 예를 살펴보겠습니다. 놀이터에는 다양한 브랜드, 모양, 색상의 자동차 100대가 있습니다. 이제 이러한 자동차를 여러 그룹으로 나누고 선택할 수 있는 목록을 제공하겠습니다. 물론 목록을 사용하는 것은 누구나 생각할 것입니다. 하지만 이 목록이 무엇을 나타낼 수 있는지 생각해 본 적이 있나요?
인용 예시
- XXX 브랜드 XXX 모델
- XXX 브랜드 XXX 모델
아니면
인용 예시
- XXX 브랜드 XXX 모델
- XXX 브랜드 XXX 모델
위 목록의 경우 이 목록의 분류가 어떻게 구성되어 있는지, 왜 하나는 순서가 지정되고 다른 하나는 순서가 지정되지 않는지 전혀 이해가 되지 않습니다. 어떻게 이렇게 배열되어 있고 왜 모아져 있는 걸까요? 많은 질문이 있습니다. 다음 예를 다시 살펴보겠습니다.
인용예
옐로우계열차
- XXX브랜드 XXX모델
- XXX브랜드 XXX모델
아니면
인용예
제조연도
- XXX브랜드 XXX모델
- XXX브랜드 XXX모델
위의 예는 누구나 한눈에 알 수 있습니다. 모든 내용이 명확해졌습니다. 그런데 TMENU 코드에 왜 지도 태그가 있는 걸까요? 예를 살펴 보겠습니다.
위의 예는 물론 맞습니다. 하지만 이러한 구조는 사용자에게 매우 바보같은 느낌을 줄 것입니다. 사이트 이름과 자막 뒤에 사이트맵 탐색 메뉴가 있는 것은 아닌가요? (
은 구체적으로 상단에 메뉴가 있는 사이트를 의미합니다) 그리고 동시에 HTML 자체에서는 사이트맵 탐색을 구체적으로 참조하는 태그인