이전
목록
다음
전

개발/테스트용 가짜 이미지

전진
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 2013-05-01 (수) 03:50:51 · 4800 · 8

링크

http://placehold.it/ (163) http://lorempixel.com/ (143)
이게 퍼블리셔 일인지 디자이너 일인지 모르겠지만..

사이트 디자인할때 목업이나 와이어프레임작업을 할때,
아직 정해지지 않은 자리에 이미지를 넣고 전체 레이아웃등을 봐야 할때가 있습니다.
그럴때 사용하는 서비스? 로
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= 뒤에 영문자로 글자를 넣을수 있습니다. 글자를 넣지 않으면 원 이미지의 크기가 글자로 나옵니다.

[위 링크의 결과]
aee&text=placehold.it
[에디터?가 이미지 주소안의 &를 자꾸 html 문자로 바꿔버리네요.. 위 링크를 직접 클릭해보세요.]

###
lorempixel.com 도 비슷한 문법을 사용하는데, http://lorempixel.com/400/200/sports/lorempixel-com/
여기서는 빠져있지만, 첫번째에 'g'를 사용하면 그레이스케일 이미지를, 안쓰면 컬러이미지를,
그다음부터 가로, 세로는 꼭 써줘야 하고,
그 뒤에 특정 카테고리를 지정할 수 있고 (자세한 내용은 홈피를..)
마지막에 넣는 영문자/숫자 (-를 제외한 기호도 안됨)가 이미지의 왼쪽에 눕혀져서 나옵니다.

[위 링크의 결과]
lorempixel-com

###

혹시 여러분들이 사용하는 비슷한 사이트/서비스/기법이 있으면 같이 공유해요 !!

###사족###
아무 뜻없는 글씨로 유명한 lorem ipsum 등을 만들어주는 사이트도 있기는 한데, 한글이 아니고 매번 생성해서 붙이기도 그렇게 해서 많이 쓰지는 않네요..
#퍼블리셔톡 #퍼블리셔
|

댓글 8개

지지운아빠
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-05-02 (목) 12:52:28
coooooooooooool
퍼퍼블리
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-05-02 (목) 14:05:06
좋은 정보 감사합니다~!! @tmp 이미지 슬라이싱할 필요가 없어지겟는데요!
전전진
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-05-02 (목) 20:53:34
@지운아빠, @퍼블리
쓸만하죠? ^^
mmingQ
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-05-16 (목) 10:04:51
좋네요 ^^!
돼돼지코구뇽
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-06-30 (일) 08:52:43
placehold.it 좋네요!
전전진
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-06-30 (일) 10:11:02
@mingQ, @돼지코구뇽 님
좋죠? ^^
llainfox
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-07-03 (수) 15:54:53
오우!
알알찬돌삐
프로필 보기이 회원 글보기이 회원의 댓글보기
 2013-07-13 (토) 02:09:32
얽 굳
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
13-06-19 조회 8,368
13-06-18 조회 4,987
13-06-17 조회 6,108
13-06-17 조회 3,881
13-06-16 조회 6,192
13-06-15 조회 1.4만
13-06-15 조회 8,901
13-06-15 조회 3,987
13-06-15 조회 3,603
13-06-14 조회 4,789
13-06-14 조회 4,536
13-06-14 조회 3,220
13-06-13 조회 4,134
13-06-13 조회 5,588
13-06-11 조회 3,646
13-06-06 조회 5,375
13-06-05 조회 4,107
13-06-05 조회 3,554
13-06-05 조회 4,316
13-06-04 조회 3,681
13-06-04 조회 6,092
13-05-31 조회 4,810
13-05-30 조회 5,857
13-05-29 조회 4,731
13-05-27 조회 3,960
13-05-24 조회 4,462
13-05-23 조회 5,749
13-05-22 조회 5,445
13-05-21 조회 3,957
13-05-21 조회 4,972
13-05-21 조회 4,497
13-05-21 조회 3,540
13-05-21 조회 4,923
13-05-20 조회 6,653
13-05-20 조회 6,002
13-05-20 조회 4,501
13-05-19 조회 1.1만
13-05-18 조회 5,490
13-05-18 조회 5,657
13-05-18 조회 4,740
13-05-18 조회 6,487
13-05-17 조회 4,460
13-05-14 조회 4,055
13-05-14 조회 4,777
13-05-12 조회 4,377
13-05-11 조회 4,842
13-05-10 조회 4,407
13-05-10 조회 4,614
13-05-10 조회 4,622
13-05-10 조회 4,032
13-05-10 조회 4,184
13-05-09 조회 8,362
13-05-08 조회 4,355
13-05-08 조회 3,624
13-05-08 조회 4,043
13-05-08 조회 5,210
13-05-07 조회 4,015
13-05-07 조회 4,361
13-05-06 조회 4,568
13-05-03 조회 3,933
13-05-03 조회 3,094
13-05-03 조회 4,578
13-05-03 조회 4,181
13-05-02 조회 1만
13-05-02 조회 4,842
13-05-01 조회 4,647
13-05-01 조회 4,801
13-04-29 조회 5,187
13-04-29 조회 3,311
13-04-27 조회 6,626
13-04-26 조회 4,389
13-04-26 조회 9,489
13-04-26 조회 3,972
13-04-22 조회 3,754
13-04-19 조회 3,603
13-04-19 조회 3,320
13-04-19 조회 5,510
13-04-19 조회 4,259
13-04-17 조회 4,542
13-04-16 조회 3,897
13-04-15 조회 5,453
13-04-15 조회 4,366
13-04-15 조회 3,128
13-04-13 조회 6,392
13-04-13 조회 3,755
13-04-12 조회 3,719
13-04-11 조회 3,849
13-04-10 조회 8,514
13-04-09 조회 4,031
13-04-08 조회 5,475
13-04-08 조회 4,857
13-04-08 조회 3,099
13-04-08 조회 5,630
13-04-07 조회 4,149
13-04-05 조회 4,271
13-04-05 조회 4,118
13-04-05 조회 6,005
13-04-05 조회 4,793
13-04-05 조회 6,496
13-04-05 조회 1.1만
글쓰기