Useful bookmarklets for web designers and developers Noderīgas bookmarklets Web dizaineriem un izstrādātājiem

ADVERTISEMENT REKLĀMA
To get our software and web/tips via email, sign up for Lai veicinātu mūsu programmatūru un web / padomus pa e-pastu, pierakstīties daily email newsletter ikdienas e-pasta biļetens . .
Subscribe to RSS feed Subscribe to RSS feed or vai follow me sekojiet man on Twitter? on Twitter?

Noderīgas web izstrāde un dizains bookmarklets Bookmarklets are bookmarks containing snippets of JavaScript code. Bookmarklets ir grāmatzīmes satur fragmentus JavaScript kodu. They can be used to accomplish specific tasks. Tie var tikt izmantoti, lai veiktu noteiktus uzdevumus. Web developers can quicken several common operations by using bookmarklets. Web izstrādātāji var paātrināt vairākas kopīgas darbības, izmantojot bookmarklets. Best of all, bookmarklets do not slow down your web browser like extensions do. Best of all, bookmarklets nav palēnināt jūsu pārlūkprogrammā kā paplašinājumi darīt. For example, some of these bookmarklets together can effectively substitute the Web Developer Firefox addon (if you crave for them in other browsers). Piemēram, daži no šiem bookmarklets kopā var efektīvi aizvietot Web Developer Firefox addon (ja jūs kārot par tiem citiem pārlūkiem).

To save these bookmarklets, just right click on the link to the bookmark and save it into your bookmark folder OR drag the bookmarklets to your Bookmarks toolbar. Exception: The first three bookmarklets (first two list elements) are links to pages containing the bookmarklets, as I found them difficult to embed here. Lai saglabātu šos bookmarklets, vienkārši nospiediet uz saites, lai grāmatzīmi un saglabājiet to savā grāmatzīmju mapi vai velciet bookmarklets uz savu grāmatzīmju rīkjoslā. Izņēmums: pirmās trīs bookmarklets (pirmās divas saraksts elementiem), ir saites uz lapām, kas satur bookmarklets, kā es atradu tos grūti iestiprināt šeit.

To use a bookmarklet, simply right-click on it and choose “Bookmark Link”. Lai izmantotu bookmarklet, vienkārši labo pogu noklikšķiniet uz tā, un izvēlieties "Pievienot grāmatzīmēm Link". I would recommend placing them into a folder in the toolbar, so that any bookmarklet can be accessed with 2 clicks. Es ieteiktu laist tos mapi rīkjoslu, lai jebkura bookmarklet var piekļūt ar 2 klikšķiem. I find that to be the least-cluttered and easiest-to-use arrangement. Es uzskatu, ka, lai būtu mazāk pārblīvēta un vienkāršākajiem-to izmantošanas kārtību. Onto the bookmarklets then. Uz bookmarklets tad.

ADVERTISEMENT REKLĀMA

  • Updated 07 July 2008: Updated 07 July 2008:
    XRAY XRAY : :
    See the box model for any element on web pages. Skatīt aili modeli jebkurš elements tīmekļa lapās.
  • Test Styles Test Stili and un Edit Styles Rediģēt Stili : :
    Test Styles gives you a new tab/window to type CSS rules for the original webpage. Test Styles dod jums jaunu tab / window tipa CSS noteikumus sākotnējā lapā. The styles are applied to the webpage immediately. Stili piemēro webpage nekavējoties. Edit Styles is similar, except that you start with the CSS styles for the page. Edit stili ir līdzīgs, izņemot to, ka jūs sākat ar CSS stilus lapā. [thanks, [thanks, Nick Nick ] ]
  • W3C HTML Validator W3C HTML Validator : :
    Validate the document that you are currently viewing. Apstiprināt dokumentu, kuru Jūs šobrīd aplūkojat. Great for on-the-fly validation checks while coding pages. Great for on-the-fly datu pārbaudes laikā kodēšanas lapas.
  • W3C CSS Validator W3C CSS Validator : :
    Validate the CSS of the webpage that you are currently viewing. Validate CSS ir Web lapas, kuru Jūs šobrīd aplūkojat. Useful for quick checks during CSS coding. Noderīgas ātru pārbaužu laikā CSS kodu.
  • Resize Viewport: Resize viewport: 800×600 800 × 600 , , 1024×768 1024 × 768 , , 1280×1024 1280 × 1024 and un 1600×1200 1600 × 1200 : :
    See how your web page looks like, in different resolutions. Redzēt, kā jūsu web lapas izskatās, dažādās rezolūcijās. Quickly switch between 800×600 to 1600×1200, the two extreme resolutions normally considered in web design. Ātri pārslēgtos no 800 × 600-1.600 × 1200, divas galējās rezolūcijas, ko parasti uzskata in web dizains.
  • View Cookies View Cookies and un Toss Cookies Toss Cookies : :
    View the cookies stored by the current page (using the first link). View cookies uzglabā pašreizējā lapā (izmantojot pirmo saiti). Then toss the cookies that you wish to, by using the second link. Tad lozēšana sīkdatnes, jūs vēlaties, izmantojot otro saiti.
  • NetCraft Netcraft : :
    Tells you server details of a site and displays uptime graph. Pastāstīts serveris ziņas par vietu un parāda uptime grafikā.
  • Replace with Alternate Text Aizstāt ar Alternate Teksts : :
    Useful to check for images that do not have alt tags. Noderīgs, lai pārbaudītu attēliem, kas nav alt tagus. The downside is that it removes only <img> tags, leaving intact buttons and images created using CSS or sprites. Negatīvie ir tāda, ka paņem tikai <img> tagus, atstājot neskartu pogas un attēlus, kas izveidoti, izmantojot CSS un sprites.
  • Alexa Snapshot Lookup Alexa Snapshot Lookup : :
    Look up your website details and snapshot at Alexa, a popular web metrics website. Uzmeklēt Jūsu mājas lapas datus un momentuzņēmums pēc Alexa, populāro web metrics mājas lapā.
  • Whois Lookup Whois Lookup : :
    Lookup the WhoIs of the domain you are on. Uzmeklēšanas Whois par domēna jūs atrodaties.
  • Edit current website Rediģēt pašreizējo mājas lapa : :
    Edit the current page – add text, delete text, move web elements around etc. – all without the need for any other extension. Rediģēt pašreizējo lapu - pievienot tekstu, svītrot tekstu, pārejiet tīmekļa elementi tuvumā uc, - visiem bez vajadzību pēc citiem pagarināšanu.
  • Search selected text in Google Meklēt atlasīto tekstu Google : :
    Although not strictly related to web design/development, Google searches can be useful to look up various terms and techniques in presentation and scripting languages. Lai gan nav tieši saistīti ar web dizains / izstrāde, Google meklēšanu var būt noderīga, lai sameklētu dažādas noteikumus un metodes, noformējums un skriptu valodām.
  • Image Drag Image Drag : :
    Drag and rearrange images seamlessly from within a page. Velciet un pārkārtot attēlus nemanāmi no iekšpuses lapā.
  • Grab screenshot Grab screenshot : :
    Grab a screenshot of the page that you are viewing, without using any other installed application. Greifers screenshot lapā, skatāt, neizmantojot citus uzstādīta pieteikumu.
  • Color List Krāsu List ( ( use this izmantojiet šo instead for IE): vietā IE):
    Lists colors used in the current webpage. Sarakstus, krāsas, ko izmanto pašreizējā lapā.

Further Bookmarklet resources Tālāk Bookmarklet resursi

You might also want to read through these collections of bookmarklets: Jūs varētu arī gribu izlasīt šos bookmarklets kolekcijas:

  • WebDev at Squarefree WebDev at Squarefree : :
    A large collection of bookmarklets useful for web designers and developers. Liels krājums bookmarklets noderīga web dizaineriem un izstrādātājiem. Maintained by Jesse Ruderman. Uztur Jesse Ruderman.
  • Useful bookmarklets for casual web users Noderīgas bookmarklets ikdienas interneta lietotāji : :
    A guest post that I wrote on DailyApps.net. Viesu pastu, ka esmu rakstījis par DailyApps.net. It lists useful bookmarklets for everyone. Tajā uzskaitītas noderīgs bookmarklets ikvienam. Most of them speed up or automate commonly used tasks, which no doubt helps designers and devs too. Lielākā daļa no tām paātrināt un automatizēt parasti izmanto uzdevumiem, kuri bez šaubām palīdz dizaineru un devs too.

As is usual with my resource posts, this list will be continuously updated as recommendations come in. Kā parasts ar saviem resursiem posts, šis saraksts tiks pastāvīgi papildināts, ieteikumi come in Contact us Contact us to recommend bookmarklets. ieteikt bookmarklets. Tell us what are your favorite bookmarklets – for web development or otherwise – I'm sure we can all benefit from new bookmarklets shared by others. Pastāstiet, kādas ir jūsu mīļākie bookmarklets - tīmekļa attīstībai vai citādi - es esmu pārliecināts, ka mēs visi varētu gūt labumu no jaunajām bookmarklets kopīgi ar citiem.

To get our latest articles, Lai veicinātu mūsu jaunākos rakstus, click here to sign up noklikšķiniet šeit, lai piereģistrētos for our free email newsletter or subscribe to mūsu bezmaksas informatīvais biļetens e-pastu vai parakstīties uz RSS feed RSS feed

§ Comments § Komentāri
  • punne4e says: punne4e saka:

    Hello buddy!! Hello buddy! i want to say that short but sweet link,you should also add differ browser list in which one can test his/her website by the way its good that you share it with us.Have a good day. Es gribu teikt, ka īsu, bet salds saiti, jums vajadzētu pievienot arī atšķirties pārlūku sarakstu, kurās viena var pārbaudīt viņa / viņas mājas lapā pēc kā tās labi, ka jums tajā dalīties ar us.Have labu dienu.

    God bless you. God bless you. Punne4e Punne4e

  • Nick Z says: Nick Z says:

    I find Man https://www.squarefree.com/bookmarklets/webdevel.html#test_styles https: / / www.squarefree.com / bookmarklets / webdevel.html # test_styles invaluable – I'll create a HTML document, and then using that bookmarklet I can shape the stylesheet in realtime. nenovērtējams - I'll izveidot HTML dokumentu, un tad, izmantojot šo bookmarklet varu veidot stilu ir reālā. It's also very handy for writing user stylesheets. Tas ir ļoti ērts rakstīšanai lietotāja stilu.

  • sunny beach says: Sunny Beach saka:

    This is pretty good, for those who are forced to do some work on the fly Tas ir diezgan labs, tiem, kuri ir spiesti darīt kādu darbu par fly

  • Sumesh says: Sumesh saka:

    @Nick Z: Excellent suggestion about style testing bookmarklet, will update the post soon. @ Nick Z: Excellent ierosinājums par stila pārbaude bookmarklet, atjauninās pēc drīz.

  • Pras says: Pras saka:

    Hi Sumesh, I just came across your blog. Hi Sumesh, es tikai nāca pāri jūsu emuāru. Good work. Labu darbu. Keep it up. Keep it up. Will try to read all your future posts. Mēģinās lasīt visu savu nākotni posts.

  • Keith Dsouza says: Keith Dsouza saka:

    Just saw how useful these shortcuts can be in a post by QQT, bookmarked for future uses Redzēju, kā lietderīgi šos īsceļus, varat būt iesūtīja QQT, grāmatzīmi nākotnes vajadzībām :)

  • Arnaud L says: Arnaud L says:

    The “Edit current website” is a nice bookmarklet, but lacks what the “Live Website Editor” bookmarklet has to offer. "Edit Pašreizējā website" ir jauka bookmarklet, bet trūkst kāda "Live Website Editor" bookmarklet var piedāvāt.
    Among other things, it can persist the modifications made to any webpages (at least it's its purpose). Cita starpā, tas var saglabāties labojumiem jebkuru interneta lapas (vismaz tas tā mērķis).
    You can find it here: Jūs varat atrast šeit: http://code.google.com/p/lwe/ http://code.google.com/p/lwe/
    It's still in an early version but it works on most of the websites. Tas joprojām ir agrīnā versija, bet tā darbojas lielākajā daļā no mājas lapām.
    Cheers Urravas

    • Sumesh says: Sumesh saka:

      @Arnaud L: @ Arnaud L:
      That's a useful bookmarklet, and being persistent would likely be useful for many more web users. Tas ir noderīgs bookmarklet, un ir noturīgas, visticamāk būtu noderīga daudz vairāk interneta lietotāju. I will post the bookmarklet in a future post rounding up more useful bookmarklets – so thanks for the recommendation. Es post bookmarklet kas nākotnē pēc noapaļošanas uz augšu noderīgāku bookmarklets - tā paldies par ieteikumu.

  • § Leave a Reply § Atstāt Atbildēt