آموزش سریع html و css استاد چابک

استاد امیر چابک مدرس گروه آموزش طلوع یکی از اساتید مجرب در زمینه برنامه نویسی می باشد، در اینجا دوره آموزش سریع html و css این استاد را برای شما فراهم آورده ایم. با ما باشید مارکتیکا

HTML چیست؟

html برگرفته از حروف اول عبارت HyperText Markup Language می باشد و به عنوان یک زبان نشانه گذاری متن ( زبان استاندارد صفحات وب ) می باشد.

معمولا در یک صفحه ی موجود بر روی وب مجموعه ای از متن ها، عکس ها، بخش بندی های مختلف وجود دارد، به کمک تگ ها و کدهایی که HTML در اختیارتان قرار می دهد، می توانید یک ساختار مشخص از اطلاعات را در این قسمت ها به وجود آورید و در معرض نمایش بازدیدکنندگان قرار بدهید. توجه داشته باشید که هر تگ در زبان اچ تی ام ال معنا و مفهوم خاص خود را دارد.

صفحاتی که توسط این زبان ساخته می شوند؛ متشکل از markup tag ها و دارای پسوند htm و یا html می باشند. این صفحات را می توان در برنامه های مختلف ادیتور مثل Notepad, Visual Stadio, dearm weaver و …. ویرایش کرد و تغییر داد.

در زبان html بخش ها و کدهای مختلف ( سمت سرور و سمت کلاینت ) توسط ” تگ ” از هم جدا می شوند و همین تگ ها ابزاری برای چگونگی نمایش دادن اطلاعات در صفحات وب و توسط مرورگرها هستند. در واقع تگ ها اشکال مختلف نمایش عناصر مختلف یک صفحه ی وب را تعیین می نمایند.

HTML یک زبان برنامه نویسی است؟

خیر ،اما به عنوان یک رابط به راحتی می تواند با زبان های پیشرفته ی برنامه نویسی مثل asp و php ارتباط برقرار نماید و جالب است بدانید که تمام برنامه های مرورگری که برای مشاهده ی صفحات وب به وجود امده اند از طریق اچ تی ام ال قادر به درک کدهای زبان های برنامه نویسی شده هستند، یعنی این کدها کامپایل شده و به کد قابل فهم برای مرورگرها تبدیل می شوند و در پایان توسط برنامه ی web browser برای کاربران به نمایش در می ایند.

یادگیری Html اصلا سخت نیست و با توجه به مجموعه کدهای مستندی که از آن وجود دارد، می توانید با صرف وقت و تمرین کافی، به آن مسلط شوید و به راحتی بخش ها و المنت های مختلف یک صفحه ی اینترنتی را طراحی نمایید.

برخی از تگ های اچ تی ام ال مرتبط با موضوع بهینه سازی یک صفحه ی وب برای موتورهای جستجو هستند و به صورت مستقیم بر seo تسایت تاثیر می گذارند، برای مثال : تگ title, description و تمامی تگ های مرتبط با ویرایش و تغییرات متن نظیر بولد یا ایتالیک کردن، لینک دادن به صفحات دیگر و … بر این اساس یک طراح وب سایت که به HTML و CSS مسلط باشد، می تواند با اطلاع از انواع تگ ها و نحوه ی استایل دهی، یک قالب سایت را از ابتدا کدنویسی کند به گونه ای که فاقد کدهای مخرب و خطا باشد و اصول سئو نیز در آن رعایت شده باشد. قطعا طراحانی که به طراحی تمپلیت تسلط دارند، موفق تر از کسانی هستند که از قالب ها و کدهای آماده استفاده می کنند.

CSS چیست؟

سی اس اس کوتاه شده یا مخفف عبارت Cascading Style Sheets می باشد که قابلیت صفحه آرایی؛ استایل دهی و زیبا سازی صفحات وب را برای طراحان سایت فراهم می سازد.

در واقع ساختار یک صفحه با استفاده از اچ تی ام ال تعیین می شود و سپس با به کار بردن کدهایی دیگر به این ساختار و چیدمان استایل داده می شود. تمامی رنگ ها، ابعاد و اندازه ها، حاشیه ها، مکان قرارگیری، فونت ها و سایر خصوصیات اجزای یک صفحه ی وب، با استفاده از css تعیین خواهند شد.

این خصوصیات هر تغییری که داشته باشند توسط مرورگرها برای کاربران قابل نمایش خواهند بود؛ زیرا سی اس اس یک استاندارد مشخص تعریف شده برای برنامه های مرورگر اینترنت است و به همین دلیل می توان یک صفحه ی وب را در مرورگرهای مختلف به صورت یکسان دید.

معمولا در شیوه های نوین طراحی سایت تمامی کدهای مرتبط با css در یک فایل جداگانه قرار می گیرد و دیگر از استایل دهی inline ( در داخل هر تگ HTML ) استفاده نمی شود؛ زیرا این کار از لحاظ سئو برای صفحات وب مناسب نیست. پس در یک تعریف کلی با استفاده از css می توان فرم و استایل دلخواه را برای یک صفحه ی وب ایجاد کرد به گونه ای که زیبا، جذاب، کاربردی و کاربرپسند باشد

در این آموزش با ارائه مثالهای مختلف در این خصوص، شما را مرحله به مرحله همراهی نمائیم . نسخه زبان طراحی اچ تی ام ال در این آموزش نسخه 4 و برای استایل شیت یا همون سی اس اس نسخه 2 میباشد.

منبع: با تشکر از گروه آموزش طلوع