검색결과 리스트
HTML5웹표준에 해당되는 글 7건
- 2015.08.08 워드프레스 창시자 매튜 뮬렌웨그 방한기 정리
- 2015.08.08 워드프레스(Wordpress)의 장단점을 알아보자구요.
- 2015.08.08 Wordpress 이해하기
- 2014.06.11 03. <section>,<article>, <footer>, <aside>태그
- 2014.06.09 HTML5 태그 <Nav>태그
- 2014.06.09 HTML5 첫번째 태그 <header>태그
- 2014.06.09 HTML의 변천과 웹 접근성
글
“화장실에서도 쉽게 쓰는 워드프레스 만들겠다”
2014년 6월 1일 워드프레스 창시자인 매트 뮬렌웨그가 방한 했습니다. ^^
매트 뮬렌웨그는 한국워드프레스모임이 6월1일 서울 디캠프에서 개최한 ‘워드프레스 미트업’에 참석해 강연하고
워드프레스 창시자인 매트 뮬렌웨그는 페이스북 창시자인 마크 주커버그하고도 많이 비교되는 개발자로 나이도 30살 동갑내기에 비슷한 시기에 창업을 하고 비슷한 시기에 성공을한 젊은 기업가입니다.
하지만 국내에서의 매트 뮬렌웨그의 인지도는 상대적으로 낮은편이지만 전세게 웹사이트 5개중에서 1개가 워드프레스로 만들어지고 있다는 사실은 괄목할만한 사안이죠.
매트 뮬렌웨그는 6월 1일 서울 강남 디캠프에서 한국 워드프레스사용자 모임 미트업 행사에 참석하여 2시간여동안 강연과 질의응답 일정을 소화하였고 가장 최종적인 목표로 스마트폰을 통해 블로그를 활용하거나 사람들이 화장실에 있을때도 워드프레스를 사용할 수 있도록 하는것을 목표로 한다고 발표했습니다.
매튜 뮬렌웨그는 웹이 점차 폐쇄적으로 변화하고 있는데 대해 심히 우려를 표시했다고 합니다. 특히 웹이 특정 기업으로 그 힘이 집중되는 흐름에 대해서도 경계심을 드러냈으며 웹의 폐쇄성, 네트워크의 집중화라는 흐름에 대해 그는 “싸워야 한다”고 강조했다고 한다. 매뉴 뮬렌웨그는 그것이 워드프레스가 걸어온 길이며 앞으로 걸어갈 길이라고 했다.
[사진출처 : 블로터]
'HTML5웹표준' 카테고리의 다른 글
워드프레스(Wordpress)의 장단점을 알아보자구요. (0) | 2015.08.08 |
---|---|
Wordpress 이해하기 (0) | 2015.08.08 |
HTML의 변천과 웹 접근성 (0) | 2014.06.09 |
설정
트랙백
댓글
글
1. 워드프레스의 장점
- 모바일, PC, 태블릿에 최적화된 반응형 웹
- 웹 접근성 (Web Accessibility)
- 무료 플러그인의 사용으로 인한 저렴한 제작 비용
- 쉽고 빠르게 홈페이지 제작가능
- 수많은 테마 및 플러그인 제공
- 강력한 SNS연동 서비스
- 쉬운 유지보수 (HTML, CSS, PHP를 모르는 일반인도 가능)
- 검색엔지 최적화(SEO : Search Engine Optimization) : 구글 검색엔진에 최적화
2. 워드프레스의 단점 [설치형 워드프레스 한국어 사이트 : http://ko.wordpress.org/]
가입형 워드 프레스는 사이트에 접속하여 회원가입하면 블로그 무료 개설 됩니다. 특별하게 뭔가를 튜닝해야하는 부담이 없는 국내의 네이버 블로그와 티스토리와 비슷한거죠. 즉, 제공되는 콘텐츠만 사용할 수 있는 대신 손쉽게 사용할 수 있어서 좋구요 다만 아이디로 가입하면 해당 도메인 사이트 주소뒤에 Wordpress.com이 붙습니다.
'HTML5웹표준' 카테고리의 다른 글
워드프레스 창시자 매튜 뮬렌웨그 방한기 정리 (0) | 2015.08.08 |
---|---|
Wordpress 이해하기 (0) | 2015.08.08 |
HTML의 변천과 웹 접근성 (0) | 2014.06.09 |
설정
트랙백
댓글
글
1. Wordpress는 뭘까?
워드프레스(Wordpress)는 오픈소스 기반의 빠르게 홈페이지나 블로그를 제작할 수 있는 CMS(Contents Manage System) 의 한 종류라고 할 수 있습니다.
우리나라로 치자면 제로보드나 XE같은 종류라고 할까요?
이게 미쿡에서 만들어 지다 보니 주로 미국언어인 영문으로 제작되는것을 기본으로 합니다.
그래서 처음 접근할때는 영문으로만 되어 있어서 많이 낯설었습니다.
워드프레스 외에도 CMS의 종류에는 줌라(Joomla), 드루팔(Drupal), 마젠토(Magento), 스퀘어스페이스(Squarespace)등 다른 CMS도 많이 있답니다.
이중 전체 CMS중 워드프레스가 61.1%의 시장을 점유하고 있고 줌라는 2위에 랭크되어 있답니다.
드루팔은 시장 점유율 3위에 있구요.
줌라로 제작된 사이트로는 우리가 알수있는 사이트 중에 시티은행, 하버드 대학교가 있답니다.
드루팔로 제작된 사이트로는 미국 백악관, 국내 전쟁기념관(요거 울나라 껍니다.)
하지만 드루팔과 줌라는 국내제작사례는 적은편입니다. 아무래도 드루팔과 줌라에 관련된 기술문서가 영어로 되어 있고 워드프레스보다 복잡하고 개발자환경이다 보니 그런것 같습니다.
우리나라의 국내 토종 CMS로는 XE, 그누보드, 텍스트큐브, 킴스큐 등이 있구요.
XE와 제로보드느4는 별개로 개발된 CMS입니다.
2. Wordpress 기본정보
워드프레스는 2014년 11월에 워드프레스 4.0이 출시되면서 다국어를 지원하게 되었고 특히 한국어도 지원하게 되었답니다.
워드프레스를 사용할때 사용하는 사이트로는 크게 2개로 나뉘어 지거든요. 둘중에 하나를 사용하는 거죠.
Wordpress.com : 가입형 서비스 제공
Wordpress.org : 설치형 서비스 제공
그럼 우린 어떤걸 사용해야 할까요???
단순 블로그 운영을 원한다면 크게 공부할 필요없는 가입형 서비스를 이용하시구요.
기업형에 해당하는 홈페이지를 만들어야 한다면 다양한 테마와 플러그인사용자는 설치형 서비스 이용하도록 합니다.
오늘은 여기까지 ^^
'HTML5웹표준' 카테고리의 다른 글
워드프레스 창시자 매튜 뮬렌웨그 방한기 정리 (0) | 2015.08.08 |
---|---|
워드프레스(Wordpress)의 장단점을 알아보자구요. (0) | 2015.08.08 |
HTML의 변천과 웹 접근성 (0) | 2014.06.09 |
설정
트랙백
댓글
글
HTML5는 시멘틱 태그가 주류를 이룬다. 그래서 그동안 <DIV>태그에 ID의 이름으로 수없이 사용하던 #의 이름들중에 하나의 태그로 자리 잡게 되었다.
그 첫번째가 전체 콘텐츠를 지정하는 <SECTION> 태그이다.
Contents는 홈페이지에서 정보부분에 속하는 내용으로 주로 영역별 내용을 담아둔다.
그러나 <section>태그 자체에 내용을 넣지는 않고 세부 내용은 <article></article>태그안에 담는다.
01. <section>태그
<section>태그는 문서에서 콘텐츠 영역을 나타낸다.
<section>과 <article>태그와 혼동되기도 하는데 <section>태그는 <header>태그나 <footer>태그와 비교해서 콘텐츠 영역을 구분 짓는 용도로 사용하고 실제 콘텐츠 내용은 <section>태그 안에 <article>태그를 이용해서 표시한다.
02. <article>태그
<article>태그는 블로그의 포스트나 웹사이트의 내용, 사용자가 등록한 코멘트, 독립적인 웹 콘텐츠 항목이 모두 여기에 해당한다. 즉, <section>태그는 콘텐츠기준이라기 보다 헤더, 섹션, 푸더를 구분하기 위한 기능상의 구분이고, <section>태그를 이용해 콘텐츠 영역을 구분하고 <article>태그로 내용을 입력하는 것이다.
03. <footer>태그
<footer>태그는 본문 내용 아래 푸더 정보표시를 한다.
<footer>안에는 <Header>나 <section>, <article>등 다른 레이아웃 태그 모두 사용할 수 있고 다양한 정보를 포함 할 수 있다.
04. <aside>태그
<adise>태그는 본문내용 외에 주변에 표시되는 기타 내용들 표시한다.
블로그 등에서 왼쪽이나 오른쪽, 혹은 하단에 표시되는 광고나 링크같은 사이드바에 사용하는 태그이다.
'HTML5웹표준 > 태그(TAG)' 카테고리의 다른 글
HTML5 태그 <Nav>태그 (0) | 2014.06.09 |
---|---|
HTML5 첫번째 태그 <header>태그 (0) | 2014.06.09 |
설정
트랙백
댓글
글
<Nav>태그
Nav태그는 같은 사이트 안의 문서나 다른 사이트의 문서로 연결하는 링크를 나타낸다.
보통 <nav>태그는 웹사이트에서 네비게이션 부분인 메뉴 부분에 많이 사용되며 <nav>태그는 <header>나 <footer>태그 또는 <article>태그 안에 포함 시킬수도 있고 독립하여 사용할 수 도 있다. 즉, 위치에 영향을 받지 않는다.
문서 안에 여러 개의 <nav>태그를 사용하는 경우 따로 ID를 지정해주어 스타일시트에서 그 스타일을 지정.
<!DOCTYPE html> /* HTML5문 선언하는 독타입 */
<head>
<meta charset="utf-8">
<title>내가 처음 만드는 HTML5 문서</title>
</head>
<body>
<header> /*컨텐츠의 헤더 */
<h1>메뉴만들기</h1> /*제목쓰기*/
<nav> /*메뉴 네이게이션 태그 시작*/
<ul>
<li><a href="#">회사소개</a></li>
<li><a href="#">제품소개</a></li>
<li><a href="#">묻고답하기</a></li>
<li><a href="#">공지사항</a></li>
</ul>
</nav>
</header>
'HTML5웹표준 > 태그(TAG)' 카테고리의 다른 글
03. <section>,<article>, <footer>, <aside>태그 (0) | 2014.06.11 |
---|---|
HTML5 첫번째 태그 <header>태그 (0) | 2014.06.09 |
설정
트랙백
댓글
글
<header>태그는?
그동안 html4에서 <div>태그의 ID가 하던일을 시멘틱 태그로 자리잡은 태그중에 하나이다.
말 그대로 헤더 즉, 말머리가 되는 부분, 내용의 핵심이 되는 타이틀 부분을 지칭한다고 생각하면 된다.
HTML5의 구조를 보자면 다음과 같다.
-
Header태그는 특정부분의 머리말(hedaer)에 해당.
-
사이트 전체의 제목부분이 될 수도 있고 <article>의 제목이 될 수도 있다.
-
주로 사이트 시작 부분에 사용하는 헤더는 사이트 맨 위나 왼쪽에 주로 삽입하고 헤더 안에 <form>태그를 사용해서 검색 창을 넣어가 <nav>태그를 사용해 사이트 메뉴를 넣는다.
-
<hedaer>태그안에는 단순히 <hedaer>의 내용만 들어갈수도 있으나 <nav>태그를 포함하여 메뉴 네비게이션의 위치도 함께 포함할 수 있다.
'HTML5웹표준 > 태그(TAG)' 카테고리의 다른 글
03. <section>,<article>, <footer>, <aside>태그 (0) | 2014.06.11 |
---|---|
HTML5 태그 <Nav>태그 (0) | 2014.06.09 |
설정
트랙백
댓글
글
HTML은 1989년 팀 버너스리가 개념을 만든 이래 올해 THML5 최종 권고안이 발표예정이고
현재는 이런 내용들로 모두 웹표준이라는 부분으로 발달해 가고 있다.
2. 웹 접근성이란?
-
월드 와이드 웹 (World Wide Web)을 창시한 팀 버너스 리(Tim Berners-Lee)는 웹이란 '장애에 구애 없이 모든 사람들이 손쉽게 정보를 공유할 수 있는 공간'이라고 정의하였으며, 웹 콘텐츠를 제 작할 때에는 장애에 구애됨이 없이 누구나 접근할 수 있도록 제작하여야 한다고 하였다.
-
접근성이란 장애인뿐만 아니라 모든 사람이 정보통신 기기나 서비스를 손쉽게 활용할 수 있도록 만드는 것을 말하는 것이다.
-
월드 와이드 웹 컨소시엄(W3C: World Wide Web Consortium)웹 접근성 이니셔티브(WAI: Web Accessibility Initiative)링크와 짐 대처 (Jim. Thatcher)는 웹 접근성에 대해 매우 현실적으로 정의하고 있다. 즉, 장애를 가진 사람들이 웹 콘텐츠를 인지하고, 편리하게 사용할 수 있으며, 그 내용이 이해하기 쉬워야 하며, 견고성을 지녀야 웹 접근성이 있다고 보는 관점이다. 인터넷 전자도서관인 Wikipedia 는 웹 접근성의 개념을 웹 콘텐츠 뿐만 아니라 인터넷을 통하여 전달될 수 있는 모든 콘텐츠로 확대하고 있다.
'HTML5웹표준' 카테고리의 다른 글
워드프레스 창시자 매튜 뮬렌웨그 방한기 정리 (0) | 2015.08.08 |
---|---|
워드프레스(Wordpress)의 장단점을 알아보자구요. (0) | 2015.08.08 |
Wordpress 이해하기 (0) | 2015.08.08 |