نظاره گر پیشرفت کسب و کار خود باشید ، وقتی اسپیناس وب جرئی از تیم شما می شود

تگ img
يکي از مهمترين عناصر در صفحات وب عنصر عکس است. طراحی سایت  برای قرار دادن عکس در فايلهای htmlاز تگ< >imgاستفاده ميشود. اين تگ يک تگ تهي بوده و نيازی به تگ پاياني ندارد. برای مشخص کردن تصويریکه بايد در صفحه قرار بگيرد بايد از ويژگي src1۵استفاده کرد که توسط اين ويژگي آدرس و نام فايل مشخصميشود.

صفت :alt

اين ويژگي، متني را به عنوان مقدار ميپذيرد و برای ايجاد يک متن توصيفي بر طراحی سایت  روی تصوير به کار ميرود اگر عکس مورد نظر پيدا نشود به جای عکس، آن متن را نمايش ميدهد. اين مشخصه بيشتر زماني کاربرد دارد
که وقتي تصوير به دليل هر مشکلي در صفحه ديده نشد کاربر بداند که چه تصويری را نديده است که در اينحالت متن توصيفي ويژگي altبه جای تصوير ديده خواهد شد.

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

مثال:

نکته: برای استفاده از تصوير در وب قبل از هر کاری يک پوشه با نام imgبسازيد و هر تصويری که قصداستفاده از آن را داريد در اين پوشه قرار دهيد.
توجه داشته باشيد تصوير در مکاني قرار خواهد گرفت که تگ imgدر آنجا نوشته شده باشد.
: width وheight صفات
امکان ديگری که شما مي توانيد در تگ < >imgداشته باشيد صفات heightو widthهست. طراحی سایتبا استفادهاين دو صفت ميتوانيد ابعاد يک تصوير را مشخص کنيد.
15
source
23
مثال:

لغت widthبه معنای عرض و لغت heightبه معنای ارتفاع است. به وسيله اين صفات ميتوانيدابعاد تصوير مورد نظر را تعيين کنيد. به جای px16ميتوانيد از ٪ نيز استفاده کنيد. برای فهميدن ابعاد تصويرشما ميتوانيد از برنامههای گرافيکي سودمند برای اينکه اين اعداد را تخمين بزنيد استفاده کنيد. روش ديگربرای پيدا کردن ابعاد عکس اين است که شما ميتوانيد آيکون مورد نظر را با drag and drapبه پنجره
مرورگر بکشيد و طول و عرض تصوير در titlebarمرورگر نشان داده ميشود.

برای ايجاد گالری و چينش تصاوير کنار هم هيچگاه تصاوير بزرگ را کوچک نمايش ندهيد. طراحی وب سایتچون حجم عکستغييری نميکند و در اين صورت صفحه شما دير loadميشود و کاربر همان عکس بزرگ را در نمای کوچک
ميبيند. بنابراين بهتر است تصوير را resizeکرده و تصوير کوچک را به کاربر نشان دهيد و تصاوير بزرگتر رابه آن لينک دهيد. (برای لينک دادن آن را با تگ < >aاحاطه کنيد).
نکته: برای ساخت گالری عکس، تصاوير کوچک را در پوشه smallو تصاوير بزرگ را در پوشه largeو درپوشه imgذخيره کنيد.
مثال:

صفت :titleاين صفت برای عکس نيز سِت ميشود که مقداری که ميگيرد طراحی وب سایتبا قرار گرفتن موس روی عکس
ديده ميشود.