이게 퍼블리셔 일인지 디자이너 일인지 모르겠지만..
사이트 디자인할때 목업이나 와이어프레임작업을 할때,
아직 정해지지 않은 자리에 이미지를 넣고 전체 레이아웃등을 봐야 할때가 있습니다.
그럴때 사용하는 서비스? 로
placehold.it ( http://placehold.it/ ) 과 lorempixel ( http://lorempixel.com/ ) 을 종종 사용합니다.
둘다 이미지의 src 에, 웹사이트 주소 뒤에 적절한 문법에 따른 이미지 생성 주소를 사용합니다.
(예: <img src="http://lorempixel.com/400/200" /> ==> 400x200 짜리 랜덤 이미지 )
placehold.it이 단색의 이미지(와 글자) 를 제공해서 와이어프레임 작업에 좋은 반면,
lorempixel은 실제 이미지를 넣어주어서 최종 레이아웃 작업등에 좋은것 같습니다.
###
placehold.it의 문법은 http://placehold.it/400x200/eaa/aee&text=placehold.it
첫번째가 크기 (400x200, 만일 숫자 하나면 정사각형), 두번째가 bg 색, 세번째가 글자색, 그리고 &text= 뒤에 영문자로 글자를 넣을수 있습니다. 글자를 넣지 않으면 원 이미지의 크기가 글자로 나옵니다.
[위 링크의 결과]

[에디터?가 이미지 주소안의 &를 자꾸 html 문자로 바꿔버리네요.. 위 링크를 직접 클릭해보세요.]
###
lorempixel.com 도 비슷한 문법을 사용하는데, http://lorempixel.com/400/200/sports/lorempixel-com/
여기서는 빠져있지만, 첫번째에 'g'를 사용하면 그레이스케일 이미지를, 안쓰면 컬러이미지를,
그다음부터 가로, 세로는 꼭 써줘야 하고,
그 뒤에 특정 카테고리를 지정할 수 있고 (자세한 내용은 홈피를..)
마지막에 넣는 영문자/숫자 (-를 제외한 기호도 안됨)가 이미지의 왼쪽에 눕혀져서 나옵니다.
[위 링크의 결과]

###
혹시 여러분들이 사용하는 비슷한 사이트/서비스/기법이 있으면 같이 공유해요 !!
###사족###
아무 뜻없는 글씨로 유명한 lorem ipsum 등을 만들어주는 사이트도 있기는 한데, 한글이 아니고 매번 생성해서 붙이기도 그렇게 해서 많이 쓰지는 않네요..
사이트 디자인할때 목업이나 와이어프레임작업을 할때,
아직 정해지지 않은 자리에 이미지를 넣고 전체 레이아웃등을 봐야 할때가 있습니다.
그럴때 사용하는 서비스? 로
placehold.it ( http://placehold.it/ ) 과 lorempixel ( http://lorempixel.com/ ) 을 종종 사용합니다.
둘다 이미지의 src 에, 웹사이트 주소 뒤에 적절한 문법에 따른 이미지 생성 주소를 사용합니다.
(예: <img src="http://lorempixel.com/400/200" /> ==> 400x200 짜리 랜덤 이미지 )
placehold.it이 단색의 이미지(와 글자) 를 제공해서 와이어프레임 작업에 좋은 반면,
lorempixel은 실제 이미지를 넣어주어서 최종 레이아웃 작업등에 좋은것 같습니다.
###
placehold.it의 문법은 http://placehold.it/400x200/eaa/aee&text=placehold.it
첫번째가 크기 (400x200, 만일 숫자 하나면 정사각형), 두번째가 bg 색, 세번째가 글자색, 그리고 &text= 뒤에 영문자로 글자를 넣을수 있습니다. 글자를 넣지 않으면 원 이미지의 크기가 글자로 나옵니다.
[위 링크의 결과]
[에디터?가 이미지 주소안의 &를 자꾸 html 문자로 바꿔버리네요.. 위 링크를 직접 클릭해보세요.]
###
lorempixel.com 도 비슷한 문법을 사용하는데, http://lorempixel.com/400/200/sports/lorempixel-com/
여기서는 빠져있지만, 첫번째에 'g'를 사용하면 그레이스케일 이미지를, 안쓰면 컬러이미지를,
그다음부터 가로, 세로는 꼭 써줘야 하고,
그 뒤에 특정 카테고리를 지정할 수 있고 (자세한 내용은 홈피를..)
마지막에 넣는 영문자/숫자 (-를 제외한 기호도 안됨)가 이미지의 왼쪽에 눕혀져서 나옵니다.
[위 링크의 결과]
###
혹시 여러분들이 사용하는 비슷한 사이트/서비스/기법이 있으면 같이 공유해요 !!
###사족###
아무 뜻없는 글씨로 유명한 lorem ipsum 등을 만들어주는 사이트도 있기는 한데, 한글이 아니고 매번 생성해서 붙이기도 그렇게 해서 많이 쓰지는 않네요..
댓글 8개
게시글 목록
| 번호 | 제목 |
|---|---|
| 27425 | |
| 5811 | |
| 5810 | |
| 27422 | |
| 19316 | |
| 5809 | |
| 5808 | |
| 5807 | |
| 5806 | |
| 27421 | |
| 5801 | |
| 24540 | |
| 24537 | |
| 5798 | |
| 30863 | |
| 5795 | |
| 27416 | |
| 5793 | |
| 27405 | |
| 27403 | |
| 19314 | |
| 19312 |
PHP
우분투 서버 셋팅하는 방법
1
|
| 19309 | |
| 19306 | |
| 19304 |
MySQL
트리거를 이용하여 날짜 자동 업데이트법
1
|
| 19303 | |
| 5791 | |
| 27397 | |
| 19298 |
MySQL
mysql 환경 설정
4
|
| 19293 |
JavaScript
달력소스입니다.
4
|
| 19281 |
PHP
웹사이트 주소 알아내기
11
|
| 19278 |
기타
오라클바인딩기술
2
|
| 19275 | |
| 5787 | |
| 5783 | |
| 5781 | |
| 5773 | |
| 32027 | |
| 19271 | |
| 19269 | |
| 19265 |
정규표현식
IE11에서 사라지는것들이랍니다~
3
|
| 19264 | |
| 5771 | |
| 5770 | |
| 27391 | |
| 27389 | |
| 27387 | |
| 5768 | |
| 27384 | |
| 5767 | |
| 5765 | |
| 27379 | |
| 27374 | |
| 5763 | |
| 27371 | |
| 30846 | |
| 5758 | |
| 27365 | |
| 5756 | |
| 5753 | |
| 19256 |
기타
웹접근성 인증 방법
7
|
| 19250 |
MySQL
my-sql 서브쿼리^^
5
|
| 19248 |
MySQL
기초적인 my sql 쿼리문~
1
|
| 5748 | |
| 19245 |
jQuery
xhtml vs json
2
|
| 19244 |
정규표현식
정규식 표현법
|
| 19242 |
웹서버
리눅스 기본 명령어
1
|
| 19241 |
jQuery
ajax 예제 입니다.
|
| 5746 | |
| 5744 | |
| 5738 | |
| 24534 | |
| 5733 | |
| 19232 |
jQuery
jQuery Performance
8
|
| 19228 |
jQuery
jQuery Event - 이벤트에 생명을~
3
|
| 19225 |
jQuery
jQuery Event - bind() 메서드
2
|
| 19222 |
jQuery
jQuery Event - 이벤트 지원 메서드
2
|
| 19220 | |
| 19219 | |
| 19217 | |
| 19216 |
jQuery
jQuery Core
|
| 19215 | |
| 19214 |
jQuery
jQuery Traverse - Filtering
|
| 19213 | |
| 19212 | |
| 19211 | |
| 19210 | |
| 19209 | |
| 19208 | |
| 19207 | |
| 19206 | |
| 19204 | |
| 5728 | |
| 5727 | |
| 5725 | |
| 19200 |
JavaScript
주소표시
3
|
| 30841 |
CSS
CSS 자료 링크
4
|
| 19196 | |
| 19192 | |
| 27359 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기