이제는 피해야 할 낡은 HTML 작성 스타일 7가지
(dev.to)1. <script> 및 <style> 태그에서 type 속성 사용하기
예전에는 type="text/css" 또는 type="text/javascript"와 같이 사용했지만, 이제는 단순히 <script> 또는 <style>만 사용해도 충분함.
2. Javascript 사용해서 아코디언 메뉴 만들기
<details>와 <summary>를 사용하여 HTML만으로도 간단히 구현할 수 있음.
3. <header>와 <footer>는 페이지당 한 번만 사용하기
일부 사용자는 <header>와 <footer>가 페이지 전체의 머리글과 바닥글을 나타낸다고 생각할 수 있지만, 실제로 이 요소들은 가장 가까운 섹션과 관련이 있음. 즉, <article>, <aside>, <nav>, <section> 요소의 자식으로 사용할 수 있으며, 새로운 섹션을 만들 때 <header>와 <footer>를 사용하는 것이 좋음.
4. <iframe>의 테두리를 제거를 위해 frameborder="0"을 사용하기
frameborder="0"을 사용하던 것은 HTML5에서 더 이상 권장되지 않음. 대신, CSS를 사용하여 iframe { border: none; } 과 같이 설정하는 것이 좋음.
5. IE8 지원하기
Internet Explorer 8뿐만 아니라 모든 버전의 Explorer 지원을 멈춰야 함. Microsoft는 2022년 6월에 IE 11에 대한 지원도 중단했으므로, 우리도 더 이상 IE 지원을 고려할 필요가 없음.
6. 헤딩 태그 무작위로 사용하기
페이지 구조에 따라 헤딩 태그를 사용하고, 내림차순으로 작성해야 함. 마지막 태그가 <h2>였다면, 다음은 <h2> 또는 <h3>를 사용해야됨.
7. HTML 태그의 Boolean 속성을 위해 ="1" 추가하기
HTML 태그의 Boolean 속성은 단순히 속성 자체만 작성해도 값이 true로 설정됨. 예를 들어, <input type="text" value="This input is disabled" disabled />와 같이 disabled 속성이 있으면, 그 자체로 true임을 의미하기 때문에 ="1"을 추가할 필요없음.
<script>의 type 속성은 모듈 넣을 때 필요하지 않나요?
<script type="module" src="home.js"></script>
html5 가 나온이유가 그전애 html 을 태그와 상관없이 사용했기 때문이죠. html 은 마크업랭귀지 이기 때문에 데이터를 담는 그릇이라고 보고 다루는 게 중요하다고 생각해요. 그리고 type 은 typescript (ts) 등을 다른 타입을 쓸때는 꼭 명시해야하니 생략을 너무 강조할 필요 없을 듯.
더 중요한 건 요즘 유틸성 class 명을 사용하는 사람들이 많은데, 데이터를 담는 거라느 부분에서 도움이 안 될 수 있습니다.
예를 들어 title 정보를 담았다면
h1, h2, h3 를 쓰더라도 class 는 title 이라고 하면 더 명시적이고 좋습니다.
근데 <div class="ts-12 tc-red"> 이런식으로 class 명을 만드는 건 좋은 방향이 아닙니다. title 이랴고 주고 css 로 해결하는 방향이 앞으로 더 오래 남을 수 있는 웹 페이지가 될 수 있습니다.
구조가 비교적 단순한 정보전달 목적의 웹페이지라면 시맨틱 태그와 클래스를 적용하는 것이 자연스럽습니다. 다만 모든 HTML/CSS 사용자가 웹 페이지만을 작성하지는 않습니다. 웹 애플리케이션같이 시각 요소를 위한 마크업 사용이 불가피하고 구조가 복잡한 경우에 일반적인 클래스명을 사용하면 이름이 충돌하게 됩니다. 앵귤러의 뷰 캡슐화 같은 기능이 그래서 필요한 거구요
이 코드 아직도 보이는데 ㅋㅋ
<style type="text/css">
<!--
.class {
zoom:1;
}
-->
</style>
<script language="javascript">
<!--
document.all.form.onsubmit = "functionName";
-->
</script>
올해에 본 코드입니다.
왜 이랬는지 아시는분 여기 있을려나 ㅋㅋ
추억의 코드들이죠
과거 script 태그와 style 태그를 제대로 지원하지 못하던 브라우저에서 스타일코드와 js코드를 주석처럼 인식시키기 위해서 html 주석으로 감싸던 시절이 있었죠.
90년대 2000년대일텐데..
아직 그런 코드를 작성하시는 분이 좀 계실듯..