1

주제: 위치로그 > 리스트

현재 위치로그는 리스트 엘리먼트가 아니라 div 앨리먼트로 되어 있습니다.

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<s_local_spot_rep>
<div class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]
</div>
</s_local_spot_rep>
<s_local_info_rep>
<div class="locationInfo" style="margin-left: [##_local_info_depth_##]px;"> 
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a> 
</div>
</s_local_info_rep>
</s_local>

이렇게 되어 있는데 div를 쓰는건 의미에 맞지 않는다고 생각이 들어서
리스트 앨리먼트 (ul, dl, dd, dt, li...)와 해딩 앨리먼트 (h1, h2, h3...)를 적절히 쓰면 마크업상으로도 꽤나 멋있는 구조화가 가능할 것 같은데
도저히 제 머리로는 안되네요 하하 llorz

누구 멋있게 마크업해볼 분 안계신가요~?

(리스트 앨리먼트를 쓰게 된다면 굳이 local_info_depth, local_spot_depth 등의 치환자는 없어도 될 듯 하고,
그래서 0.1초라도 서버에 덜 부담을~?)

나니 (2006-09-23 06:21:40)에 의해 마지막으로 수정

하늘은 스스로 삽질하는 자를 삽으로 팬다

2

답글: 위치로그 > 리스트

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<ul class="locationlist">
<s_local_spot_rep>
<li class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]</li>
</s_local_spot_rep>
</ul>
<s_local_info_rep>
<h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a>
</h4>
</s_local_info_rep>
</s_local>

"Everything looks different on the other side."

-Ian Malcomm, from Michael Crichton's 'The Jurassic Park'

3

답글: 위치로그 > 리스트

inureyes 작성:

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<ul class="locationlist">
<s_local_spot_rep>
<li class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]</li>
</s_local_spot_rep>
</ul>
<s_local_info_rep>
<h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a>
</h4>
</s_local_info_rep>
</s_local>

역시 교주님!!!!

하늘은 스스로 삽질하는 자를 삽으로 팬다

4

답글: 위치로그 > 리스트

그렇지만... 애초부터 local_info_depth라는 치환자가 margin-left를 의미하게 만든 것 자체가 맘에 안 듭니다. -_-;;
의미적인 depth를 만들 수 없잖아요. (..그렇다고 시맨틱하게 고치자니 치환자 서너 개는 더 만들어야 할 듯한..)

문제의 답은 우리 안에 있다.
내면에 귀를 기울여 보자.

5

답글: 위치로그 > 리스트

음 저 소스대로라면 <h4>...</h4>가 li로 감싸지지 않아서 vaildator에서 블라블라 거리는 문제가 발생;;
그렇다고 단순히 li로 감싸자니 전혀 다른 의미인 부분이라 li 쓸 수도 없고;;
고민해봐야겠는걸요;;

하늘은 스스로 삽질하는 자를 삽으로 팬다

6

답글: 위치로그 > 리스트

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<dl class="locationlist">
<s_local_spot_rep>
<dd class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]</dd>
</s_local_spot_rep>
</ul>
<s_local_info_rep>
<dt><h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a>
</h4></dt>
</s_local_info_rep>
</s_local>

스타일 빼고는 매우 의미론적으로...

"Everything looks different on the other side."

-Ian Malcomm, from Michael Crichton's 'The Jurassic Park'

7

답글: 위치로그 > 리스트

inureyes 작성:

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<dl class="locationlist">
<s_local_spot_rep>
<dd class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]</dd>
</s_local_spot_rep>
</ul>
<s_local_info_rep>
<dt><h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a>
</h4></dt>
</s_local_info_rep>
</s_local>

스타일 빼고는 매우 의미론적으로...

아하하하하하;; 오타 발견 > _<
교주님 푹 쉬셔야겠습니다;; 오타까지 내시고;

하늘은 스스로 삽질하는 자를 삽으로 팬다

8

답글: 위치로그 > 리스트

ul -> dl이군요 smile
label붙여서 dt와 dd간의 관계를 명확히 해야 할 듯? (명시적으로 하지 않으면 dt의 설명은 뒤에 따르는 dd가 되니...)

"Everything looks different on the other side."

-Ian Malcomm, from Michael Crichton's 'The Jurassic Park'

9

답글: 위치로그 > 리스트

inureyes 작성:

ul -> dl이군요 smile
label붙여서 dt와 dd간의 관계를 명확히 해야 할 듯? (명시적으로 하지 않으면 dt의 설명은 뒤에 따르는 dd가 되니...)

<h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">

더불어 이 부분도;;

하늘은 스스로 삽질하는 자를 삽으로 팬다

10

답글: 위치로그 > 리스트

나니 작성:
inureyes 작성:

(skyblue 스킨기준으로)
<s_local>
<!-- LOCATION -->
<h3>위치로그</h3>
<ul class="locationlist">
<s_local_spot_rep>
<li class="locationSpot" style="margin-left: [##_local_spot_depth_##]px;">[##_local_spot_##]</li>
</s_local_spot_rep>
</ul>
<s_local_info_rep>
<h4> class="locationInfo" style="margin-left: [##_local_info_depth_##]px;">
    <a href="[##_local_info_link_##]">[##_local_info_title_##]</a>
</h4>
</s_local_info_rep>
</s_local>

역시 교주님!!!!

교주님께서도 대단하지만, "토마토와 태터로 태토마토를 만드는..." 나니님 또한 대단하십니다. ㅋㅋ

당신의 삶속에 매화꽃 향기처럼 늘 아름다운 향기로 가득하길...
# J.Parker