전체 글 492

ID 기법 select similar id

아나 하다 보니 끝이 없다. 대충 노가다로 하면 되긴 되는데 더 스마트한 방식을 사용하려다 보니 정말 끝이 없다. 우선 클래스로 다 지정해서 바꿀려고 했는데 그러다 보니 기존 클래스 지정해둔것하고 충돌난다. 참고로 클래스하고 아이디 외에 유니크하지 않은 아이디 기능을 가진것이 있나 찾아봤는데 그런건 없다! 따라서 다 똑같이 쓸래면 클래스를 쓰되 이 클래스는 기존 클래스의 CSS를 복붙해서 새로 CSS를 업데이트하던지. 아니면 아이디를 쓰되 뒷부분만 다 다르게 만들던지 해야한다. 어쨌든 https://stackoverflow.com/questions/26253887/get-all-elements-with-similar-id-array-in-javascript https://stackoverflow.com/..

카테고리 없음 2022.06.22

메타 디스크립션

아직 시제품 상용화도 안되었는데 왜 자꾸 개선점이 튀어나오는지 모르겠다. 본 사이트 이동기는 유저한테 클릭해도 될 만한 신뢰성을 줘야 하는데, 다음 티스토리 발행 구글 메타 디스크립션은 지 멋대로 앞부분만 짤라서 같다 붙이는 방식이니 개선이 필요하다. 문제는 이 메타 디스크립션은 블로그 서비스에 임베디드 되어있어 유저가 접근이 불가능하고, 아니 정확히 말하자면 html header 섹션에 변수명으로 접근은 가능한데 그 변수 자체를 건들 수가 없다. HTML5부터 body 섹션에서 메타 접근이 가능하다고는 하는데 가능하다면 수정 보안을 해 봐야겠다.

개발일지 2022.06.21

모바일 고려 + 광고 테스트

핸드폰과 태블렛으로 체크하면서 모바일 화면에 최적화 된 레이아웃 구성을 노렸는데 순간 궁금해서 찾아본 모바일 쿼리의 결과 PC 화면과 모바일 화면을 구분하여 블로그 body 컨텐츠를 구분해서 표시하는게 좋겠다는 생각이 들었다. 블로그 글 작성을 하나하나 하는것이면 이것은 미친짓이지만 어차피 틀 구성만 세우고 돌려먹기할건데 초기 셋업만 할 것이면 상관없다는 생각이 들었다. 해당 문서는 다음과 같다. https://www.google.com/search?q=%40media+queries&sourceid=chrome&ie=UTF-8 https://www.w3schools.com/cssref/css3_pr_mediaquery.asp https://www.w3schools.com/cssref/css3_pr_med..

개발일지 2022.06.21

모바일 상단 이미지 크기

사이트 이동기의 요점은 유저한테 이동 기능을 제공하는데. 일단 신뢰도를 줘야 한다. 이 놈들이 이상한 사이트로 낚시하지 않는다는 이미지를 제공하고 오랬동안 사이트가 유지됨으로서 신뢰도를 쌓아가는것이다. 그런 관점에서 다음 블로그 기본 제공 웹 디자인의 모바일 웹 디자인을 볼 때. 여기서 상단 이미지가 매우 커서 로딩시 자동으로 눈에 들어오는 본문 내용을 가리는 것은 매우 부적절하다. 그렇다고 아예 이미지가 없는것은 더욱 사용자의 신뢰를 하락시킬 것이다. 따라서 여기서는 구글 개발자 모드에서 해당 이미지를 역추적해 이 부분이 article-header라는것을 확인하고 정보를 흭득했다. 여기서 크기가 px vw라고 나와 있는데 픽셀은 상식으로 아는 그 픽셀이겠고 vw의 개념을 처음 접하게 되었다. https..

개발일지 2022.06.21

스타일 충돌 CSS

티스토리 에디터에서 span tag의 id를 지 멋대로 없애버리는 현상을 발견. 우회를 위해 H태그에 인라인을 삽입하려고 하였지만 왠지 바보같아져 클래스를 생성하기로 했다. 여담으로 이번에 인생 최초로 css란걸 수정해본다. 어쨌든 기본으로 써져있는 코드 보면서 문법 유추해서 수정해서 사용하려고 하는데 시험으로 p태그 클래스 생성한것이 본문에서 적용이 안 되는 현상이 발생했다. 구글 개발자 콘솔로 스타일을 확인해보니 로딩은 되었는데 취소선이 그어져 있다는것을 발견했다. 왜 그런지 검색을 해보니 스타일 충돌 시 더 상세한 내역의 definition이란 소리이다. 이는 higher specificity 또는 더욱 local rule이기 때문에 그렇다. 아니 css 문법도 모르겠고. 어쨌든 여기서도 겐또로 생..

개발일지 2022.06.20