Email Signature Design In Adobe Illustrator cc 2021 | Tutorial

Поделиться
HTML-код
  • Опубликовано: 16 сен 2024
  • In this video tutorial,
    --------
    I will show you how to design email signature in adobe illustrator cc 2021, you will learn email signature design in easy way using basic shapes and tools in adobe illustrator. Also make sure to set the raster effects to (72 ppi) while creating size of email signature.
    --------
    Here is video tutorial link below. I showed How to create Clickable HTML Email Signature. • Clickable HTML Email S...
    --------
    Thanks for watching.
    Keep learning.
    #EmailSignature #EmailSignatureTutorial #AdobeIllustrator

Комментарии • 48

  • @JuanDiegoZarate-e6n
    @JuanDiegoZarate-e6n 2 месяца назад +1

    Hey, I wanted to first say your video helped me a lot. I have one issue though, when I preview / export my design to web it looks blurry, even when I followed your settings. All about coding and the rest is fine but when putting the signature on my email it looks bad. Hope you or anyone reading can help me with this, thanks.

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Месяц назад +2

      @JuanDiegoZarate-e6n The quickest way to fix this is to use a higher resolution image in your email signature, and scale the image down using the HTML height and width attributes. For example, if the resolution of your image is 360 x 360 pixels, you should use 1/3 of that resolution in the height and width attributes.

  • @waqarhussain8919
    @waqarhussain8919 3 года назад +2

    Awesome, informative and easy to understand. Thank you!

  • @muhammadumer7365
    @muhammadumer7365 3 года назад +2

    Great Informative Video!!!
    Keep it up 👍🏻

  • @audreycarrie989
    @audreycarrie989 2 года назад +2

    Hi, thank you ! I've one question ! What is the best way to export the logo and preserve the quality of the image once exported to outlook?

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +2

      The best way to export the logo to keep the image quality high use the option called “ Export” and then save as png in (300 ppi) or if image then save as jpeg in (300 ppi) so that will be high resolution in high quality will be good.

  • @MrBananakopf
    @MrBananakopf 2 года назад +2

    would've like to seen it in use, I have a huge problem by it being pixelated when I use it as an mail signature

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +2

      Hi Rossi, if your design pixelated you have to make sure the resolution is high (300 ppi) when you export as jpeg or png. Hope this helps

    • @MrBananakopf
      @MrBananakopf 2 года назад +1

      @@DESIGNERWAQASGRAPHICS unfortunately it doesn't help. I'm on this problem for 2 days now. So most people tend to try keeping the file as small as possible around 30-50kb big max 200kb (taking server space = electricity = price). And I made a clean design in illustrator but it's a bit blurry when used as a mail signature. I have it at 72dpi at 600*200px, even doubling the dpi to 150 will double the height and width to 1200*400 aprox. I really can't find a good workaround....

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +1

      @Rossi I’m sorry if that didn’t helped. I want to know did you also tried another option “ Save for Web” in export menu, you can try that maybe helps. Save for web option gives you exact height and width with less kb’s.
      The purpose of the Save for Web feature in Adobe Illustrator is to optimize graphics for use on a Web site or other screen display, such as a phone of tablet. The word "optimize" refers to the optimum balance between file size and quality.

    • @MrBananakopf
      @MrBananakopf 2 года назад +1

      @@DESIGNERWAQASGRAPHICS yes unfortunately. I tried many things... But I saw a lot of people using html or css to code the mail signature, maybe it's my last straw.

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +1

      Yes for the best quality you have to use html or css to code the mail signature.

  • @yushaharisanees2334
    @yushaharisanees2334 3 года назад +2

    👍👍👍👍👍👍👍😊

  • @kelvinkinyanjui2364
    @kelvinkinyanjui2364 2 года назад +1

    Hi, Is 1350 by 45o recommended for this design?

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +2

      No it’s not recommended size I only used this size for front end. You can use width 600 px by height 200 px and also make sure to set the raster effects ( 72 ppi ) for this design. I also showed in new video about the recommended size for this signature. Here is new video link ruclips.net/video/9VagizlpHNc/видео.html

  • @nicardo82
    @nicardo82 2 года назад +1

    Can you make a video showing how you put this design in use please

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +2

      Will do in upcoming video :) thanks

    • @leoruzito
      @leoruzito 2 года назад +1

      @@DESIGNERWAQASGRAPHICS please, can you explain how??

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +1

      I will do in next videos :)

    • @leoruzito
      @leoruzito 2 года назад +1

      @@DESIGNERWAQASGRAPHICS I appreciate

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  2 года назад +2

      Here is video tutorial link. I showed How to create Clickable HTML Email Signature. ruclips.net/video/9VagizlpHNc/видео.html

  • @mercedestuck9992
    @mercedestuck9992 Год назад +1

    Won't this make the links fail though? As it will be one image, you won't be able to set separate links for social icons or your website

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +2

      @Mercedes Tuck This is just email signature design and one image I showed how to make email signature in this tutorial. I also have tutorial in my channel where I showed how to make this email signature HTML clickable.

    • @mercedestuck9992
      @mercedestuck9992 Год назад +1

      @@DESIGNERWAQASGRAPHICS Oh my goodness, thank you! Can you please provide a link to that video?

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      You’re welcome. Link is below 👇
      ruclips.net/video/9VagizlpHNc/видео.html&feature=shares

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      First you need to create new folder in the desktop or in any drive, where you can save the email signature and sliced images from email signature. Then go to visual studio code and click to File menu, inside file menu click to open folder, and open the folder you created for email signature which contains sliced images folder. After you open the folder then you will be able to start coding like I did . You don’t have to start new project. Hope this helps

  • @yoko2231
    @yoko2231 Год назад +1

    After designing the AI, what do I do next to use it?

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      After designing the AI, You have to code it in order to use it as email signature. You can follow the tutorial for that. Hope that helps

    • @yoko2231
      @yoko2231 Год назад +1

      @@DESIGNERWAQASGRAPHICS Do you have a video tutorial for coding?

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      @@yoko2231 yes I do

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      @@yoko2231 here is link for my tutorial to code email signatures. ruclips.net/video/9VagizlpHNc/видео.html

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      You can also use the image only for email signature without coding if you don’t want it clickable but if you want clickable links in email signature then the coding is must.

  • @sandraschultz3104
    @sandraschultz3104 Год назад +1

    scrolling text on bottom too fast for learning

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +1

      Understood but you can slow down the video by going into video speed settings ⚙️ and slow the video speed as much you like. Hope this helps

  • @sandraschultz3104
    @sandraschultz3104 Год назад +1

    no export informationm

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад +2

      Export is easy, after design complete go to File menu and there you will find export option. click export then save as pdf or any file format you need then click on save to desired location.
      I also have this tutorial where I showed how to code this email signature to make it clickable using Adobe photoshop and Visual studio code. Link is here ruclips.net/video/9VagizlpHNc/видео.html&feature=shares

  • @alexmcfadden3986
    @alexmcfadden3986 Год назад

    You created the file at 300ppi but declare create it at 72ppi, btw.

    • @DESIGNERWAQASGRAPHICS
      @DESIGNERWAQASGRAPHICS  Год назад

      @alexmcfadden3986 The first file I created in 300ppi was just design file, not for clickable html use. The 72ppi was for html clickable email signature.

    • @alexmcfadden3986
      @alexmcfadden3986 Год назад

      ah, your closed captions say 72, for me mate! no worries @@DESIGNERWAQASGRAPHICS