طراحی وب سایت ساده با html

shape
shape
shape
shape
shape
shape
shape
shape

با طراحی وب سایت ساده با html شما میتوانید سریعا کسب وکار اینترنتی خود را ایجاد و توسعه دهید، دنیای امروز اینترنت در تلاش است تا کسب و کار سنتی دیروز را به کسب وکار اینترنتی امروز متصل کند . شبکه های اجتماعی و فضای وب سایت باعث بیشتر دیده شدن و در نهایت باعث افزایش فروش میشود.

شرکت سیماگر با حضور برنامه نویسان برتر چند ساله ایران و چین و هند توانسته است در زمینه طراحی سایت ، سئو و بازاریابی اینترنتی حضور پر رنگی داشته باشد..با طراحی وب سایت ساده با html شما میتوانید از بستر اینترنت به کسب و کار خود بپردازید و فرصت های فروش خود را با بهتر دیده شدن افزایش دهید.

shape main-pic

فروش

021 79942

تلفن شرکت

021 2222 1223

تلفن همراه

0912 144 23 55

خدمات ما

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

قبلا با ساز و کار کلی برنامه‌نویسی وب آشنا شدیم و حالا باید یک نگاه دقیق‌تر به مرحله اول برنامه نویسی وب، یعنی همان HTML داشته باشیم.

(توجه داشته باشید هدف این مقاله صرفا یک آشنایی اولیه است نه آموزش کامل HTML) ‌‌ زبان HTML یک زبان نشانه گذاری (markup language) است که برای ساختن صفحات وب ایجاد شده است.

اساسا زبان‌های نشانه گذاری نازل‌ترین زبان‌های برنامه‌نویسی هستند و بسیار ساده و ابتدایی عمل می‌کنند.

برای همین یادگیری آن‌ها عموما نیاز به ۵ دقیقه زمان برای فهم ساختار آن و یک دیکشنری برای ترجمه آن دارد! بگذارید یک مثال از خودم بزنم.

من از دوران مدرسه با دروسی مثل تاریخ و جغرافی و اجتماعی و … مشکل داشتم.

چون هیچ منطق خاصی نداشت، فقط نیاز به حفظ کردن داشت و من همیشه فکر می‌کردم هر موقع نیاز به این دانش‌ها داشتم فقط کافی بود به مرجع آن مراجعه می‌کردم.

اما در عین حال ریاضی و هندسه و … را دوست داشتم چون حس می‌کردم دارم با یک منطق زیبا آشنا می‌شوم با کلی معمای هیجان انگیز که با حل آن‌ها حس پیشرفت داشتم! اگر مثل من فکر می‌کنید کلا این بخش از برنامه‌نویسی برای شما کمی سخت خواهد بود چون در واقع HTML از نظر من همان تاریخ و جغرافی دنیای وب است! خیلی دور شدیم از بحث! گفتیم markup language ها خیلی ساده‌اند! یعنی فقط باید با یک نشانه بگوییم چه چیزی می‌خواهیم بگوییم.

مثال زیر را ببینید: ما یک چیزی را به زبان نشانه‌گذاری نوشتیم! وقتی کلی از این چیز‌ها کنار هم قرار بگیرند می‌شوند یک برنامه به زبان نشانه گذاری.

در کد بالا من گفتم یک قسمتی دارم به نام WellCome که محتوایی دارد شامل «سلام خواننده گرامی سایت! خوش‌آمدی به سایت من!».

با علامت <> به سیستم می‌فهمانم که این یک تگ است.

همچنین همانطور که یک تگ باز می‌شود باید بسته هم بشود.

با <WellCome> در مثال فوق تگ آغاز و با </WellCome> این تگ بسته شد.

تنها فرق بین باز و بسته شدن تگ صرفا اضافه شدن بک اسلش “/” به ابتدای تگ پایانی است.

طبیعتا وقتی می‌خواهیم این نشانه‌گذاری‌ها برای مرورگر‌ها (browser) قابل ترجمه باشند به آن ظاهری که مد نظر ماست، باید از تگ‌های استاندارد و از پیش تعیین شده‌ استفاده کنیم.

مثلا در تگ WellCome یک تگ استاندارد نیست و من از خودم خلق کردم.

چند تگ استاندارد را با هم مرور کنیم: در ابتدای هر سند HTML یا همان فایل‌هایی با پسوند .

html باید از تگ <!DOCTYPE html> استفاده کنم.

در واقع با این تگ من دارم اعلام می‌کنم سند من از آخرین نسخه HTML که همان HTML5 هست استفاده می‌کند.

برخی از تگ‌ها نیازی به بسته شدن ندارند.

مثل همین تگ که فقط باز شد.

بعد از آن تگ <html> را باز کردیم و در انتها بستیم.

کل تگ‌های ما باید در بین این تگ قرار بگیرد و به نوعی می‌توان گفت همه تگ‌ها بچه‌ها و نوادگان <html> تگ هستند.

تگ <html> به دو قسمت head و body تقسیم می‌شود.

پس با تگ های <body> و <head> این دو قسمت را ایجاد می‌کنیم.

در تگ <head> عموما تنظیمات سند HTML وارد می‌شود.

مانند عنوان صفحه، نوع کاراکتر‌ها، کلمات کلیدی و … اما در تگ <body> تمام آنچه می‌خواهیم در صفحه نمایش داده شود را وارد می‌کنیم.

مثلا در اینجا ما در قسمت head گفتم نوع کاراکترها از جنس UTF-8 است.

این نوع کاراکتر تمام کاراکترها را شامل می‌شود.

چون ما از زبان فارسی استفاده می‌کنیم حتما باید این تنظیم رو انجام دهیم در غیر این صورت در مشاهده خروجی کار به مشکل می‌خوریم.

این اتفاق با افزودن تگ افتاد.

این تگ هم مثل تگ <!DOCTYPE html> نیازی به بسته شدن ندارد.

(پیشنهاد می‌کنم یک‌بار نوع کاراکتر‌ها را تعیین نکنید و خروجی کار را مشاهده کنید.

)گفتیم در قسمت body هر آنچه می‌خواهیم نمایش بدهیم را وارد می‌کنیم.

من از تگ <h1> برای ایجاد یک تیتر استفاده کردم و داخل آن تیتر دلخواهم را قرار دادم.

بعد از آن از تگ <p> برای ساخت یک پاراگراف استفاده کردم و متن دلخواهم را در آن قرار دادم.

خوب حالا می‌خواهیم یک فایل HTML ایجاد کنیم و از آن استفاده کنیم.

کافی است یک فایل متنی (فایلی با پسوند .

txt) ایجاد و تگ‌ها را داخل آن قرار دهیم.

در انتها فرمت فایل که .

txt بود را به .

html تغییر دهیم.

من در اینجا اسم فایل را index.

html ثبت کردم.

به همین راحتی شما اولین صفحه وب خودتون رو ایجاد کردید! دیدیم که ساخت اولین صفحه وب به آسانی پشت سر گذاشته شد! حالا وقت آن رسیده که محتوایی را که با HTML در صفحه قرار دادیم بوسیله CSS زیباتر به نمایش بگذاریم.

در مقاله بعدی قصد داریم در خصوص CSS اطلاعاتی کسب کنیم.

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

image
shape
shape
shape
shape
shape
shape
shape

ارتباط با ما

image

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

جهت مشاوره و استعلام قیمت میتوانید از طریق شماره تلفن های زیر به صورت مستقیم با ما در ارتباط باشید

نمونه کارها

shape
shape
shape
shape

انواع خدمات

image
map