12 inlägg

디지털 작업의 기초부터 마무리까지

브라우저와 HTTP의 기초에서 출발해 CSS와 접근성 있는 디자인을 살피고, 집중·텍스트·이미지·문서 마무리를 돕는 도구로 이어집니다.

Kurerat av moalier.picks Dela

1. 01#Development브라우저부터 이해하는 웹 개발 레퍼런스웹의 기본기, 주제별 수업, 브라우저 호환성, 접근성 구현을 작은 프로젝트 하나로 연결하는 학습 경로입니다. 프레임워크가 많은 일을 편하게 해주어도 페이지의 동작을 결정하는 것은 브라우저입니다. HTML, CSS, JavaScript와 접근성의 기초가 있으면 낯선 도구를 이해하기도 쉬워집니다. 직접 살피고 바꾸고 안전하게 망가뜨려 볼 수 있는 작은 프로젝트 옆에 두기 좋은 자료를 모았습니다. 이렇게 시작해 보세요 제목과 폼, 목록이 있는 작은 페이지를 만들어 보세요. MDN에서 기본 동작을 익히고 web.dev로 필요한 주제를 더 살핀 뒤, 새로운 기능을 쓰기 전 호환성을 확인하세요. 화면을 더 꾸미기 전에 키보드만으로 조작해 보는 것도 좋습니다. 함께 기억할 점 문제를 해결한 정확한 문서 주소와 무엇을 바꿨는지 함께 저장하세요. 언젠가 완주할 강의 목록 대신 실제로 도움이 되는 작업 노트가 됩니다.4 länkar
2. 02#Development프레임워크를 탓하기 전에 HTTP 요청 하나 읽기브라우저가 보내고 서버가 돌려주는 내용을 설명과 참고서, 요청 확인 도구로 살펴보는 목록입니다.3 länkar
3. 03#Development완벽한 시안 밖에서도 버티는 CSS 레이아웃레이아웃의 제약과 유연한 크기, 실제 내용이 들어오면 드러나는 문제를 설명하는 네 곳의 CSS 읽기 목록입니다.4 länkar
4. 04#Development느린 웹페이지를 설명할 수 있게 만드는 디버깅 작업대“느리다”는 느낌을 재현 가능한 관찰과 다음 행동으로 바꾸는 브라우저 도구 문서와 성능 자료입니다.4 länkar
5. 05#Design이유를 설명할 수 있는 디자인을 위한 레퍼런스사용성 연구부터 접근성, 인터랙션 원칙, 타이포그래피까지. 화면을 예쁘게 만드는 일을 넘어 판단의 근거를 찾는 네 곳입니다. 멋진 화면은 결과를 보여주지만 왜 잘 작동하는지까지 알려주지는 않습니다. 디자인 리뷰가 취향 대결이 될 때는 판단을 함께 논의할 수 있는 자료가 필요합니다. 사용자의 행동에서 시작해 접근성, 인터랙션, 읽기의 세부 조건으로 이어지는 자료를 골랐습니다. 이렇게 시작해 보세요 실제 화면 하나와 질문 하나를 고르세요. 행동을 쉽게 찾을 수 있는지, 키보드로 조작할 수 있는지, 글을 편하게 읽을 수 있는지부터 살펴보세요. 자료를 근거로 한 가지 수정을 제안하고 실제 사용자와 기기에서 확인해 보세요. 함께 기억할 점 원칙은 탐구의 출발점으로 사용하세요. 이름 붙은 법칙이 사용자의 과업을 이해하는 일을 대신할 수 없고, 체크리스트만 지켰다고 누구나 사용할 수 있는 제품이 되는 것도 아닙니다.4 länkar
6. 06#Design디자인 시스템에서 모양보다 판단의 이유 읽기컴포넌트를 예쁜 화면 모음이 아니라 내용과 동작, 접근성에 관한 결정으로 살펴보는 네 곳의 공개 자료입니다.4 länkar
7. 07#Design서체 이름보다 실제 문장으로 타이포그래피 판단하기실용적인 지침과 글자 크기 도구, 화면용 서체와 실제 사용 사례를 오가며 읽기 경험을 비교하는 목록입니다.4 länkar
8. 08#Design팔레트보다 실제 화면에서 색 대비 확인하기글자와 인터페이스의 색을 팔레트 미리보기 너머에서 비교할 수 있는 대비 검사 도구를 모았습니다.3 länkar
9. 09#Productivity집중이 필요한 일을 위한 작은 도구 상자타이머, 스케치 도구, 오피스, 노트. 서로 다른 역할을 가진 네 가지 도구에서 지금 필요한 하나만 골라보세요. 새 생산성 시스템을 익히는 데 정작 일보다 더 많은 주의를 쓰기도 합니다. 이 목록은 역할을 단순하게 나눴습니다. 할 일의 시간을 확보하고, 생각을 그려보고, 문서를 만들고, 다음에 돌아올 메모를 남기는 것입니다. 네 가지를 모두 도입할 필요는 없습니다. 이렇게 시작해 보세요 지금 일이 멈추는 지점 하나를 골라보세요. 시작이 어렵다면 짧게 시간을 정하고, 생각이 엉켰다면 그려보세요. 결과물이 분명하다면 문서를 열고 바로 시작하세요. 마칠 때는 다시 볼 곳에 다음 행동 하나를 구체적으로 적어두세요. 함께 기억할 점 처음에는 민감하지 않은 자료로 시험해 보세요. 중요한 작업에 쓰기 전 저장 위치와 공유, 내보내기, 동기화 설정을 확인하세요. 보기 좋은 화면만으로 데이터가 어디에 보관되는지 알 수는 없습니다.4 länkar
10. 10#Productivity모양이 맞지 않는 텍스트와 JSON을 위한 작은 작업대구조화된 글을 살펴보고 반복 가능한 변환을 적용한 뒤 다른 곳에 쓰기 전 결과를 확인하는 도구 세 가지입니다.3 länkar
11. 11#Productivity웹에 올릴 이미지 한 장을 준비하는 작은 작업대원본 편집과 압축 비교, SVG 정리, 짧은 애니메이션 확인을 역할별로 나눈 이미지 도구 목록입니다.4 länkar
12. 12#Productivity문서를 보내기 직전, 마지막으로 확인할 작은 도구들PDF 조합과 문장 비교, 글 다듬기를 통해 상대가 실제로 받게 될 파일을 확인하는 작업 목록입니다.4 länkar

Visa profil